Niveau Niveau confirmé

Microformats

Tutorielhtml

Publié par le , mis à jour le (27473 lectures)

xhtml sémantique microformats

Sommaire

  1. Introduction
  2. Les microformats simples
  4. Les microformats composés

Les microformats composés

Les microformats que nous allons aborder dans ce chapitre sont les suivants : hCard, hCalendar, hAtom, hReview, hResume. Vous constaterez que hCard sera souvent présent dans les autres formats indiqués auparavant et que de nombreuses propriétés sont partagées par ces différents microformats composés. Voyons tout d'abord en détail ce qui compose hCard, cela sera une bonne base de connaissance pour comprendre les autres microformats composés. Pour davantage de clarté de lecture, nous avons modifié le style des bouts de codes microformatés en action (cadre vert, image de fond en haut à droite), ce n'est pas parce que vous ajoutez des propriétés de microformats que vous obtiendrez cette mise en page !

hCard

Ce format fait partie des microformats dits « stables » et dont la spécification standard ouverte est établie.

Un exemple d'hCard généré par l'hCard creator mis à disposition sur le wiki des microformats et légèrement modifiée pour l'adapter aux besoins de cet exemple français :

<div id="hcard-Raphaël-Goetter" class="vcard">
 <a class="url fn" href="http://alsacreations.fr">Raphaël Goetter</a>
 <div class="org">Alsacréations</div>
 <a class="email" href="bob.eponge@exemple.com">bob.eponge@exemple.com</a>
 <div class="adr">
  <div class="street-address">10 Place du Temple Neuf</div>
  <span class="postal-code">67000</span>
  <span class="locality">Strasbourg</span>
  <span class="country-name">France</span>
 </div>
 <div class="tel">09 54 96 50 50</div>
</div>

Voici ce qui s'affichera :

Raphaël Goetter
Alsacréations
10 Place du Temple Neuf
67000 Strasbourg France
09 54 96 50 50

Dans le cas présent, nous ne sommes partis d'aucun code, tout a été généré automatiquement à partir du formulaire ad-hoc. L'insertion des microformats réclame donc l'ajout de balises "neutres" qui permettront de définir les propriétés. HTML possède déjà deux éléments "neutres" : <span> (pour le code en ligne) et <div> (pour les blocs de code). Ce sont donc ces deux balises qui ont été tout naturellement utilisées pour ajouter les microformats. Si vous partez de code XHTML déjà existant, vous pourrez profiter des balises de formatage pour insérer les propriétés. Voilà ce que ça pourrait donner pour une page déjà existante :

<dl id="hcard-Raph-Goetter2" class="vcard">
  <dt><a class="url fn" href="http://alsacreations.fr">Raphaël Goetter</a></dt>
    <dd class="org">Organisation : <span class="value">Alsacréations</span></dd>
    <dd>Courriel : <a class="email" href="mailto:bob.eponge@exemple.com">bob.eponge@exemple.com</a></dd>
    <dd>
	  <dl  class="adr">
      <dt>Adresse :</dt>
        <dd class="street-address">10 Place du Temple Neuf</dd>
        <dd>
        <span class="postal-code">67000</span> 
        <span class="locality">Strasbourg</span> 
        <span class="country-name">France</span>
        </dd>
      </dl>
    </dd>
    <dd class="tel">Téléphone : <span class="value">09 54 96 50 50</span></dd>
</dl>

Ce que cette hCard donne en réalité :

Raphaël Goetter
Organisation : Alsacréations
Courriel :
Adresse :
10 Place du Temple Neuf
67000 Strasbourg France
Téléphone : 09 54 96 50 50

Dans le code hCard proposé ci-dessus on peut trouver les différentes propriétés définies. L'élément racine est toujours une balise de class vcard, Les autres propriétés y sont imbriquées et sont donc ses enfants. Il peut également y avoir des niveaux d'imbrication supplémentaires comme pour la propriété tel qui accepte 2 enfants : type et value. Pour mieux comprendre comment sont imbriqués ces propriétés, voici la liste complète pour le microformat hCard. La seule propriété devant obligatoirement se trouver dans vcard est fn, toutes les autres sont facultatives. Une hCard basique pourrait donc ressembler à ça :

<span class="vcard">
 <span class="fn">Mister T</span>
</span>

