My first article for A List Apart, How to Grok Web Standards, has gone live with issue 230. I’m giddy with excitement, as this is a fairly momentous event in my career. ALA has been instrumental in my growth as a web designer-slash-developer, and to think that I have progressed to the point where I can perhaps offer some guidance to someone else is enough to swell the ego to Hindenburgian proportions.

I discovered ALA around 2003 while reading Jeffrey Zeldman’s seminal masterpiece “Designing With Web Standards.” As has happened to so many others, it was DWWS that finally made me sit up and pay attention to web standards. Prior to that I was using tables to lay out my pages and CSS was only good for removing underlines from links. But Zeldman’s book is a wakeup call for presentational designers. It’s as much about the “why” as it is about the “how.” I took it upon myself to learn more about the mysteries of CSS, and it was and ALA that were my gateway.

I followed links and discovered Mezzoblue, Simplebits and StopDesign (I had seen and enjoyed the CSS Zen Garden, yet oddly had never visited Dave’s home site, Mezzoblue, until following a link from Zeldman). From there the linktrail led me through the broad network of standards-oriented blogs: Andy Budd, Shaun Inman, Jeremy Keith, Jeffrey Veen, Molly Holzschlag, Ethan Marcotte, Richard Rutter, Joe Clark, Dunstan Orchard, Andy Clarke, Eric Meyer, and many many more names that deserve dropping. Every new site I discovered brought new links of its own to expand the network of know-how, and it was through reading the writings of these people, these bright luminaries of semantics and style, that I found a new passion.

It began with technique. Faux columns, elastic layouts and horizontal navigation lists with sliding doors were handy reusable design patterns, tricks to employ to make my pages look good. But gradually came the realization that this whole “separation of content from presentation” hullabaloo was more important than mere technique; it’s the very cornerstone of the web medium.

I realized that the web isn’t really visual by nature, it’s merely a visual representation of the underlying ideas. The web is a conduit for the transmission of thoughts. Thoughts articulated in words, made portable by markup and given presence through style. If any one of those aspects of the medium takes precedence over the other two, it’s the thought behind it that suffers the damage. I developed a new appreciation of HTML as nothing more than markers to denote the meaning of text. It’s the text that really matters and the ideas behind it, the message driving your content, that thing that something about something is about. Presentational markup hurts content, and design that harms content is bad design.

Until a few years ago, browsers’ support of CSS wasn’t strong enough to make CSS design practical. We resorted to table hacks because there were no other options. But today’s generation of browsers, bugs aside, support CSS well enough that we needn’t keep designing pages the way we did in the olden days. We must unlearn what we have learned, readjust our attitudes and start doing it right. When I see the work of a designer who still uses tables and font tags, it just broadcasts loud and clear that they haven’t updated their skillset in half a decade. There is simply no acceptable excuse for designing web pages today the same way we did in 1999.

So why are there so many practicing designers — those who would call web design their profession — who still haven’t jumped ship? For some it’s just a symptom of ignorance, a lack of exposure to the books and blogs that have been preaching web standards methodologies. Those people need to be welcomed with open arms, offered understanding and guidance on their new journey. But others willfully resist, dismiss CSS as “too hard” and all this web standards mumbo jumbo as hype. They’re comfy with the sloppy, inaccessible presentational pasta that has cluttered the web for far too long. After all, it seems to get the job done. Everything looks just as it should, right?

I couldn’t comprehend that mindset, how anyone could learn about web standards and still reject them by choice. I finally figured out what the problem is; their brains just don’t work right.

A strictly visual thinker is not concerned with semantics and accessibility. They’ll treat a web page as a picture of a web page, and commit whatever HTML sins are required to bend pixels to their will. They don’t appreciate the significance of markup as a support system for content, don’t understand that every presentational tag and attribute is an obstacle hindering the movement of information. They’re thinking like an artist, obsessed with the experience while neglecting the message and the mechanics. Understanding web standards — not just how they work but what they mean — takes more than memorizing techniques for presentation. A web page serves a purpose above and beyond surface aesthetics.

