The CSS Anthology

101 Essential Tips, Tricks & Hacks (2nd Edition)

Practical advice on how to solve design problems with CSS.

The book is arranged into logical sections covering the significant parts of web page design. It’s then further broken into a question and answer format, e.g. “How do I style a structural list…” followed by an answer with sample code and a discussion covering the hows and whys something is done. In this respect, it is very similar to the O’Reilly Cookbook series. What this book does bring to it is a more attractive, full-colour package. Also, there are several break-out boxes throughout the book that provide additional information. They’re done with a bit of a sense of humour: e.g. the warning sections are illustrated with various items ranging from a bicycle horn (look for) to a hand-grenade (caution). Of course, no book today would be without a website, and this one has one as well as access to the rest of the SitePoint website.

The Chapter “Getting started”, begins with an introduction to CSS in general and is then followed by a chapter on text handling in CSS. This section covers some of the less known areas of fonts like x-small, xx-large notation. It’s not the first book to delve into these features (Jeffrey Zeldman’s Design With Web Standards was probably the first I read on the topic), but, unlike some of these older books, it’s the book’s inviting layout and organization that makes this more accessible than some past books.

Next up is a chapter on image handling in CSS. This starts with the basics of adding boards to images, then quickly moves into creating shaded backgrounds and into mixing HTML text and images, and finally, using transparency.

See also  Drupal's Building Blocks

Navigation covers how to create attractive menus using CSS. Most of this chapter shows how to convert lists into styled vertical, horizontal and tabbed menus, using a mix of plain CSS and images. I particularly liked that the author mentioned were some of the ideas for the CSS code came from – useful if you want to check out other variations of the code presented.

The “Tabular data” chapter covers ways to make spread-sheets-type data more readable and attractive. Starting with basic styling, it also covers visual aids like alternating row colours and changing the style of a row when the user moves their mouse over it. As well as styling, this touches on making tables accessible through the use of and other tags. Later on, they cover creating styled calendar displays.

Next up is a chapter on forms and user interfaces. It’s a chapter about how to organize a website’s forms into a logical format and style it, so it is both attractive and easy to follow. Given that nearly every site has at least one form, even if it’s just a contact form, this chapter is worth reading. I’d put this up with my previous favourite, Dan Cederholm’s Web Standards Solutions, for usefulness.

While the browser compatibility situation has come a long way from the bad old days of Netscape vs Internet Explorer, it still exists, especially as a large number of users are still running Internet Explorer 6. This chapter covers cross-browser techniques focuses on developing ways to deal with older browsers and mobile browsers. Also included here is how to install multiple versions of IE on your computer using Virtual PC as well as other helpers like BrowserCam.

See also  Building Findable Websites

The accessibility and alternative devices chapter covers making pages friendly to screen readers and other tools used by people using assistive technologies such as screen readers and magnifiers. An often-overlooked advantage of creating accessible websites is it makes it easier for web spiders to process your content correctly, so this chapter is doubly useful.

The closing chapter is on CSS positioning and layout. It brings together many of the topics covered in previous chapters into creating a cohesive design. As well, it touches on some techniques to make the pages more interesting with bits like rounded corners.

Some other nice points: they’re a fair bit of coverage of non-obtrusive JavaScript — basically how to make your web page not fall apart with errors galore if the user’s browser doesn’t support JavaScript (or, it’s been disabled for security).