Adaptive Web Design by Aaron Gustafson

#alttext#

For the tl;dr crowd: Just get the book. Short enough to finish in an afternoon, but packed to the gills with information you’ll use moving forward.

Until last fall, I spent most of the last ten years primarily building sites using Flash. Since moving to Philadelphia to join 160over90, I’ve spent most of my time building sites using HTML/CSS. It’s been a lot of fun, but one of the things I had to do was get up to speed with current standards-based web design. I picked up Aaron Gustafson’s Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement on a whim, largely because Veerle Pieters showed the cover design as part of her talk at An Event Apart Boston. However, it’s quickly become my essential grab-bag guide to the state of the art in web design. Its focus on progressive enhancement through HTML markup, CSS, and JavaScript was exactly what I needed: an overview of today’s best practices. Even if the detail in this book isn’t as comprehensive as its scope (intentionally so), it has enough detail and practical examples to point me in the right direction to dig deeper.

Progressive Enhancement vs Graceful Degradation

Chapter 1 defines progressive enhancement this way:

Progressive enhancement is a philosophy aimed at crafting experiences that serve your users by giving them access to content without technological restrictions.

It draws a contrast between that philosophy and the blind alley of “graceful degradation”. Here’s one of my absolute favorite lines from the book:

Graceful degradation was the philosophical equivalent of fault tolerance’s superficial, image-obsessed sister who is fixated on the latest fashions and only hangs out with the cool kids.

Ouch. So that hits a little close to home. But it’s a message that rings true, and thankfully there seems to be no shortage of enthusiasm these days for a content and user-centric approach to web design.

Stacking it Up

With the purpose clear, the rest of the book devotes one chapter apiece to HTML markup, CSS, JavaScript, and finally Accessibility. I’ll just list a few of the highlights for me:

  • In the HTML chapter I came to a deeper understanding of semantic markup, learned about microformats, and the advancements introduced by HTML5.

  • In the CSS chapter I finally learned about the rules governing selector specificity. I can’t tell you how many times I’ve wished for a concise explanation of how CSS determines which rule is given precedence.

  • The JavaScript chapter introduced me to the concept of unobtrusive JavaScript, meaning that essential functionality on the page can be accomplished without JavaScript. In this situation JavaScript improves the experience, but its absence doesn’t cripple the page. I was also introduced to the novel (for me) concept of using JavaScript to generate any additional markup it might need to function correctly. I’ve already used that in some code I’m writing today.

  • The Accessibility chapter taught me about ARIA roles, and it’s already changed the way I write my markup.

Check it Off

I love lists and checking things off, so I was delighted to find that the last chapter is a Progressive Enhancement Checklist broken down into the four major categories of the book. Right now there’s still quite a few unchecked boxes, but hopefully I’ll be checking off more items with each successive site that I build.

To sum up: I found Adaptive Web Design to be funny, informative, and—most importantly—useful. I was able to funnel what I learned directly into my current (and upcoming) projects. I can’t recommend it enough.