Voici l'arborescence complète :

  • class="vcard" - élément racine [obligatoire]
    • class="adr" - composé des sous-propriétés suivantes :
      • class="type" - valeurs possibles : work, home, pref, postal, dom, intl
      • class="post-office-box" - boîte postale
      • class="street-address" - rue
      • class="extended-address" - information complémentaire pour l'adresse
      • class="region" - département
      • class="locality" - commune
      • class="postal-code" - code postal
      • class="country-name" - pays
    • class="agent" - administrateur, assistant, secrétaire sous forme de hCard imbriquée
    • class="bday" - date de naissance au format ISO (voir Datetime Design Patterns)
    • class="category" rel="tag"
    • class="email"
      • class="type" - valeurs possibles : Internet, x400, pref (favorie)
      • class="value"
    • class="fn" - nom formaté (en principe : Prénom Nom) [obligatoire]
    • class="geo" - géolocalisation
      • class="latitude"
      • class="longitude"
    • class="key" - pour spécifier une clé publique ou un certificat d'authentification
    • class="label" - pour spécifier le texte formaté correspondant à l'adresse de destination
    • class="logo"
    • class="mailer"
    • class="n" - si fn se compose de deux mots, la définition de n est facultative.
      • class="honorific-prefix" - préfixe honorifique
      • class="given-name" - nom usuel
      • class="additional-name" - nom supplémentaire
      • class="family-name" - nom de famille
      • class="honorific-suffix" - suffixe honorifique
    • class="nickname" - pseudonyle
    • class="note" - information supplémentaire
    • class="org"
      • class="organization-name"
      • class="organization-unit"
    • class="photo" - Lien vers la photo
    • class="role" - Information concernant le rôle de la personne
    • class="sound" - Un son lié à la vcard
    • class="title" - L'intitulé du métier
    • class="tel" - Téléphone
      • class="type" - valeurs possibles : voice (vocal), home (résidence), msg (à messagerie), work (professionnel), pref (numéro favori), fax, cell (portable), video (visioconférence), pager (bipeur), bbs (bulletin board system, forum), modem, car (voiture), isdn, pcs (service de communication personnel)
      • class="value" - numéro de téléphone
    • class="tz" - Fuseau horaire
    • class="uid" - identifiant unique
    • class="url" - une adresse Web
hCalendar

Ce format gère tout ce qui concerne des évènements. Il est basé sur le standard iCalendar (RFC2445). Là encore, voici un exemple généré par l'hCalendar creator mis à disposition :

<div id="hcalendar-Kiwi-Party" class="vevent">
Du <abbr title="2011-04-01T20:0000" class="dtstart">1<sup>er</sup> avril à 20H00</abbr> au <abbr title="2011-04-02T03:00" class="dtend"> 2 avril à 3H00</abbr> :  <span class="summary">La Kiwi Party 2011</span> à l'<span class="location">Epitech à Strabourg</span>
<div class="description">
La Kiwi Party est une rencontre organisée par Alsacréations tout d'abord informelle et qui s'est peu à peu transformée en après-midi de conférences techniques web. L'on peut y assister gratuitement à des présentations de qualité, exposées par des orateurs experts dans leur domaine mais aussi se laisser surprendre par des petites surprises ludiques et gourmandes, le tout suivi d'une soirée dans un bar dans une ambiance détendue.
</div>
</div>

Ce qu'on obtient :

Du 1er avril à 20H00 au 2 avril à 3H00 : La Kiwi Party 2011 à l'Epitech à Strabourg
La Kiwi Party est une rencontre organisée par Alsacréations tout d'abord informelle et qui s'est peu à peu transformée en après-midi de conférences techniques web. L'on peut y assister gratuitement à des présentations de qualité, exposées par des orateurs experts dans leur domaine mais aussi se laisser surprendre par des petites surprises ludiques et gourmandes, le tout suivi d'une soirée dans un bar dans une ambiance détendue.

Petites modifications afin d'adapter à une situation plus « naturelle » sur un site :

