running words around
design education and visual communication
authored by chris m hughes

Eric Meyer's Smashing CSS

Sunday, 27 February 2011

In case you didn't already know, Smashing Magazine is one of the world's most popular design resources on the web.

The site contains a staggering amount of useful information and features a comprehensive archive of great tutorials, articles and reviews. It also publishes in print, with a book series of titles focusing on specialist areas of innovative instruction for designers.

The latest release is 'Smashing CSS - Professional Techniques for Modern Layout', by the international-renowned css expert Eric Meyer, and I have been reading an evaluation copy - one of the few remaining perks of academia.

CSS is such a vast area that it can be difficult to know where to begin and what to include or omit from the canon of techniques and issues. There are thousands of resources all of which seem to talk about the same things but never in the same way.

In Meyer's case, we get a clear, logical presentation, with three basic sections - fundamentals, essentials, and cutting edge.

Section one begins with a round-up of useful tools, covering every main browser (even IE9), and then deals with the basics, providing great clarity on traditionally fuzzy concepts like reboot styles, specificity and descendant selectors.

Here Meyer unleashes his formidable knowledge and gives us a wealth of tips and tricks, and discusses around 15 layout techniques, including Meyer's own Liquid Bleach technique, the simple two/three columns, clearfix, One True, Holy Grail, em-based layout and fluid grids.

Meyer qualifies the range of options by acknowledging what web designers have always known but were afraid to admit (presumably because they love web design so much) - that no matter how much you know and love about CSS, it still doesn't provide one clean simple obvious way in which to construct a page layout.

Cutting Edge
The third section looks at cutting edge techniques and here we get a major surprise with a chapter on tables - enough to force a wry smile from old-era designers, and a real revelation for the new generation who have only ever thought in terms of the div.

Finally, Meyer takes us through a series of simple but effective demonstrations of HTML5 and CSS3 - the sorts of techniques that will become commonplace within the next few years. Extracts from this chapter recently featured in a post on the smashingmagazine website.

Overall, this book is like a Ronseal product - it does exactly what it says on the tin. It is also unashamedly aimed at anyone 'who isn't a beginner or an expert', i.e. the vast majority of digital designers. In this sense it's as much a reference book as an instructional one.

One criticism is that the diagrams and visuals, although in colour, tend to be very basic and dry. They certainly provide an illustrative clarity that will appeal to developers, but it's all a bit short on inspiration for anyone who is still a bit daunted by contemporary web design but is keen to get more involved with CSS.

Ultimately though, Eric Meyer has come up with a very readable and hugely useful book.

His writing is a rarity in design instruction - not only does he like to describe alternative ways to get the same thing done (with a succinct analysis of trade-offs and advantages), but he presents everything with an unbiased, objective tone. You get the feeling that the choices are being left up to you, so long as you know the implications, have a clear objective in mind, and are ready to approach modern web design with a creative, adventurous mind.

Smashing CSS is published by Wiley, costs £24.99, and is worth every penny.

- Eric Meyer's website
SmashingCSS @ Wiley.com