The life, work and thoughts of Bence Kucsan - There are 0 new posts and 0 new comments since Your last visit
I`m sure you have already heard about microformats - a new way of thinking about data - but maybe you are like me and a simple, yet quite handy example will make its usage and benefits more clear.
For getting started let’s just take a small step with a really useful example - Making contact informations available for download directly to the visitors contact managing application like Outlook or Apple Mail in form of an hCard with the generous help of microformats.
Step 1 of 2 - Formatting your existing data
There are some specifications for formatting your existing contact informations, many examples are available over at the hCard wiki page, but for now let’s have a look at my example:
<div class="vcard">
<a class="url fn n” href="http://svenigson.com">
<span class="given-name">Bence</span>
<span class="additional-name">Michael</span>
<span class="family-name">Kucsan</span>
</a>
<div class="org">Svenigson Studios</div>
<div class="title">Interactive Designer & Developer</div>
<div class="adr">
<div class="street-address">Felsolover 72</div>
<span class="locality">Sopron</span>
<span class="region">Gyor-Moson-Sopron</span>
<span class="postal-code">9400</span>
<span class="country-name">Hungary</span>
</div>
<div class="tel">
<span class="type">Cell</span>
<span class="value">+36 70 505 ...</span>
</div>
</div>
Of course with CSS you are able to style this as usual, and for the case - just like me - you don’t have, and do not want to have these kind of informations on any of your site, simple add style="display: none;” to the ones you don’t want to be displayed or to the vcard itself.
Step 2 of 2 - Adding a download link via Technorati
Wondering how to get this linked? Well, via the generous help of Technorati. There is a beta application available, calledTechnorati Contacts Feed Service at http://technorati.com/contact where you can type in the address of the page which contains your vcard informations and it collects the informations and generates an hCard, ready for download. Nice. So you only need to add a link on your site like:
<a href="http://technorati.com/contact/http://svenigson.com">Download vCard</a>
with replacing http://svenigson.com with the address of your page containing your vcard and you are done. From now on your visitors can easily download your contact informations and use them in their desktop applications just like this one:
Example - Download vCard With My Contact Informations
Firefox Extension and Mr.Cederholm’s example of usage
There is a super useful Firefox Extension - announced by Mozilla Labs - called Operator. Operator detects hCard, hCalendar, geo, hReview and rel-tag and allows you to combine those microformats with desktop applications and web services such as Google Maps and Yahoo! Calendar.
After installing this extension visiting sites which already adopted microformats is becoming enhanced with the ability to easily reuse their data. For example try Dan Cederholm’s SimpleBits and you’ll be instantly able to add the events he mentions on his site directly to your Google Calendar.
Isn’t this great?
I have read about this before and Im just wondering. What if you have more than one hCard on your site, will you be able to download multiple vCards using the technorati link? I wish you could download the technorati script and place it on your own site as opposed to always linking to technorati? I do like the idea of this though, very clean.
@ Jake - It can handle multiple hCard contacts too, tested. The vCards are shown behind each other and you can save or cancel them but on the site you can’t choose which to download though. For these you should use the mentioned FF extension, which hopefully will become a standard feature of future browser releases soon.
These issues are of course because of the early stage of the microformats standards and I think the more people realize the benefits of these, the sooner it evolves to a real power-feature of the next generation of online apps.
So these mulitple vCards are really just applicable to those users on FireFox with the extension that you mentioned? I would really like to see microformats a bigger part of all browsers. Im sure they would be very useful for business and mobile users going forward. Interesting write up. I tried to download and configure a php script that I found a few months ago posted off the wiki website I think, but it was a little too involved for me.
@Jake - There is a set of scripts you can download which have been written by Brian Suda and downloaded from http://suda.co.uk/projects/X2V/
These allow you to reference individual hCard and hCal files for download. There is an undocumented (I still think) parameter called filename which allows you to rename the downloadable files. So far I have not found an equivalent for the Technorati service.
For testing purposes you can grab your hCard using Brian’s own site.
Microformats are very interesting, I hope as well that browsers will better integrate them in the future.
It reminds of a Skype extension for Firefox which highlights phone numbers and lets you call them with the click of a button, quite handy really. Of course Microformats hold much more information than a simple phone number, but they have a standard, so the ‘parser’ doesn’t have to do any guessing (as I imagine the Skype extensions does, for some numbers)
Exactly, the extension for Skype you are talking about is guessing, and not even very good. Turning it on I saw some very strange phone numbers on several sites, but then I figured out that they are actually dates and other stuff, so I turned it off.
on January 22, 2007 at 16:35