Note: Eine deutsche Version des Artikels findet ihr bei amazingweb
Microformats define classes that can be used in any HTML tag to provide semantic information to non-human readers. Among the different ways to reach this goal, microformats have the advantage that they do not represent a modification of the HTML specification, but only use existing artefacts and further specify their use.
There are various microformats to encode many different types of semantic information:
- Geographic coordinates
- Atom information
- Services or product lists
- Media Information
- Reviews of services and products
- And more …
A common example of this is the hCard microformat. With a nice CSS stylesheet the following might look good:
<div id="contact-data-Henri-Benoit"> <a href="http://www.amazingweb.de">Henri Benoit</a> amazingweb GmbH <a href="mailto:firstname.lastname@example.org">email@example.com</a> Ölmühlweg 37 Königstein, Hessen, 61462 Germany +49 6174 297365 </div>
While it is understandable for human readers, it is difficult to interpret for machines. With the hCard microformat, these contact details would be encoded like this:
<div id="contact-data-Henri-Benoit" class="vcard"> <a class="url fn" href="http://www.amazingweb.de">Henri Benoit</a> <div class="org">amazingweb GmbH</div> <a class="email" href="mailto:firstname.lastname@example.org">email@example.com</a> <div class="adr"> <div class="street-address">Ölmühlweg 37</div> <span class="locality">Königstein</span>, <span class="region">Hessen</span>, <span class="postal-code">61462</span> <span class="country-name">Germany</span> </div> <div class="tel">+49 6174 297365</div> </div>
It looks exactly like the previous code for a human reader:
Königstein, Hessen, 61462
But all the data contained can be processed by machines. Google understands the following:
Microformats are also used by Google to present search results in a more useful way. When looking for a product, you will find many web sites listing this product together with a note representing user feedback and review comments. When these data are encoded with microformats, Google can extract them and show directly in the search results which average note was given to this product, how many users gave feedback… An entry in Google’s search results then looks like this:
In this example, the HTML code looks like this:
<html> <head> <title>amazingweb GmbH</title> </head> <body> <span class="hreview-aggregate"> <span class="item"> <span class="fn">amazingweb GmbH</span> <span class="url">http://www.amazingweb.de</span> </span> <span class="rating"> Bewertung : <span class="average">98</span> von <span class="best">100</span> </span> bei <span class="count">457</span> Bewertungen. <span class="summary">Just the best Internet agency !</span> </span> </body> </html>
You can check on this page how you microformats will then look like for Google. You can either type in a URL if the page is already visible on the Internet, or just enter some HTML code.
To use microformats you must do the following:
Add a special class to the tag containing the whole information. This tells what for a micro-format is used e.g.:
hreview aggregates is the microformat for consolidated review results.
vcard the microformat for contact details.
You can see above, that it is irrelevant which HTML tag is marked with the class. Of course, it actually only makes sense to use container tags such as
Additionally, all data will be marked individually with classes as defined in the
hreview aggregates specification:
itemfor the product itself.
itemis used as a container and can contain the following:
fnfor the name of the product
urlfor the web address
ratingis used as a container and can contain the following:
averagefor the average rating
bestfor the highest possible rating
worstfor the lowest rating
votesfor the number of votes taken into account
countfor the number of reviews into account
photocan be used to show an image of the product
summaryfor summary reviews
It should also be noted that if you use
votes, then you should theoretically list all reviews. But it is apparently not an issue for Google if it is not the case.
You cannot see in the search results all of the data that are marked with microformat but it still makes sense to mark them, because they are visible in other applications.