It's amazing how little you post when you get sick... Or program for that matter... However I do have an update for you today. A little while ago, I posted about vCards, how to create them, what they were, etc. There really isn't that much to them to be honest. However you can actually take that information and embed it in your HTML with the help of hCards.

hCards are basically just HTML representations of a vCard. They do this by using the class attribute of an item to determine what the information is. So for example, the email item could be a div or an a (as in <a href=...) object with the class set to email. Then anything you place before the closing tag would be classified as the email of the hCard. All we need to do is make sure that we enclose all of this in an object that has the class of "vcard". That's all there is to it. So for example:

That would be a valid hCard (although missing a bit of information, such as my email, phone number, etc.). And since it uses the class attribute, we can use CSS to format the item the way that we want without hindering anything (which means the average person wouldn't even know that they're looking at a hCard).  In order to make your lives easier, I've modified my vCard code to output an hCard as well:

VCard.zip (1.17 kb)

You may wish to go in and modify it a bit since it is set up for individuals and not organizations, doesn't have address information, geo information, etc. However, it should show you how incredibly easy it is to create an hCard. Once I get it working, I'll show you how to add in XFN information into the mix... For now though, download the code, leave feedback, and happy coding.