Without Answers

Semantics explained. Written by Honza Sládek.

December 12, 2009 at 11:48pm

home

Stop being creative with class names

So I read today an article on Coding Horror by Jeff Atwood. It’s title says “Microformats: Boon or Bane?” and it really caught my attention. After reading it I just had to write this post.

The article says, among other things, one really true thing about Microformats. They’re really not perfect, they have their flaws. But I believe Jeff Atwood is wrong when it comes to what these flaws are.

His main problem with Microformats is that they’re using class attribute to make they’re magic. Read his arguments.

I believe that almost in every book about html & css will be a note on naming classes. It’ll say you something about naming them “semantic” and not to use something like “left-blue-column” because you could move the column to the right in the future and make it, I don’t know, orange. Unless the authors are completely stupid and nobody noticed that ‘till now, I suppose there is some true in they’re advices.

Then we have the all-mighty progressive enhancement technique. If I apply it to html + css coding, it basically says: “Write your html markup first - as semantic as you can, worry about the css later”. So if I would follow it to the letter, I would write my markup WITHOUT any class name and then use CSS3 selectors so heavily, that only nightly build of Webkit could display my site correctly. It would be nice, if all my costumers would be using nightly build of Webkit (which they, what a surprise, don’t).

So I need to add some classes.

So I think really hard to come out with the right set of semantic class names. But even I think I was really successful, someone else will always say - “hell, it’s stupid class name”. And we have one more thing to argue about in discussions.

Microformats, HTML5 and ARIA are about to change all that. I believe soon there won’t be any need to use my own class names. (Today I might use my own class names if I need to support some version of our bellowed IE.) We all will just use Microformats class names, ARIA attributes and new structural HTML 5 tags. That’s it.

I don’t know where this approach will take us (I can imagine some snippets libraries, OOCSS frameworks applied to it, some magic with JavaScript, etc.), but I can tell you - I’m looking forward for this future. What I found after 7 years in this beautiful industry, is one thing - we web designers are pretty creative and smart bunch of people. So if we take class names as given and focus our creativity to different areas, it’s likely to move the web design industry another step further.

And If you think the Microformats are piece of shit - that’s fine by me. Use RDFa instead. In the end it does the same thing from this point of view. You’ll just need a bit more advanced selectors. And when Microdata arrives? Still the same! (Except at RDFa and Microdata you won’t need to use classes at all. :))

Btw. if you’re thinking not using any of these, go right now and find yourself a new job. Because this is not a matter of choice since Google got on board.

Btw2. Andy Clark wrote a post about naming conventions about an year ago, so I didn’t invented this approach at all. I’m just it’s huge fun and I felt a need to share it with you today.

So don’t be afraid and start together this (r)evolution! Are you with me?