Nearly two years ago I started drafting a post on this topic, exploring the mentality of standards-aware design and the thought process that goes into it. It’s difficult to articulate without a lot of hand-waving and abstraction, so the post lamented in draft stasis, occasionally being dusted off and reworked before going back into the locker unfinished. When Krista Stevens contacted me about writing something for ALA (on a reference from Aaron), I decided it was high time I brought that post out of storage and gave it to the world. I hope someone out there can glean some nuggets of truth and inspiration from How to Grok Web Standards and will use that to further the advancement of the web as a whole. I’m honored to contribute to a publication that has contributed so much to me.


  1. Congrats Craig!
    I really enjoyed the article; you made what could have been a very dry (and boring!) infomercial for Web Standards into a very interesting, amusing and educational thinkpiece. Shit, and I FINALLY learned where the word GROK came from!!! (I liked the multi-headed creature thingy too!, which one was the engineer? )

  2. I’m thinking the goat is probably the engineer, not sure about the other two. You’d have to ask Kevin. I was kind of hoping he’d do a watercolor drawing of Voltron :D

  3. Craig,
    I just finished your article and I wanted to thank you for one of the best pro-standards pieces I have ever read. Working in web design is definitely a balancing act of multiple disciplines and I appreciate your abilities to clearly define how important these seperate roles are. Thanks again and yes, Voltron should have been featured somewhere in the article.

  4. I look forward to reading more of your articles on ALA. Your writing style is great!

  5. Great article today on ALA! Really nice use of language to succinctly describe these concepts. Really impressive… I’m just wanting to point out a typo, “But the web not strictly a visual medium, it’s a textual one,” need to stick an ‘is’ in there. I only point it out because it’s such a great article and I hate there to be anything detracting from it or distracting from the ideas.

  6. I’d spotted that typo just minutes after the article was published, hopefully they’ll fix it.

  7. I loved your article. I loved that it was so well written, and didn’t come off as campy as (unfortunately) a lot ALA articles do. I almost didn’t read it because the title put me off, but I’m glad I did. Congratulations on your first ALA success; I’m sure there will be others soon to follow :)

  8. “…the web isn’t really visual by nature, it’s merely a visual representation of the underlying ideas. The web is a conduit for the transmission of thoughts. Thoughts articulated in words, made portable by markup and given presence through style. If any one of those aspects of the medium takes precedence over the other two, it’s the thought behind it that suffers the damage.”

    I will take that with me… thanks, and congrats on the ALA article; not a small achievement!

  9. Just to say how very much I appreciated your article on ALA – I hope the fact that on finishing it I forwarded it immediately to half a dozen colleages and friends is a mark of how good I thought it was.

  10. Great and really inspiring article. I had to mention it in my own blog (in german language). Hope the ALA article will be read by many designers/developers around the world to get webstandards on their minds.

  11. Your piece in ALA snaps into sharp focus the considered creative approach required not only in Web design, but in many contemporary projects that combine art and technology. Where often the simple approach wins out. And ends up being profound. A stunning example of the kind of demystification that jump-starts the mind to see what really is possible. Well done.

  12. Congratulations on the ALA debut! As one of those to be welcomed with open arms I found it well-written and informative, hitting the right buttons in my gut. I’ve been on the journey for only a few months and seem to be treading the same well-worn path to many of the blogs you’ve mentioned here and the books are slowly making their way from an amazon depot somewhere. Thanks for adding more links to the chain.

  13. I really appreciated the article on ALA. I have really worked to understand web standards for the last year, after I realised just how important it is, and the fact that you really don’t deserve to get anywhere if you don’t pay attention to them. The breakdown you provided in your article really has helped a little in making a new designer come to life.

  14. Craig,
    “How to Grok Web Standards” is now one of my favorite posts from ALA. While reading it I kept wanting to highlight things, but alas, highlighter markers don’t wash off LCDs. :(

    Seriously though, fantastic work. I’m also a big fan of Stranger of a Strange Land so I loved the grok reference.

Comments are closed.