Difficulty: Moderately Easy
Things You’ll Need:
- A blog or website
- A browser
- A text editor or HTML editor to create or copy the HTML
Step1
There are several recognized microformats. They include:
*hCard, similar to a business card on the web for people, companies, organizations and places
*hCalendar, a calendaring and events format
*hReview, for formatting reviews of products, services or businesses
*Rel-Tag, adds rel="tag" to a hyperlink and creates a "tag" for the link, such as the tags used for Technorati
There are a number of other microformats as well.
Step2
Each microformat has a specific set of HTML elements combined with standard CSS class and ID names that create the recognizable format for the information. When information is diplayed in this form on a blog or web page, anything that recongnizes the format can make use of it. For example, hCards can be downloaded from the web into an address book or a phone contact list. Suppose you searched on Yahoo! local for the closest place to get pizza. If the pizza business had an hCard on the web, you could quickly access their information and save it in your phone for current and possible future ordering.
Step3
The easiest way to get started with microformats is to use the generators at microformats.org (see link in Resouces). Click on the Code tab to reach a generator.
Step4
Microformats.org provides wizards to create microformats.
The hCard generator shown in the image is an example of how to create the HTML. On the left is a form. As you fill in the form, the HTML is immediately placed in the microformat template on the right. When finished, you simply copy the HTML on the right and paste it in your blog or web page.
Step5
The microformats can be customized. Using the hCard as an example again, you might not want your phone number or photo included in the card. Simply leave that out when you create the hCard.
Step6
The parts of the HTML that you should not remove are the CSS hooks such as class="fn n." These are the parts of the code that make the format recognizable. You can write your own CSS rules for these classes when you use them on your blog or web site, thereby customizing the appearance of the information for your personal presentation.