<div id="hcalendar-Kiwi-Party2" class="vevent">
<h3 class="summary">La Kiwi Party 2011</h3>
  <ul>
    <li><abbr title="2011-04-01T20:0000" class="dtstart">1<sup>er</sup> avril à 20H00</abbr></li>
    <li>Fin prévue le <abbr title="2011-04-02T03:00" class="dtend">2 avril vers 3H00</abbr></li>
    <li>Lieu : <span class="location">Epitech à Strabourg</span></li>
  </ul>
  <p class="description">
  La Kiwi Party est une rencontre organisée par Alsacréations tout d'abord informelle et qui s'est peu à peu transformée en après-midi de conférences techniques web. L'on peut y assister gratuitement à des présentations de qualité, exposées par des orateurs experts dans leur domaine mais aussi se laisser surprendre par des petites surprises ludiques et gourmandes, le tout suivi d'une soirée dans un bar dans une ambiance détendue.
  </p>
</div>

Ce que ça donne :

La Kiwi Party 2011

  • 1er avril à 20H00
  • Fin prévue le 2 avril vers 3H00
  • Lieu : Epitech à Strabourg

La Kiwi Party est une rencontre organisée par Alsacréations tout d'abord informelle et qui s'est peu à peu transformée en après-midi de conférences techniques web. L'on peut y assister gratuitement à des présentations de qualité, exposées par des orateurs experts dans leur domaine mais aussi se laisser surprendre par des petites surprises ludiques et gourmandes, le tout suivi d'une soirée dans un bar dans une ambiance détendue.

