Microformats: The Semantic Web for the Rest of Us

Tim Beadle

IOP Publishing

Who am I?

• Web developer for IOP Publishing (part of the Institute of Physics) where I'm an advocate for
  • Web Standards-based development,
  • Progressive Enhancement,
  • User-centred design,
  • the good stuff from Web 2.0, and
  • Cluetrain thinking.
  • Oh, and I quite like good visual design and typography.
• Underscore mailing list regular since 1999.
• Occasional blogger.
• t1mmyb on most online services.

And who, for that matter, are you?

• Quick show of hands...
• Who's heard of Microformats?
• Who's ever consumed some Microformats?
• Who's added them to their web site(s)?
• Who's contributed or subscribed to the µF mailing list or wiki?

The Semantic Web? What?

• "The Semantic Web is an evolution of the World Wide Web in which information is machine processable (rather than being only human oriented)"
  —http://en.wikipedia.org/wiki/Semantic_Web
• Or, more simply: "content described/marked up with rich meaning."
• This was thought to be a reason to ditch HTML in favour of XML - how we were to make our websites in the 21st Century.
• Newsflash: most people are still using HTML, let alone XHTML.

We're not driving flying cars, either

What are Microformats?

• "Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards."
  —http://microformats.org/about/.
• The same goals as the Semantic Web but here, now and useful rather than a slightly far-off pipe-dream.

What are Microformats?

• They "enable the publishing and sharing of higher-fidelity information on the web"
  —Tantek Çelik
• They're "the fastest and simplest way to provide an API for your website"
  —Tantek again

But what's the point?

• Encode meaning into regular (X)HTML, using existing attributes: class, rel and rev.
• One data store, with easy transformation (the tools are out there) into other formats.
• Search engines have more clue about what your data is.

What sorts of stuff?

• Describing common things e.g.
  • People - hCard
  • Events - hCalendar
  • Ratings and reviews of stuff - VoteLinks and hReview
  • CVs/Resumés - hResume
  • Social Networks - XFN
  • Geo locations - geo

Who's using them?

• Last.fm - hCard on user profile page
• LinkedIn - hCard, hEvent, hResume on user profile page
• Upcoming.org - hEvent with embedded hCard on event page
• optics.org - hCard on team page
• The West Midland Bird Club - vCard on home page
• And many more.

Consumer action

• Install a Firefox extension:
  • Tails
  • Operator
• Or use Brian Suda's x2v script
• His XSLTs (open-licensed) also used at Technorati:
  • http://technorati.com/contacts/
  • http://technorati.com/events/

The Producers

• Just add the right class names to your content, even free form.
• Get help from the Microformats cheatsheet (it's that man Brian Suda again).
• Or you could try out the hCard creator, hCalendar creator etc. and more at http://microformats.org/code/

Examples

• Simple contact page - before and after
• Events listing - before and after

Further reading 1

• Official Microformats site
• Wikipedia : Microformats
• Government Computer News Tech Blog: "Microformats get real"
• Jon Hicks: Highlight Microformats with CSS and More Microformats Highlighting