Tutorial Integration von Mikroformaten
Seite 9 von 10

Microformat hResume

Alle Mikroformate wurden vom Addon des Browsers erfolgreich erkannt.

Alle Informationen werden vom Browser gruppiert angezeigt.

Alle gruppierten Informationen sind einzelnd exportierbar und downloadbar und können dannach auch einzelnd in MS Outlook importiert bzw. übernommen werden.

Das Mikroformat hResume ist eines der beliebtesten Formate. Es wird sehr häufig eingesetzt, um bspw. Lebensläufe oder die Geschichte eines Unternehmens als solche zu kennzeichnen. Browser und Suchmaschinen können daraus Informationen zu Personen, Unternehmen, Veranstaltungen, Empfehlungen und weiteres gewinnen.

hResume-Einleitung

Wie alle anderen Microformate auch, wird das hResume-Microformat innerhalb eines HTML-Block- oder Inlineelementes gekapselt und mit einer spezifischen Styleklasse gekennzeichnet: "hresume".

hResume-Strukturierung

Innerhalb des hResume-Blocks können beliebige andere Microformate angeordnet werden. Oft werden diese auf Grund der Menge gruppiert:

Der Browser hebt die Microformate in der jeweils vorgegebenen Strukturierung und Reihenfolge an.

hResume-Beispiel

<div class="hresume">
 <div class="vcard">
  <div class="fn">
   <span class="given-name">Max</span> <span class="family-name">Mustermann</span>
  </div>
  <div class="adr">
   <span class="street-address">Mustergasse 1a</span>
   <span class="locality">Leipzig</span>, 
   <span class="region">Sachsen</span> 
   <span class="postal-code">04229</span>
   <span class="country-name">Deutschland</span>
  </div>
  <div>
   <span class="tel"><span class="work">+49 341 3552960</span> (Büro)</span>
   <span class="tel"><span class="home">+49 341 1234567</span> (Home)</span>
   <span class="tel"><span class="fax">+49 34135529619</span> (Fax)</span>
  </div> 
  <div>
   E-Mail: <a class="email" href="mailto:info@viomatrix.de">info@viomatrix.de</a>
   Web: <a class="url" href="http://www.viomatrix.de">www.viomatrix.de</a>
  </div>
 </div>
 <hr/>
 <h2>Ausbildung</h2>
 <div class="vevent vcard">
  <span class="summary">Abitur</span>
  <abbr class="dtstart" title="1995-01-01">Januar 1995</abbr> - 
  <abbr class="dtend" title="1997-01-01">Januar 1997</abbr>
  <div class="org">Max Mustermann Gymnasium</div>
  <div class="adr">
   <span class="street-address">Geislergasse 45</span>
   <span class="locality">Hohenmückeheim</span>, 
   <span class="region">Sachsen</span> 
   <span class="postal-code">87452</span>
   <span class="country-name">Deutschland</span>
  </div>
 </div>
 <div class="vevent vcard">
  <span class="summary">Wirtschaftsinformatik</span>
  <abbr class="dtstart" title="1997-02-01">Februar 1997</abbr> - 
  <abbr class="dtend" title="2003-12-01">Dezember 2003</abbr>
  <div class="org">Universität Leipzig</div>
  <div class="adr">
   <span class="street-address">Ritterstraße 26</span>
   <span class="locality">Leipzig</span>, 
   <span class="region">Sachsen</span> 
   <span class="postal-code">04109</span>
   <span class="country-name">Deutschland</span>
  </div>
 </div>
</div>

Testen Sie hier die beschriebene VIO.Matrix-Funktion.
Nutzen Sie den Button

um den eingegebenen Code zu prüfen.
Über

können Sie den Ausgangszustand wiederherstellen.

Zeichen:

Über diesen Button, können Sie Ihren, im oberen Fenster, eingebenen Code auf Richtigkeit überprüfen und den entsprechenden (X)HTML Code ausgeben lassen.

Code überprüfen

Das Ganze sieht auf den ersten Schlag sicher etwas verwirrend aus. Sie werden aber bei genauerem Hinsehen feststellen, dass es das Selbe ist, wie bei den anderen Mikroformaten. Meistens wird ein Format eingeleitet, bestimmte Informationen werden einzeln gruppiert und dann wird das jeweilige Format wieder geschlossen. Ganz am Anfang steht wie bereits beschrieben, die class hResume.

Links von hier finden Sie eine kleine Bilddokumentation, in welcher beschrieben wird, wie Sie testen können, ob alles geklappt hat. Einfach auf das entsprechende Bild klicken um es zu vergrößern.

Zur Seite 10