A tribute to Microformats (a reader question answered)
Enrique Ramírez wrote to me yesterday with a few questions about Microformats and markup. I’ve been asked these questions before, a few times. So rather than send Enrique my answers on a postcard, I’m replying in public, with Enrique’s permission of course.
Enrique wrote,
This is to notify you that your e-mail has won 250,000.00 euros in the 2008 SPNL Sweepstakes e-Lottery.
No wait, that was somebody else. And I'm still waiting for my damn money.
I've been reading your latest blog post and there are some things I don't really agree with. Why use Microformats? They really look like an excessive amount of tags and classes to me. They also seem to have very few benefits.
While I agree that id's and classes should reflect the function of the element, what's more important? Writing simple, semantic code or writing tag-heavy code with lots of classes and id's that perfectly define each element function? Here's an example that comes to mind:
<div class="vcard"> <div><a class="fn org url" href="#">Stuff and Nonsense Ltd.</a></div> <div class="adr"> <div class="street-address">The Cow Shed Studio</div> <div class="locality">Eversleigh, Gwaenysgor</div> <div class="region">Flintshire, North Wales</div> <div class="postal-code">LL18 6EJ</div> <div class="country-name">UK</div> </div> <div class="tel">01745 851848</div> </div> </div> </div>Here comes why I'm against Microformats. It looks to me like an abuse of tags (improper tags, too) and classes. The same semantic value (although without as much specificity) can be approached with something like:
<div class="vcard"> <a href="#">Stuff and Nonsense Ltd.</a> <address> <strong>The Cow Shed Studio</strong> Eversleigh, Gwaenysgor<br /> Flintshire, North Wales<br /> LL18 6EJ<br /> UK<br /> </address> <em>01745 851848</em> </div>It's not as specific (meaning not tagging every element for what it is), but the semantic value is there. Probably even more since we're using the actual tags for what they should be, instead of a <div> which, to my understanding, is a group of elements that form a division of the layout.
So why use classes to add semantic value when there's a tag that already has semantic value to it? Do search engines already support classes? Do speech readers?
These are fair questions and it's also fair to say that I was asked almost all of them after a talk packed with Microformats in Amsterdam earlier this year. It's also fair to say that not quite two years ago I asked almost exactly the same questions to Jeremy during a long flight to San Francisco.