Microformats : Combler les Lacunes du HTML

par Christophe Ducamp le 6 avril 2008

Traduction en cours d’un article paru dans SitePoint – Seul le lien original fait référence

Microformats – Combler les Lacunes du HTML

Dans cette référence, les sujets portent sur les standards (ou pour utiliser les termes du W3C, les « recommandations ») qui s’appliquent aux éléments et attributs du HTML/XHTML. Si vous les avez tous lus (dans ce cas, vous méritez une étoile d’or), il pourrait vous arriver de temps à autre de vous dire, « bon c’est bien fichu, mais comment puis-je baliser une adresse, comme celle où j’habite ? ». Ou peut-être que vous vous êtes posé la question « Comment devrai-je baliser quelque chose comme la date d’un évènement ? ». Si vous avez réfléchi à cela, alors vous avez déjà fait progresser mon scénario d’application des microformats. Mais qu’est-ce que les microformats et pourquoi devriez-vous vous y intéresser ?

Dans les saveurs actuelles du HTML et du XHTML, il existe un bon nombre d’éléments qui, dans l’environnement actuel, apparaissent comme étant complètement hors de propos. Par exemple, quand vous vous retrouvez à utiliser les éléments xmp ou tt. Je ne l’ai jamais fait. Également s’agissant des éléments semblant superflus et ayant été forgés par quelques scientifiques pour qui leur utilisation était limité en pratique, il semble vraiment qu’il y ait quelques omissions dans les spécifications (et par specs, je veux dire bien sûr « recommandations » – néanmoins la plupart des personnes normales font référence à elles en tant que specs !). L’exemple de l’adresse que j’ai éludé au-dessus est l’une de ces omissions.

Maintenant, pour ceux qui prêtent encore attention – et pour ceux qui ont dévoré les contenus de cette référence du début à la fin – on peut tout de même progresser à ce stade : « Ah, mais il existe un élément pour les adresses. Il s’appelle ‘address‘. » Mais hélas, vous faites fausse route. Un rapide retour à la référence pour address révélera que cet élément n’est pas utilisé pour baliser un endroit physique, mais qu’il est en fait réservé pour identifier la personne à contacter concernant une page Web et que par conséquent, il peut inclure une adresse e-mail ou un numéro de téléphone ou quelque chose de cet acabit. Si l’élément address est utilisé pour baliser un endroit (numéro, rue, localité, etc), il est en fait mal utilisé. Mais alors que devriez-vous faire ?

Entrez dans les Microformats.

L’idée derrière les Microformats est de combler ces lacunes existantes dans les standards actuels, tout en utilisant – et ceci est assez difficile – uniquement du HTML/XHTML standard et valide. Comment cela peut-il être possible ? En ajoutant à ces éléments standards un ensemble défini de valeurs d’attribut qui sont basées sur un standard pré-existant. Ainsi, si vous voulez par exemple baliser les informations de contact de quelqu’un, vous pouvez utiliser hCard, le microformat conçu à cette effet, qui est fondé sur le format plus ancien et standardisé de la vcard (l’usage de hCard sera entièrement décrit d’ici peu). Les différentes parties des informations de contact – nom de famille, prénom, localité, rue, etc. – sont toutes identifiées par un attribut de classe qui peut être appliqué à n’importe quel élément HTML ; vous pouvez aussi faire usage de ces noms de classe pour modifier le style.

Ce n’est pas dévoiler un secret très bien conservé que d’avancer que le mécanisme du Consortium du World Wide Web Consortium (W3C) peut vraiment s’enrayer, ce qui est très frustrant pour des développeurs Web, programmeurs et designers du monde entier. Néanmoins, avec les microformats c’est une autre histoire. Bien entendu, les ‘standards’ pour les Microformats sont également révisés et validés par les pairs, mais cela se produit bien plus rapidement. Dans l’intervalle de temps durant lequel CSS3 a été discuté et mis à disposition par le W3C, pour ne garder à cette heure qu’une recommandation dans les travaux, la totalité du concept des microformats était né, et plusieurs standards définis, avec bien plus de microformats en discussion et approchant de leur version finale.

Pour le dire vite, si un mécanisme pour marquer le HTML pour un objectif spécifique doit être accepté (et, on l’espère, utilisé) comme un microformat, il a besoin de satisfaire tous ces points :

  • Le Microformat doit résoudre un problème (et non pas créer quelque schéma fantaisiste pour baliser quelque chose qui existe déjà ou ne le garantit vraiment pas).
  • Il devrait démarrer aussi simplement que possible.
  • Il devrait être conçu d’abord pour les humains, ensuite pour les machines.
  • Il devrait réutiliser des standards existants et largement adoptés (par ex. IETF).
  • Pour finir, il devrait encourager des développements/services décentralisés (par exemple les services d’agrégation).

Pour vous donner une idée sur la manière dont les microformats peuvent offrir un avantage à l’utilisateur, prenons un exemple du vrai monde chez Google.

