Microformats are meant to be embeddable in (X)HTML—so anywhere you can put (X)HTML, you should be able to stick in microformats—including RSS and Atom feeds.
The best way to start with microformats is to look at some specific examples while keeping an eye out for some general design patterns that are behind microformats; see http://?
microformats.org/wiki/design-patterns. That is, what are some tried-and-true ways to insert data into HTML?
rel-design-pattern uses values in a rel attribute to indicate the meaning of a link.[308]tag or rel-tag microformat:
<a href="/tag/mashup/" rel="tag" class="category">mashup</a>
In addition to rel-tag, you’ll learn about rel-license, a data format that also uses rel-
design-pattern.
The rev attribute is also used in this design pattern. In case you’re not up on what rev is supposed to mean (don’t feel bad if you don’t—I didn’t before reading about microformats), read the FAQ (http://microformats.org/wiki/rev#Then_what_does_.22rev.22_mean.3F):
‘rev’ is the precise opposite (or ‘reverse’) of the ‘rel’ attribute. E.g. a rev="help" link indicates that the current document is ‘help’ for the resource indicated by the href.
This design pattern[309]class attribute to hold a whitespace-separated list of semantic class names (http://microformats.org/?wiki/semantic-class-names). The <span> and <div> elements can be used in the absence of other appropriate (X)HTML elements to demarcate content.
As you have already seen from the earlier examples, the adr, hCard, geo, and hCalendar formats use class-design-pattern. For instance:
<div class="address adr">
<span class="street-address">1401 N Shoreline Blvd.</span><br />
<span class="locality">Mountain View</span>,
<span class="region">California</span> <span class="postal-code">94043</span>
</div>
and for example:
<span class="geo" style="display: none">
<span class="latitude">37.4149</span>,
<span class="longitude">-122.078</span>
</span>
When you come to selecting class names, you should note the ones that are already in use to avoid reinventing the wheel and causing namespace collisions: http://microformats.org/?wiki/existing-classes.
This pattern[310]<abbr> HTML tag to wrap text with a machine-readable version of that information, which is stored in the title attribute of the <abbr> element. This pattern is most commonly used to encode the date and time in datetime-design-pattern (http://?microformats.org/wiki/datetime-design-pattern):
<abbr class="dtstart" title="20080310T1700-08">
March 10, 2008 at 5 PM
</abbr>
There are some concerns about the accessibility of such constructions (http://?mi
croformats.org/wiki/datetime-design-pattern#Accessibility_issues). Here is a recommended alternative:
<span class="dtstart" title="20080310T1700-08">
March 10, 2008 at 5 PM, Pacific Standard Time
</span>
This pattern[311]hResume, hReview, and hAtom microformats. For example, I can reuse the content contained in the following hCard:
<span class="vcard">
<span class="fn n" id="ryee-hcard">
<span class="given-name">Raymond</span> <span class="family-name">Yee</span>
</span>
</span>
in a second hCard:
<span class="vcard">
<a href="#ryee-hcard" class="include" title="Raymond Yee"></a>
<span class="org">UC Berkeley</span>
<span class="title">Alumnus</span>
</span>
Note the use of id="ryee-hcard" in the first hCard instance and href="#ryee-hcard" to tie the two hCard instances, as well as class="include" in the <a> element in the hCard instance that reuses data from the other instance.