hCard parser H2VX not ready for HTML5 yet

Updated January 16, 2012

New frontiers come with unexpected challenges. I like using the hCard microformat in websites to make it easy for people to add contact information to their address books. I also like building websites in HTML5 for the semantics and am confident it is the way forward. Tools like Modernizr make browser support less of an issue with the new tags.

What’s an hCard without a parser?

The hCard format is great for publishing contact info in HTML, but to turn it into a vCard that can be downloaded and added to your address book, something has to do the conversion for you. A “production deployment of the X2V hCard” is located here allowing one-click downloads of hCards in any web page.

This is a real gift — saving us from keeping vCard files up to date on our own servers, and/or writing our own hCard to vCard conversion tools. It was created by the hCard microformat authors Tantek Çelik and Brian Suda which perhaps has added to it’s popular usage.

What’s not ready with this parser?

Regarding hCard microformats H2VX and HTML5, here’s the rub: it does not support the new HTML5 tags, and will not find them in your webpage if your hCard root element is an HTML5 tag.

I noticed an issue when updating some websites to use <section> tags instead of <div> tags for the root element of an hCard. (NOTE: the root element of an hCard has class=”vcard”).

HTML5 for your .vcard root element will not work

<section class="vcard">
    <a href="https://aaronwhitman.com" class="url fn">Aaron Whitman</a>
</section>

HTML for the .vcard root element works as expected

<div class="vcard">
    <a href="https://aaronwhitman.com" class="url fn">Aaron Whitman</a>
</div>

So, when updating websites with hCards to use HTML5 tags, make sure to consider this issue. Thankfully, there is a dev version of H2VX that does support HTML5 tags. The fact that this is a “dev” version implies it is not to be relied upon, but it is encouraging to see that HTML5 support is in the works.

Now to check every website I’ve built in recent memory for the hCard broken by HTML5 situation.