# Tutorials on Microformats

## Introduction

Microformats are used to make Web documents smarter (HTML, XHTML, RSS, ATOM, BLOGS, XML). They don't affect how your documents are rendered by a browser. But they have a huge (positive) impact on the ability of Web applications/tools to collect, understand, and process the information in your Web pages.

Microformats are tiny bits of information injected into Web pages. When you add together the tiny bits of information over thousands or millions of Web pages, you have a mountain of valuable information that can help with searching, understanding, and processing the Web.

There is a growing collection of Microformats. I have created tutorials on the core Microformats (as of early 2007).

## Navigating the Tutorials

The tutorials are HTML documents. But they appear as slide shows. I am using S5 for this.

To move forward in the slide show click on the right arrow key. To move backward, click on the left arrow key. Here are other ways to navigate the tutorials

## Tutorials

I recommend reading the tutorials in the order listed. Although they are mostly independent, occasionally I reference stuff from earlier tutorials.

1. Purpose of Microformats
2. Microformat Demonstration (quick overview of the power of Microformats)
3. hCard Microformat (person, place, organization, address, geo-location)
   1. Part 1
   2. Part 2
   3. Part 3
   4. Part 4
   5. Part 5
4. Elemental Microformats (voting, social connections, tagging, license, directory)
5. hCalendar Microformat (events)
   1. Part 1
   2. Part 2
6. AHAH (Asynchronous HTML and HTTP, i.e., Ajax for HTML)
7. hReview Microformat (opinion of a product, event, business, person, place, or Website)
8. xFolk Microformat (bookmarks)
9. hResume Microformat (expertise/experience)
10. XOXO Microformat (eXensible Open XHTML Outlines)
11. hAtom Microformat (syndication feeds)

## Download the Tutorials

You can download the tutorials, including all the examples and lab exercises (zip file, about 13MB).

## Microformats Summary Sheet

Brian Suda has created an excellent one-page summary sheet of the Microformats: http://suda.co.uk/projects/microformats/cheatsheet/microformats.cheatsheet.pdf

## Microformats Discussion List

Join the list and help create new Microformats: http://microformats.org/mailman/listinfo/microformats-discuss/

## The Microformat Process

Microformats are created using the scientific method: research what Nature (i.e., the Web community) is doing, understand it, and formulate a model of it (i.e., a Microformat). It's a very exciting process: http://microformats.org/wiki/process. Also see Why Examples First

This is a nice, short summary of the scientific process: Science Asks Three Basic Questions

## Viewing and Printing the Tutorials

I recommend viewing the tutorials using the Firefox browser.

This is a nice cover page.

The tutorials should be printed in Landscape orientation.

## Contact Info

I hope you enjoy these tutorials. If you find any typos please send me an email and let me know. In fact, if you have any comments, drop me a note. Here's my contact information (marked up using the hCard Microformat and styled using Highlight Microformats with CSS):

Roger Costello
Roger.Costello@gmail.com
202 Burlington Road
Bedford, MA, 01730-1420 U.S.A.
781-271-6439

## Change Log

Interested in seeing how this tutorial is evolving? See the change log.

## Tags

- microformats
- tutorial
- Web pages

Last Updated: March 8, 2007