Menü

Kleine und mächtige Tools für Google Microformats und RDFa – Einfachere Verschlagwortung für Google

Mit Microformats und RDFa lernen Sie zwei Ansätze kennen, um Infos in Websites zu verschlagworten und mit semantischen Informationen zu versehen, die etwa Google für seine Rich Snippets verwendet.
Microformats und RDFa – reif für die Praxis?

Klein und unscheinbar, so lassen sich Microformats am besten zusammenfassen. Sie verstecken sich in der HTML-Seite und versehen einzelne Blöcke mit auf den ersten Blick unsichtbaren Zusatzinformationen. Der Hintergrund ist ein semantischer: Die Bedeutung von einzelnen Blöcken soll für Maschinen deutlich gemacht werden.

Der Mensch erkennt auf einer Website schnell, dass in einem bestimmten Block immer Adressdaten stehen. Eine Software tut sich damit wesentlich schwerer. Für sie ist das Muster Adresse nicht so einfach abzulesen, da eine Adresse sehr unterschiedlich geschrieben und angeordnet werden kann. Hier sollen die Microformats Abhilfe schaffen. Sie kennzeichnen den entsprechenden Block als Adresse, sodass eine Software solche Blöcke einfach finden und nutzen kann.

Der entscheidende Sinn ist, dass die Software – beispielsweise eine Suchmaschine – die Informationen aus einer umfangreichen Site herausfiltern, verlinken und mit weiteren Informationen anreichern und verknüpfen kann. So lassen sich Ortsangaben einfach mit einer Karte vernetzen, Kontakte in Adressbücher eintragen oder in sozialen Netzwerken aufrufen.

Microformats

Die eigentlichen Microformats basieren – im Gegensatz zu RDFa – vollständig auf XHTML. Sie verwenden ausschließlich drei Attribute, die im XHTML-Standard schon verankert sind. class ist davon sicherlich das Bekannteste und Wichtigste. class zeigt im Sinne eines Microformats nicht die CSS-Klasse an, sondern bestimmt die semantische Information.

Ein Beispiel sind Kontaktinformationen. Für Kontaktinformationen gibt es schon lange einen Standard, der zum Beispiel den Austausch zwischen verschiedenen E-Mail-Clients ermöglicht: vCard. Der Standard ist bei der IETF, neben dem W3C einem der Gralshüter der Webtechnologien, unter der Nummer 2426 registriert ().

vCard arbeitet wie eine virtuelle Visitenkarte. Die einzelnen Bereiche einer Adressinformation werden mit entsprechenden Kürzeln klassifiziert. Zum Beispiel fn für die Person mit Vor- und Nachname, org für das zugehörige Unternehmen und tel für eine Telefonnummer. Diese Vorgaben von vCard übernimmt hCard, der Vorschlag von der Microformats-Initiative.

Der Standard wird hier ausführlich beschrieben: . Die einzelnen Kürzel vom vCard-Standard werden dazu im (X)HTML-Quellcode einfach in class-Attribute geschrieben:

<div class="vcard"> <div class="fn">Person X</div> <div class="org">Firma Y</div> <div class="tel">089/123456789</div> <a class="url" href="http://www. firmaY.de/"> http://www.firmaY.de/</a> </div>

Die hCard selbst ist an der Klasse vCard zu erkennen. Dass es eine hCard ist, ergibt sich einfach daraus, dass sie in (X)HTML eingebunden ist. Die Gliederung der Informationen ist hierarchisch, sprich die class=“vcard“ steht in einem Tag, das alle anderen Elemente enthält.

Eine weitere Hierarchie gibt es beispielsweise bei adr. In diesem Block sind alle adressrelevanten Informationen wie Land, Ort und Postleitzahl enthalten. Die Angaben, welche Kürzel vorhanden sind, finden Sie sowohl im Microformats-Wiki als auch im vCard-Standard. Sie können sich allerdings auch sehr einfach vom hCard-Creator () erzeugen lassen.

Der HTML-Code ist natürlich noch variabel, denn manches, wie Name und zugehörige URL, wird in Links umgewandelt, obwohl das eventuell nicht gewünscht ist. Sie sehen auch, dass mehrere Klassen einfach durch Leerzeichen getrennt werden – genau wie bei CSS-Klassen. Hier ein Beispiel für eine einfache generierte hCard des Autors:

<div id="hcard-Tobias-Hauser" class="vcard"> <a class="url fn" href="http:// www.arrabiata.de/">Tobias Hauser</a> <div class="org">Arrabiata</div> <a class="email" href="mailto:tobias. hauser@arrabiata.de">tobias.hauser@arrabiata.de</a> <div class="adr"> <span class="country-name"> Deutschland</span> </div> </div>

weiterlesen auf Seite 2
Inhaltsverzeichnis 1/5
  • 1. Microformats und RDFa – Einfachere Verschlagwortung für Google
  • 2.
  • 3.
 
x