Until just now I didn't really get Microformats. The following section from their website is what made me understand it:
What are microformats?This is what made me realize that Microformats are implemented using existing XHTML or HTML elements. That way they are something that can always be viewed by humans (since they're implemented using existing HTML elements) but can also be parsed by software (like web crawlers) to extract semantic knowledge.
Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards.
I used to think Microformats were simply a new name for things like:
- XML Namespace based extensions. (Like RSS modules.)
- Attribute based extensions. (Like Atom link extension mechanism.)
In some cases I think Microformats work great. Things like rel-license and rel-tag are examples of great Microformats. However, I see problems with some. (Although maybe I'm missing something.) For example things like the hCalendar and hCard Microformats are identified by the class attribute. That seems to like a bad idea to me. Here's an example hCard:
<div class="vcard"> <a class="url" href="http://changelog.ca/"> <span class="n" style="display:none"> <!-- hide this from display with CSS --> <span class="family-name">Krempeaux</span> <span class="given-name">Charles Iliya</span> </span> <span class="fn">Charles Iliya Krempeaux</span> </a> </div>
You can't force people not to use your magic class name. It's common practice to apply the class attribute everything to apply CSS styles to them. And this may confuse we crawlers and any other type of software trying to obtain semantic knowledge.
Instead of using the class attribute I think what I'd do is bring in a new attribute through a new namespace. (Although that will only work for XHTML and not HTML.) For example:
<html xmlns:vcard="..." >
<div vcard:name="vcard"> <a vcard:name="url" href="http://changelog.ca/"> <span vcard:name="n" style="display:none"> <!-- hide this from display with CSS --> <span vcard:name="family-name">Krempeaux</span> <span vcard:name="given-name">Charles Iliya</span> </span> <span vcard:name="fn">Charles Iliya Krempeaux</span> </a> </div>
Also, this nice thing about this is that if you follow the normal RSS Module style of doing things, the URL for the XML Namespace will point to a document that details the extension.
But, strictly speaking, that wouldn't really work with HTML. (Although I wonder if it would break web browsers to use it anyways.)