Google Maps et hCard

Quand Google a ajouté du contenu microformaté à ses résultats de recherche, ç’aurait été tout sauf invisible pour la plupart des utilisateurs réguliers que quelque chose de nouveau ait été ajouté. Cela a probablement pris très peu de temps à leurs développeurs d’ajouter les attributs de classe supplémentaires aux résultats de recherche, aussi cela n’aura pas été un effort inutile. Mais pour bon nombre de personnes – moi y compris – ajouter le microformat hCard a offert une excellente nouvelle fonctionnalité. Pour que cette fonctionnalité opère, cela requiert l’ajout d’une barre d’outils dans le navigateur qui peut alors détecter la présence de microformats sur une page. Personnellement j’ai essayé l’extension Tails (pour Firefox) et aussi l’extension Operator (aussi pour Firefox). En supposant que vous ayez ajouté ces barres d’outils, voici ce à quoi vous pouvez vous attendre au moment d’utiliser Google Maps pour chercher des restaurants locaux avec l’extension Operator :

  • Recherche Google Maps pour une Maison du Curry dans votre quartier
  • Les résultats apparaissent sur la carte avec des pointeurs que vous pouvez cliquer et aussi une liste en bas sur le côté gauche. (Normalement c’est là où votre interaction s’arrête et vous pouvez produire une note des détails du restaurant avant de téléphoner pour réserver une table.)
  • Operator vous notifie de la présence de Microformats en affichant l’une des icônes de la barre d’outils (qui était précédemment grisée)
  • Le fait de cliquer sur l’icône mise en valeur révèle la liste des Maisons du Curry trouvées, et vous pouvez ensuite exporter chacune d’elles individuellement – ou toutes en une fois – vers le carnet d’adresses de votre ordinateur.
  • Si votre téléphone mobile est couplé à votre ordinateur via Bluetooth – quelque chose que beaucoup de gens font pour synchroniser leurs contacts et agendas – vous pouvez alors mettre rapidement tous ces contacts sur votre téléphone mobile.

Il y a peu de temps, j’ai fait tout ce qui est décrit au-dessus à des fins de démonstration (une démonstration en ligne est disponible sur http://www.youtube.com/watch?v=Kjp4BaJOd0M), et il était possible de chercher les établissements et d’obtenir tous leurs numéros de téléphone et adresses sur mon téléphone en moins de 60 secondes. Je ne serai plus jamais à court de Maison du Curry si je devais me retrouver dans un cas de besoin urgent de Poulet Tikka Masal sans accès à un annuaire téléphonique ou à l’Internet, je peux d’ailleurs remercier les microformats d’avoir rendu cela possible.

Un autre outil qui vaut la peine d’être mentionné à ce stade est Optimus (http://microformatique.com/optimus/) qui n’est pas une extension navigateur mais un service basé sur le Web. Il fournit un mécanisme pour transformer le contenu sur une page qui a été balisé sous un Microformat vers un autre format, actuellement XML ou JSON. Ce serait un job supplémentaire d’ajouter un lien vers votre site Web dans une section qui est utilisé sur tout le site (par exemple un fichier inclus dans l’en-tête ou le pied de page) et de ce fait fournir des formats alternatifs pour tous vos contenus microformatés. Comme le dit la ligne savoureuse du site Web : « Maintenant votre site Web pourrait vraiment être votre API avec la beauté des microformats et la puissance d’Optimus.”

Microformats – Constamment en évolution

Du fait de la nature d’émergence rapide des Microformats (rapidité relative comparée au W3C, au moins !), il n’est pas possible de décrire tous les microformats disponibles. Le temps que ceci s’imprime, la liste aura probablement évoluée. Néanmoins cela vaut la peine de jeter un oeil sur quelques microformats spécifiques et sans surprise il s’avère que ce sont ceux qui existent depuis le plus longtemps du fait qu’ils aient été les premiers à être définis et qu’ils ont été les plus utiles pour l’implémentation. Pour une liste complète des microformats, allez sur le http://microformats.org/wiki. Si vous souhaitez vous impliquer dans la discussion et aider à former de nouveaux microformats, vous pouvez rejoindre la liste de discussion sur http://microformateurs.org/discussion/.

Les Microformats décrits par cette référence sont :

Pour démarrer, nous jetterons un oeil à la hCard – l’un des meilleurs exemples de Microformats paru du fait de son potentiel d’usages.

Dans cette partie :

  • hCalendar
    fournit un mécanisme pour baliser les évènements (date, heure, lieu, etc.)
  • hCard
    fournit un mécanisme pour baliser les informations de contact
  • hreview
    standardise une méthode pour les revues critiques de produit, service
  • XFN
    identifie la relation sociale des liens entre les pages Web
  • rel- Microformats
    fournit une relation supplémentaire concernant la destination du lien

Laisser un commentaire

Article précédent :

Article suivant :