I had the fortunate pleasure to read two great articles on clean markup and web standards back to back on my bus/ferry ride home from work the other day. The first, How to Grok Web Standards, by Craig Cook on A List Apart, and the second Markup as a Craft, by Garret Dimon over on Digital Web.
In the first article, Mr. Cook suggests that to truly understand web standards and enjoy the zen of web development, one must think like a writer, an engineer, and finally an artist. I couldn’t agree more. Something I’ve really been trying to do in my day job is to approach my front-end code from the written outline standpoint. This is difficult to do when all you have is a Photoshop comp, so I suggest trying to get your hands on some black & white wireframes. If you’ve got an IA at hand, consult with them to discuss what the overall message of the page is. This will help you get a sense of what the important “business goals” of the page are and will help you convey that to the end-user using appropriate markup.
In the second article, Mr. Dimon takes us through 21 steps to better markup. From keeping things simple, to separating presentation, function and content, to knowing the tools in your toolbox, each of his guidelines is incredibly important. As it relates to all of the above points, I feel like the div tag has the best potential to become the new table. I’ve seen several cases recently of wrapper divs around wrapper divs around wrapper divs. If this code was a candy bar, you’d throw it away without ever eating it due to the excessive packaging! And what was inside those wrappers? A list! A form!
I’d like to see more people treat their content as king (or queen if that suits you) and mark it up appropriately. It’s one of my underlying missions at my new job, to bring standards and good markup to the forefront. The amount of time I’ve spent fixing things due to bad markup, presentational markup, and excessive wrappers thus far is astonishing, when all we really need to do is get back to basics, scrap the comp, read the content, and learn HTML.
Either way, I must suggest that you read both of these articles (as well as most everything else at ALA and DW)
Thanks for the mention, Rob. Garret Dimon did a really good job on that article. Here’s to keeping your div count low.
Cheers,
- Nick