‘HTML & CSS, design and build websites’ book review

26 Sep 2012

One of the books I've been reading the past couple of weeks is "HTML & CSS, design and build websites" by Jon Duckett. I particularly chose this book because of its beautiful light design, clean layout, the way things are visually presented, and more importantly it's very well explained too. This book makes learning a dull technical matter like this more pleasant. It's a book for anyone who wants to learn to design and build websites, and needs a starting point.

If you are proficient already this book will be a lightweight, but that's just in terms of content really, because the book counts about 490 pages. After checking out the Table of Contents, I could already tell that each aspect of HTML and CSS would be covered in a logical order. Before jumping right into the coding part, Jon gives us an introduction about the structure of the book, explaining what HTML and CSS is, followed by a brief explanation of how people access the web, and how websites are created. Each chapter starts with a short introduction of the key topics, and ends with a summary of what was covered. Every chapter also contains a well explained practical example page with complete code, and a reference link of where you can find it online.

The first half of the book is all about HTML, explaining every aspect. In this part of the book, the chapters summary pages are colored blue, and blue is also used as highlight color in the introduction page. The second part of the book is all about CSS, with pink as highlight color for the summary and introduction pages.

The HTML section

The very first thing you learn is how HTML is structured, and what elements, tags and attributes are. You'll get a detailed explanation based on an example page, and everything is visually presented to help you better understand the basic components of the HTML markup language. Next, you'll get to see how you create and save your first basic HTML webpage for both Mac and Windows, all documented with photos, explaining each step along the way.

Once you understand these basics, the book continues by going through all of the HTML aspects. Each HTML element is covered, starting with the 'Text' related elements, explaining their semantic information, and structural purpose. Next are 'Lists', 'Links' and 'Images', each with their own chapter. In the chapter of 'Images' you'll also get a lot of basic information on how to save them, which file format to use, info about file size, dimensions, transparency, cropping, things like vector-based versus pixel-based etc. Nearly everything is covered for the beginning user. Then the book continues its list of HTML elements: 'Tables', 'Forms'… The ’Forms’ chapter is a really extended one, as there is a lot to cover. Everything there is to know about forms is explained and demonstrated in a clear and easy to understand language. This helps a lot when you are just starting to wrap your head around it all.

A lot of attention went into the last chapter of the HTML section of the book, about ’Flash, Video & Audio’. It explains how you can add Flash movies into your site, giving you the pros and cons of using Flash, and when to use it and when not…, how to add video and audio to your site, using HTML5 elements. Right before the last chapter of this section, there is a chapter about ’Extra Markup’ explaining the different versions of HTML, identifying and grouping elements, comments, escape characters, meta information and iframes.

The CSS section

Like previously you’ll first start with a full introduction on what CSS is, what it’s used for and how it works. The first chapter also explains the structure of CSS, explaining rules, properties, and values. Furthermore, you’ll learn about internal and external CSS, how CSS rules cascade, and about inheritance. Once that is out of the way, the book covers everything there is to know about 'Color', starting with some color theory background information, info about different types of values (hex, RGB,HSL,…), info about hue, saturation, brightness and contrast, opacity… followed by the CSS properties ’color’ and ’background-color’.

After 'Color' comes the very extended chapter about ’Text’, explaining all the properties that allow you to control the appearance of text. The book also pays attention to typeface terminology, and gives the reader a brief introduction to basic typography. Furthermore you'll get an overview of the possible techniques you can use to apply a wider choice of typefaces, each with their pros and cons. The different types of units of type sizes, how type scales, and font formats, are also covered. A more technical part for the beginning user is about pseudo-elements, pseudo-classes, and attribute selectors.

The next chapter is about ’Boxes’ starting by explaining the box model in its full detail, how to control the size of a box, everything that is related to borders, padding and margins…, how to show and hide elements using the display and visibility properties, and all other basic aspects that have to do with this very important subject, such as how you can turn a block-level box into inline boxes and vice versa. Next item is all about 'Lists, Tables and Forms' where you learn about specifying bullet point styles, adding borders and backgrounds to tables, and how to change the appearance of form elements, all combined with a handful of tips on do's and dont's.

