ISSUE 38   Summer 2003    |  updated 5/29/03   

 

There's no shortage of books to help you learn how to use Cascading Style Sheets (CSS). If you're not already up to speed on this approach to web design, you'd better get one and read it right away! My favorite, for now at least, is Eric Meyer's clear and approachable project-based book.

  
 
 

cover of Eric Meyer on CSS
Eric Meyer on CSS: Mastering the Language of Web Design
Eric Meyer, 2002, New Riders Publishing, paperback: 352 pages. ISBN: 073571245X
[ more reviews, buy at Amazon]

In the interest of full disclosure, I'll tell you that I know Eric and think he's a great guy, so I may be biased. For a second opinion, here's what web authority Jeffrey Zeldman (Daily Report, A List Apart) has to say:

"In today's Web, there are perhaps a dozen people who know CSS as intimately as Eric Meyer. Of those few experts, you can count on the fingers of one hand the number who can explain even the trickiest CSS concept so that the average working Web designer can comprehend it."

So, what about the book? Well, it starts on page 1 with a quote from Yoda: "Unlearn what you have learned."

OK, so maybe Yoda's not your cup of tea, keep on reading anyway. Chapter One is the first of 13 projects, converting an existing table-based page layout to a combination of HTML and CSS. As you work your way through the book—yes, that's the idea, you don't just read it, you work on actual web pages—the projects get progressively more ambitious.

This won't hurt a bit
The beauty of Eric's approach is that you learn the terminology as you go, in the form of short sidebars like "What is a Declaration?" and "What's a Rule?" It's like taking nasty-tasting medicine with a spoonful of sugar. The hardcore stuff that can be tedious and confusing comes in small doses, surrounded by things to do that are interesting and challenging. There's a sense of humor that helps, too. The first discussion of working with the <body> tag is titled "Healing the Body."

Another strength of this book is its extremely logical, well-ordered approach. Each chapter starts by listing Project Goals, followed by Preparation (usually downloading tutorial files from the book's companion website), Laying the Groundwork (an overview of the approach to be taken), Styling the Document (what we came here for) and ends with Branching Out (variations on the techniques just covered).

What you'll learn
screen shotThe projects/topics themselves are well-chosen. The first, Converting an Existing Page, is designed to win over any doubters in the crowd. The existing page created with tables and <font> tags, looks very familiar. We've all done some variation of this one, so why not start by duplicating in in CSS? Twenty-nine pages later we've got a nearly identical version that's a 35% smaller file. We've cut the download time by 1/3rd, and that's just one page. Multiply this by the number of pages in your site and you can see how you'll make users happier and save money on bandwidth as well.

Other topics cover a wide range of situations: a calendar, online greeting card, multi column layouts, etc. As you re-create each of these you move further and further into the world of CSS. If you're the kind of person who favors experiential learning, learning by doing, you'll feel right at home.

Don't take my word for it
I never buy a book without checking Amazon to see what others have to say about it. In this case, the answer is clear: a five-star (highest possible) rating. The few negative reviews point out the weakness of any project-based book: if what you want to do isn't covered in one of the projects, you're out of luck. There is no complete, comprehensive explanation of CSS in general. Other books take that approach, and we'll review a couple of them soon.

To help you decide whether this book is for you, visit the book's website: ericmeyeroncss.com. You'll get a complete table of contents that includes screen shots of the various projects. To learn more about Eric, visit meyerweb.com. To see some of his innovative CSS experiments, check out CSS/Edge.

 

    
 
TOP | HOME  |  ABOUT  |  EMAIL US