La racine d'un hcalendar est vcalendar, mais sa présence est facultative. Si une page comporte au moins un évènement défini par vevent, on considére que l'on est en présence d'un hcalendar. Chaque évènement doit donc comporter l'élément vevent en tant qu'élément racine. Voici l'arborescence vevent :

  • class="vevent" - élément racine [obligatoire]
    • class="category" - valeurs possibles : meeting, appointment, conference, expo
    • class="class" - valeurs possibles : public, private, confidential
    • class="description" - Un synopsis plus détaillé que le résumé (summary)
    • class="dtstart" - Début de l'évènement [obligatoire]
    • class="dtend" - Fin de l'évènement
    • class="dtstamp" - Date/horaire de création du document contenant les informations concernant l'évènement
    • class="duration" - Durée de l'évènement
    • class="location" - Endroit où aura lieu l'évènement (sous forme d'hcard, de propriété adr ou geo)
    • class="status" - Etat de l'évènement - valeurs possibles : tentative, confirmed, cancelled
    • class="summary" - Court synopsis, titre ou nom de l'évènement [obligatoire]
    • class="uid" - Un identifiant unique pour l'évènement (typiquement, une URL)
    • class="url" - En général, l'URL de l'uid
    • class="last-modified" - Date/horaire de dernière modification des informations sur l'évènement
    • class="method" Fonction de l'objet évènement - valeurs possibles : publish, request, reply, add, cancel, refresh, counter ou declinecounter
    • class="attendee" - Participant à l'évèvenement (éventuellement sous forme d'hcard)
      • class="partstat" - Le statut du participant
      • class="role" - Le rôle du participant
    • class="contact" - Demande de renseignements à propos de l'évènement (éventuellement sous forme d'hcard)
    • class="organizer" - L'organistaeur de l'évènement (éventuellement sous forme d'hcard)
    • class="attach" - Une ressource associée à l'évènement
hAtom

Comme son nom l'indique, ce microformat s'inspire du format de syndication Atom cousin du fameux protocole RSS permettant, via un flux, de récupérer les informations de différents sites très rapidement. Il respecte donc la syntaxe de ce fil de syndication (Le format de syndication Atom - RFC 4287) mais ne joue pas le même rôle : il se contente de décrire le contenu d'un billet de blog ou d'un article de site. Prenons un exemple concret pour lui ajouter ce qu'il faut en utilisant les propriétés hAtom. Voici le code source de la suggestion d'un livre sur Alsacréations (dans ce cas, c'est une plaquette), proposée par Julie : Mémento XHTML (nous avons supprimé le sommaire afin de raccourcir un peu et d'autres petites broutilles inutiles et avons ajouté quelques informations afin de rendre l'exemple un peu plus croustillant… ;)) :

<div class="livre">
<h2>Mémento XHTML</h2>
  <div class="auteur ">
    <img src="//forum.alsacreations.com/avatars/small/21699-sans-titre.jpg" alt="" class="avatar" />
    <p>Livre  suggéré par <a href="/profil/lire/21699-juliegri.html">juliegri</a> (Etudiante ^^, Fegersheim)<br />
    <span class="meta">Mis &agrave; jour le 20 Juillet 2009. 4953 lectures.
    <br />Tags : <a href="/search/tag/xhtml">xhtml</a></span>
    </p>
  </div>
  <div class="auteur-end"></div>
  <div class="infos">
    <p class="infos">Critique du Mémento XHTML réalisé par Raphaël Goetter - <a href="http://www.alsacreations.com/livres/lire/794-mmento-xhtml.html">Rétrolien</a></p>
  </div>
  <div class="doc-content">
    <p>Indéchirable et imperméable, cette deuxième édition du mémento XHTML de Raphaël Goetter reposera sur le bureau de tout développeur web soucieux de concevoir des sites web conformes aux standards du Web, interopérables, élégants et faciles à maintenir.</p>
    <p>Pendant indispensable au mémento du même auteur sur CSS, il est l'aide-mémoire idéal sur le successeur de HTML et vous dépannera sur les sujets suivants : structure d'un document, balises de paragraphes, images, liens et tableaux, mise en forme, formulaires et objets, conteneurs génériques, classement par type, doctypes XHTML, balises et attributs déconseillés, commentaires XHTML, attribut id versus class...</p>
</div>

Voilà ce que ça pourrait donner après « microformatage » :

<div class="livre hentry">
  <h2 class="hentry-title">Mémento XHTML</h2>
  <div class="auteur author">
    <img src="//forum.alsacreations.com/avatars/small/21699-sans-titre.jpg" alt="" class="avatar logo" />
    <p>Livre  suggéré par <span class="vcard"><a href="/profil/lire/21699-juliegri.html" class="fn url">juliegri</a> (<span class="role">Etudiante</span> ^^, <span class="locality">Fegersheim</span>)</span><br />
    <span class="meta">Mis &agrave; jour le <abbr class="published updated" title="2009-07-20">20 Juillet 2009</abbr>. 4953 lectures.
    <br />Tags : <a href="/search/tag/xhtml" rel="tag">xhtml</a></span>
    </p>
  </div>
  <div class="auteur-end"></div>
  <p class="infos"><a href="http://www.alsacreations.com/livres/lire/794-mmento-xhtml.html" rel="bookmark" class="entry-summary">Présentation du Mémento XHTML réalisé par Raphaël Goetter</a></p>
  <div class="doc-content entry-content">
    <p>Indéchirable et imperméable, cette deuxième édition du mémento XHTML de Raphaël Goetter reposera sur le bureau de tout développeur web soucieux de concevoir des sites web conformes aux standards du Web, interopérables, élégants et faciles à maintenir.</p>
    <p>Pendant indispensable au mémento du même auteur sur CSS, il est l'aide-mémoire idéal sur le successeur de HTML et vous dépannera sur les sujets suivants : structure d'un document, balises de paragraphes, images, liens et tableaux, mise en forme, formulaires et objets, conteneurs génériques, classement par type, doctypes XHTML, balises et attributs déconseillés, commentaires XHTML, attribut id versus class...</p>
  </div>
  </div>

Ce code en action :

Mémento XHTML

Livre suggéré par juliegri (Etudiante ^^, Fegersheim)
Mis à jour le 20 Juillet 2009. 4953 lectures.
Tags :

 

Présentation du Mémento XHTML réalisé par Raphaël Goetter

Indéchirable et imperméable, cette deuxième édition du mémento XHTML de Raphaël Goetter reposera sur le bureau de tout développeur web soucieux de concevoir des sites web conformes aux standards du Web, interopérables, élégants et faciles à maintenir.

Pendant indispensable au mémento du même auteur sur CSS, il est l'aide-mémoire idéal sur le successeur de HTML et vous dépannera sur les sujets suivants : structure d'un document, balises de paragraphes, images, liens et tableaux, mise en forme, formulaires et objets, conteneurs génériques, classement par type, doctypes XHTML, balises et attributs déconseillés, commentaires XHTML, attribut id versus class...

Les différentes propriétés de ce microformat et leur imbrication :

  • class="hfeed" - Flux, si manquant, c'est la page qui représente le flux.
    • feed category - Mots-clés ou phrases en utilisant rel-tag.
    • class="hentry" - Elément racine [obligatoire]
      • class="entry-title" - Le titre [obligatoire].
      • class="entry-content" - Le contenu, faculatif.
      • class="entry-summary" - Le résumé, facultatif.
      • class="updated" - La date de mise à jour [obligatoire], utilisation du datetime-design-pattern.
      • class="published" - La date de publication, utilisation du datetime-design-pattern.
      • class="author" - Sous forme d'hCard [obligatoire].
      • bookmark (permalien) - facultatif, utilisation de rel-bookmark.
      • tags (marqueurs) - facultatif. Mots-clés ou phrases en utilisant rel-tag.

Si certaines propriétés obligatoires n'ont pas de valeur, des valeurs par défaut leurs seront attribuées.

Remarque : Nous vous avons indiqué ici ce qui concerne hAtom 0.1. La version 0.2 de ce microformat est en cours de développement. Dans cette version, tous les éléments à l'intérieur de hentry seront considérés comme étant facultatifs et obtiendront des valeurs par défaut trouvées dans la page HTML en cours.

hReview

Permet de formater les avis, les commentaires d'internautes. Voici un exemple créé à l'aide de hReview creator :

<div id="hreview-Super-site" class="hreview">
  <h2 class="summary">Super site !</h2>
  Le <abbr title="2004-04-27T11:18" class="dtreviewed">27 avril 2004</abbr>  par <span class="reviewer vcard"><span class="fn">Jojaba</span></span><span style="display: none;" class="type">website</span>
  <div class="item"><a href="http://www.alsacreations.com" class="fn url">Alsacréations</a></div>
  <blockquote class="description"><p><abbr class="rating" title="5">★★★★★</abbr> Alsacréations est un des sites que je fréquente le plus c'est derniers temps. Il est joli et apporte une réelle plus-value en therme de connaissances des standards du Web. Un site à recommander.</p></blockquote><div>

Ce qu'on obtient :

Super site !

Le 27 avril 2004 par Jojaba
Alsacréations

★★★★★ Alsacréations est un des sites que je fréquente le plus c'est derniers temps. Il est joli et apporte une réelle plus-value en therme de connaissances des standards du Web. Un site à recommander.

Les différentes propriétés à disposition :

  • class="hReview" - élément racine [obligatoire]
    • class="version" - La version de hReview utilisée
    • class="summary" - Court synopsis, titre ou nom du commentaire
    • class="item" - représenté par une hcard, une propriété adr ou geo [obligatoire].
      • class="fn" - hCard (pour les personnes) | hCalendar (pour les évènements) [obligatoire]
      • class="url"
      • class="photo"
    • class="type" - Valeurs possibles : product, business, event, person, place, website, url
    • class="reviewer" - La personne qui a donné son avis, sous forme d'hCard.
    • class="dtreviewed" - Date/horaire du commentaire au format ISO8601 absolu.
    • class="rating" - Entier avec points compris entre 1.0 et 5.0
      • class="worst" - Le nombre de points minimal attribuable (défaut : 1.0)
      • class="best" - Le nombre de points maximal attribuable (défaut : 5.0)
    • class="description" - Un synopsis plus détaillé que dans summary
    • class="category" - Catégorie de l'élément

Ici nous vous avons indiqué les définitions des propriétés valables pour la version 0.4 de hReview.

hResume

Ce microformat se charge du balisage des documents du type CV (Curriculum Vitae). Voici un exemple de mise en forme fictif et très sommaire…

<h2>CV de Bob Eponge</h2>
  <h3>Mes coordonnées</h3>
    <ul class="vcard">
      <li class="fn">Bob Eponge</li>
      <li class="adr">
      Adresse :
      <ul>
        <li class="street-address">1000, rue des courants marins</li>
        <li><span class="postal-code">20 000</span> <span class="locality">Océanville</span></li>
      </ul>
      </li>
      <li>Courriel : <a class="email" href="mailto:bob.eponge@exemple.com">bob.eponge@exemple.com</a></li>
      <li>Page Web : <a class="url" href="http://bob-eponge.com/">bob-eponge.com<a></li>
      <li>Téléphone : <span class="tel">01 234 567 890</span></li>
    </ul>
  <p class="summary">
  J'ai une expérience de 10 ans en matière de technologies Web 2.0 sous-marine. J'ai travaillé avec Ajax depuis pas mal d'années et CSS2 et XHTML depuis bien plus longtemps...
  </p>
  <h3>Mes études</h3>
    <ol class="vcalendar">
      <li class="education vevent">
      <span class="summary">Ecole maternelle des moules</span> 
      (<abbr class="dtstart" title="1994-09-01">1994</abbr> - <abbr class="dtend" title="1997-06-30">1997</abbr>)
      </li>
      <li class="education vevent">
      <span class="summary">Ecole primaire des pieuvres</span> 
     (<abbr class="dtstart" title="1997-09-01">1997</abbr> - <abbr class="dtend" title="2001-06-30">2001</abbr>)
     </li>
     <li>
     ...
     </li>
    </ol>
  <h3>Mes expériences</h3>
    <ol class="vcalendar">
      <li class="experience vevent">
      <span class="summary">Représentant des élèves</span> de l'
      <span class="location">Ecole maternelle des moules</span> de 
      <abbr class="dtstart" title="1995-12-01">décembre 1995</abbr> à <abbr title="1997-06-30">juin 1997</abbr>
      </li>
      <li class="experience vevent">
      <span class="summary">Tuteur d'un élève de maternelle</span> à l'
      <span class="location">Ecole primaire des pieuvres</span> de 
      <abbr class="dtstart" title="1998-09-01">septembre 1998</abbr> à <abbr title="1999-06-30">juin 1999</abbr>
      </li>
      <li>
      ...
      </li>
    </ol>
  <h3>Mes compétences</h3>
    <p>
    J'ai des connaissances en <a class="skills" rel="tag" href="http://fr.wikipedia.org/wiki/JavaScript">JavaScript</a>, <a class="skills" rel="tag" href="http://fr.wikipedia.org/wiki/Feuilles_de_style_en_cascade">CSS2</a> et <a class="skills" rel="tag" href="http://fr.wikipedia.org/wiki/Extensible_HyperText_Markup_Language">XHTML</a>.
    </p>
  <h3>Mes publications</h3>
    <ul class="publications">
      <li><cite>L'informatique au fond de l'eau</cite>, 2009, édition des 20 000 lieues.</li>
      <li><cite>XHTML et CSS2 pour les coulés</cite>, 2010, édition sous-marines.</li>
    </ul>

Ce qu'on obtient :

CV de Bob Eponge

Mes coordonnées

J'ai une expérience de 10 ans en matière de technologies Web 2.0 sous-marine. J'ai travaillé avec Ajax depuis pas mal d'années et CSS2 et XHTML depuis bien plus longtemps...

Mes études

  1. Ecole maternelle des moules (1994 - 1997)
  2. Ecole primaire des pieuvres (1997 - 2001)
  3. ...

Mes expériences

  1. Représentant des élèves de l' Ecole maternelle des moules de décembre 1995 à juin 1997
  2. Tuteur d'un élève de maternelle à l' Ecole primaire des pieuvres de septembre 1998 à juin 1999
  3. ...

Mes compétences

J'ai des connaissances en , et .

Mes publications

  • L'informatique au fond de l'eau, 2009, édition des 20 000 lieues.
  • XHTML et CSS2 pour les coulés, 2010, édition sous-marines.

Voici l'arborescence de ce microformat :

  • class="hResume" - Elément racine [obligatoire].
    • class="summary" - Aperçu des qualifications et des objectifs.
    • class="contact" - Informations sur la personne qui se présente dans le CV avec utilisation obligatoire d'une hCard et de la balise <address> si possible [obligatoire]
    • class="experience" - Expérience professionnelle : un ou plusieurs évènements hcalendar avec le nom de class experience et avec une hCard indiquant le métier, l'entreprise, l'adresse de l'entreprise, etc.
    • class="education" - Cursus scolaire : un ou plusieurs évènements hcalendar avec le nom de class education et avec une hCard indiquant le nom de l'école, l'adresse de l'école, etc.
    • class="skills" - Niveaux de qualification : phrases ou mots-clés en utilisant le microformat rel-tag.
    • class="affiliations" - Une ou plusieurs organisations auxquelles la personne est affiliée : utilisation de l'hcard de l'organisation.
    • class="publications" - Publications de la personne : une ou plusieurs citations en utilisant la balise <cite>.

Nous venons de vous exposer là les définitions des propriétés de la version 0.1 de hResume. Une version 0.2 est en cours de développement.

Là encore, pour ces microformats composés, il existe des profils XMDP qu'il faudrait intégrer aux pages concernées comme indiqué dans le chapitre concernant les microformats simples :

Quiz

Testez vos connaissances avec un Quiz Microformats