A big chapter is spent on the subject of 'Layout' as there is a lot to cover here. This chapter is about controlling the position of elements, where you'll learn all about the different types of positioning and floating… But before you'll go right into the coding part, you'll get introduced by the principles and key concepts of this matter so you get a better understanding of how this all works. Jon will also help you in understanding basic stuff such as the difference between screen sizes and screen resolution, page size, fixed versus liquid layouts,… It's all covered, even very practical information about layout grids, and some basic info on CSS frameworks. The last CSS chapter is about 'Images' where you learn how to control the size and alignment of your images using CSS. You'll learn how you can apply background images to boxes and create rollover images, but you'll also learn how to create gradient backgrounds using CSS3.

HTML5

Once you worked your way through everything you need to know about HTML and CSS (to get started), you'll learn about HTML5. It's covered at the end instead of earlier in the book because it makes it easier to understand how you can use HTML5. Structuring the book this way makes sure you understand the basics of what you can do with CSS to control the layout of a page.It's needed because in this chapter you'll learn about the HTML5 layout elements, and how they offer a helpful alternative to the div element. You'll also find out how older browsers recognise these elements.

Practical information

The two last chapters of the book give you a lot of other practical information you need to know to get started. There is a chapter about 'Process & Design' which gives you info on how you can understand your site's audience, info on how to organise information so the user can find what he's looking for, design tips to help you create a more attractive and professional site. You'll learn about sitemaps and get to know a simple technique that helps you build one. Next you'll learn about wireframes and visual hierarchy and tips on how to get your message across. There are a ton of other design related tips and principles explained in this chapter as well. The very last chapter is about SEO, analytics and how to put your site online, introducing you to FTP, domain names and hosting, but keeping the more technical part to the bare minimum, making it all very comprehensible for the beginning or less tech-savy people.

Conclusion

The book is aimed to anyone who wants to learn to design and build websites, or anyone who has a website (maybe using a blogging software, or any form of content management system), and wants more control over the appearance of their pages. The book is really very well structured and explained, both visually and content-wise and complex topics are simplified with the use of infographics. The book covers more than just the coding part, it also explains a lot of basic things you need to know to get a full understanding of the web and web design. It covers nearly everything you need to know to get started, and is full of practical tips and information. The book's approach to learn about HTML and CSS is done in a very logical order, placing HTML5 at the end in a separate chapter. Its clean design, the logical structure & completeness, and easy to read style, is what makes this book stand out in my humble opinion. It makes this book very inviting to read, and for people with an eye for design, attractive to learn about this technical stuff. The fact that it is so complete makes this a perfect book that I will recommend to anyone who is just starting out, or to the print designer that wants an introduction into the world of web design.

Comments

  1. 1 Alex 26 Sep 2012

    Nice

  2. 2 Jean-François Fortin 28 Sep 2012

    Added to my list of books to read this Fall. I looked at it last May but I wasn’t convinced. I’ll go at Indigo! tomorrow afternoon to get my copy.

    Thanks for sharing your thoughts on this release.

  3. 3 matt 28 Sep 2012

    Book looks fantastic, will have to try and find a copy. Is it out in the UK?

  4. 4 Kamiel&Odille; 28 Sep 2012

    Ha, ik heb het boek ook een paar weken geleden gekocht, juist omdat het zo’n mooie vormgeving heeft (en omdat ik HTML moet leren …)

  5. 5 Debbie 04 Oct 2012

    The book is fantastic. I know html and css, but I just loved the way it’s looking. My husband is learning it, so he will use if often I hope :)

  6. 6 NikosX 12 Oct 2012

    Very nice book, clean design and easy to read. Added to my list of html&css; books.

The Deck

Ads via The Deck