Mikroformate

Die Mikroformate sind dafür vorgesehen, die Bedeutung von Inhalten jeglicher Art dem Web verständlich zu machen, ohne dabei den eigentlichen Inhalt zu ändern. Sie sind ein wichtiges SEO-Instrument, da hiermit zusätzliche Informationen in Form von kleinen Inhaltsauszügen (Rich Snippets) für die Ergebnisseiten der Suchmaschinen (SERP) gekennzeichnet werden. Somit können Mikroformate ein indirekter Faktor für das Ranking sein.


Wofür benötige ich Mikroformate?

Wofür die Mikroformate benötigt werden möchte ich gerne anhand folgenden Beispiels visualisieren:

<html>
  <body>
    <div>
      <div>Max Mustermann</div>
      <div>Musterfirma</div>
      <div>01234/56789</div>
      <a href="https://musterurl.com/">https://musterurl.com/</a>
    </div>
  </body>
</html>

Im Beispiel soll ein Mitarbeiter einer Firma wiedergegeben werden. Für uns Menschen ist es sehr einfach herauszufinden, wie die Kontaktdaten des Mitarbeiters lauten.

Stellen wir uns nun vor, dass ein Algorithmus die Kontaktdaten herausfinden soll. Dies würde ihn vor eine sehr schwierige Aufgabe stellen, da er keinerlei Hinweise zu dem jeweiligen Inhalt vorliegen hat. Genau hier kommen die Mikroformate zum Einsatz. Wir helfen dem Algorithmus dabei, die Inhalte zu verstehen und machen somit erkennbar, was genau in dem jeweiligen Textabschnitt beschrieben wird. Wie genau hierzu die Mikroformate aussehen würden, ist weiter unten im Abschnitt „Beispiel: hCard“ zu sehen.


Unterschied elementare und zusammengesetzte Mikroformate

Elementare Mikroformate

Ein elementares Format ist als Minimallösung für ein einzelnes Problem vorgesehen, welches aus einem Standard-XHTML-Elementen aufgebaut ist. Es wurde so entworfen, dass es zum einen in Webseiten integriert und zum anderen als Baustein für größere zusammengesetzte Mikroformate genutzt werden kann.

Für die Einbindung wird lediglich ein einziges class oder rel Attribute benötigt.

Beispiele: rel=“nofollow“, rel=“tag“, rel="license"

 

Zusammengesetzte Mikroformate

Ein zusammengesetztes Mikroformat entsteht aus mehreren elementaren Mikroformaten und/oder Standard-HTML-Elementen. Es wurde für die Einbindung in Webseiten entworfen und ist in der Lage, ein bestehendes standardisiertes Schema exakt so darzustellen, welches einen zusammengesetzten Datentyp beschreibt.

Für die Einbindung werden immer eine Kombination aus mehreren class und/oder rel Attributen benötigt.

Beispiele: hCalendar, hCard, hReview


Beispiel: hCard

Das Mikroformat hCard bietet eine Sammlung von vordefinierten Werten für das class Attribut, mit denen Kontaktinformationen wie Namen, Adressen, Telefonnummern, E-Mail-Adressen und Organisationsnamen übermittelt werden. Die Basis der hCard entstand durch die vCard, dem Format für Kontaktinformationen, welches bspw. in Microsoft Outlook und dem Apple-Adressbuch verwendet wird.

Ein Beispiel mit verwendeter hCard könnte wie folgt aussehen:

<html>
  <body>
    <div class="vcard">
      <div class="fn">Max Mustermann</div>
      <div class="org">Musterfirma</div>
      <div class="tel">01234/56789</div>
      <a class="url" href="https://musterurl.com/">https://musterurl.com/</a>
    </div>
  </body>
</html>

Hierbei wurde lediglich auf einen Bruchteil der vorhandenen Standardfelder der hCard zugegriffen. Alle verfügbaren Felder sind hier zu finden: http://microformats.org/wiki/hcard-cheatsheet


Kann ich mir die Erstellung des Codes vereinfachen?

Die Antwort lautet glüclicherweise: Ja! Da die manuelle Einbindung der Mikroformate zwar einfach, aber dennoch relativ aufwendig und fehlerbehaftet sein kann, stellt http://microformats.org/ für die Mikroformate hCard, hCalendar und hReview eigene Generatoren zur Verfügung: 

Der generierte Code kann einfach übernommen werden.