Alex Faaborg

Have you been over hearing people talk about microformats and thought to yourself “what are those?” In this post I provide a quick introduction, and discuss the various ways that microformats are changing the Web.

What are microformats?

Microformats can be explained in a number of ways, but the easiest way to explain them is to just show an example.

Here is my contact information in HTML:

<div class=”vcard”>
<span class=”fn”>Alex Faaborg</span>
<div class=”org”>Mozilla</div>
<div class=”adr”>
<div class=”street-address”>1981 Landings Drive, Building K</div>
<span class=”locality”>Mountain View</span>,
<span class=”region”>CA</span>,
<span class=”postal-code”>94043</span>
<span class=”country-name”>United States</span>
</div>
<div class=”tel”>617-899-5064</div>

But this isn’t just normal HTML, it is semantic HTML:

<div class=”vcard”>
<span class=”fn”>Alex Faaborg</span>
<div class=”org”>Mozilla</div>
<div class=”adr”>
<div class=”street-address”>1981 Landings Drive, Building K</div>
<span class=”locality”>Mountain View</span>,
<span class=”region”>CA</span>,
<span class=”postal-code”> 94043</span>
<span class=”country-name”>United States</span>
</div>
<div class=”tel”>617-899-5064</div>

This additional semantic information in the HTML is an example of the hCard microformat. That’s what microformats are, adding semantics to markup to take it from being machine readable to being machine understandable.

There are lots of different microformats, ranging from very fundamental types of information like contacts, locations, and events, to the slightly more domain specific, like reviews and resumes, to the very domain specific, like wines.

Why are microformats important?

Microformats are going to change (and are currently changing) the Web in a variety of different ways:

1. Aggregation Sites

Right now if you want to sell something, you go to a site like craigslist. If you want to review something, you go to a site like epinions. And if you want to manage your social network, you go to a site like Facebook. The general model is the user travels to a particular site, and then proceeds to enter data (classified add, review, list of friends) for a particular purpose. Your information is scattered all over the Web, and you have to pick which sites you want to use.

The combination of blogging and microformats is now reversing this model. Now, your information remains in your blog, and the Web sites come to you. For instance, if you want to sell something, you can blog about it using an hListing, and a site like edgeio will find it when it aggregates classified advertisements across the Web. Similarly, the microformat hReview allows the creation of review aggregation sites, and XFN (XHTML Friends Network) allows the creation of social network aggregation sites.

2. Sharing Information with a Specific Community

Let’s say you enjoy mountain biking, and would like to share various trails with other people who also enjoy mountain biking. If you posted this information to your blog, you could geocast (RSS with a payload of geo), the locations of the mountain bike trails, and other people in the community could subscribe to this feed using an application like Google Earth.

3. Targeted Search

Let’s say you are creating a web comic, and you want other people to be able to find it. By posting your comic with a microformat agreed upon by the web comic community, the rest of the community will be able to easily find your work using a search engine.

What sites are currently using microformats?

The Microformats Wiki has information about which sites are currently displaying different types of microformated content. The notable examples are Flickr, which lets users geotag photos (5 million geos), Yahoo! Local, which encodes each search result with an hCard (15 million hCards), and Upcoming.org, with encodes events with hCalendar (not sure how many).

Why are these sites using microformats?

Honestly, I don’t know. One possibility is that they are adding microformated content to their sites because it is the right thing to do, but that is kind of like answering “which came first, the chicken or the egg?” with “the egg came first, because it was the right thing to do.” Another possibility is these sites are marking up their content using microformats as a means of making the site itself an API. But whatever their motivation is, it’s really great that they are bootstrapping innovation on the Web.

Learning more about microformats

• Press
• Podcasts
• Presentations
• Screencasts

Getting involved with the microformat community

• Blog
• Wiki
• Email list
• IRC

Coming soon…

All of the user scenarios above are interesting, but they don’t necessarily impact the Web browser, which is after all the whole point of this blog. But that brings us to to the fourth way microformats are going to change the Web.

4. The Web Browser as an Information Broker (Firefox 3?)

Much in the same way that operating systems currently associate particular file types with specific applications, future Web browsers are likely going to associate semantically marked up data you encounter on the Web with specific applications, either on your system or online. This means the contact information you see on a Web site will be associated with your favorite contacts application, events will be associated with your favorite calendar application, locations will be associated with your favorite mapping application, phone numbers will be associated with your favorite VOIP application, etc.

This is going to change the way we interact with data on the Web, and it’s something that I am going to be blogging about all this week, stay tuned.

Next: Structured Data Chaos

Technorati Tags: Firefox 3, Gran Paradiso, microformats