Microformats 2 : décryptage
Pour expliquer de manière très concise, les Microformats sont des attributs (en général class et rel) ajoutés aux balises HTML dans le but d'améliorer la sémantique du code et ainsi faciliter sa lecture par les machines (par exemple les robots) mais prioritairement par les humains.
Les Microformats 2 (ou µF 2) ont été développés afin de simplifier la tâche des auteurs (ceux qui créent les microformats) et des développeurs d'analyseurs de microformats, mais ils permettront également une meilleure utilisation des développeurs Web qui souhaitent ajouter des éléments sémantiques au contenu de leurs publications. Voici en détail les apports intéressants de cette nouvelle mouture.
Les améliorations apportées
Utilisation de préfixes pour identifier les noms de classe
On nous propose d'ajouter des préfixes pour améliorer l'identification des classes, des propriétés. La liste de ces préfixes à l'heure actuelle :
h- pour les noms de classes racines (exemples : h-card, h-event, h-entry...)
p- pour les propriétés simples (exemples : p-fn, p-summary...)
u- pour les propriétés url (exemples : u-url, u-photo...)
dt- pour les propriétés de date (exemples : dt-start, dt-end...)
e- pour les propriétés dont la valeur est le contenu entier d'une portion de page (exemple : e-content)
Mais pourquoi diable est-on passé à ce type de syntaxe ? A-t-on succombé à la mode du préfixage que l'on retrouve dans les feuilles de style (-moz-, webkit-, -o-...)...
Plusieurs raisons à cela :
On améliore ainsi la recherche des microformats dans la page, la tâche des analyseurs (parseurs) de code microformaté sera ainsi facilité, ils retrouveront plus aisément les données recherchées.
Il y aura moins de risques de collisions entre des noms de classes utilisées pour des besoins de mise en forme et celles utilisées pour des raisons sémantiques, évitant ainsi de corriger la mise en page originale. Exemple : description (mise en forme) != p-description (sémantique).
La syntaxe est indépendante du vocabulaire utilisé, ainsi, on assure une interopérabilité de ce type de classes qui peuvent être utilisées par d'autres microformats, par les microdata, par RDF...
Voici les classes racines et leurs propriétés correspondantes détaillées sur le site microformats.org : h-adr, h-card, h-entry, h-event, h-geo.
Les propriétés sont toutes optionnelles et ne sont plus hiérarchisées
En clair, toutes les propriétés d'un microformat donné sont optionnelles et il n'y a plus de sous-propriétés. Cela simplifie et clarifie énormément leur utilisation. Prenons un exemple, voici une hCard "classique" :
<span class="vcard">
<span class="fn n">
<span class="given-name">Toto</span>
<span class="family-name">Schmitt</span>
</span>
</span>
Pour beaucoup de balises, la propriété fn est obligatoire, une hiérarchie des différentes classes obligatoire (given-name et family-name doivent être des sous-propriétés de n) pour que le contenu microformaté soit correctement analysé.
Voici ce que cela pourrait donner avec la syntaxe microformats 2 :
<span class="h-card">
<span class="p-given-name">Albert</span>
<span class="p-family-name">Schmitt</span>
</span>
Plus de sous-propriétés, moins de balises.
Utilisation d'une seule classe pour plusieurs propriétés
On peut utiliser des classes racines sans utiliser aucune propriété, ces propriétés seront automatiquement déduites à partir du contenu. Un exemple simple à nouveau :
<a class="h-card" href="http://www.tomiungerer.com/">Tomi Ungerer</a>
Les outils d'analyse de ce code vont pouvoir ainsi obtenir le type de microformat et les propriétés, à savoir :
Type : h-card
Propriété p-name : Tomi Ungerer
Propriété u-url : http://www.tomiungerer.com/
Quelques autres particularités des microformats 2 en bref :
Il est bien entendu possible de combiner plusieurs types de microformats : combiner des microformats sur le site officiel.
La rétro-compatibilité peut être assurée : rétro-compatibilité sur le site officiel.
Les microformats 2 sont à présent considérés comme étant prêts à être utilisés en production, vous pouvez donc vous lancer ;)
Article réalisé par jojaba (collectifs Alsacreations) sous licence Creative Commons