Google et les microformats

Posté le 28 juillet 2009 | 10 Commentaires

Je n’ai jamais parlé des microformats sur ce site et pourtant le sujet est des plus intéressants surtout depuis que Google a décidé de les intégrer dans ses pages de résultats, mais nous y reviendront.

Commençons donc par tenter de définir ce que sont les Microformats.

1) Les microformats permettent d’ajouter de la sémantique à des contenus web existants.

2) L’objectif est de permettre à de l’information contenu dans le corps d’une page web (adresses, les coordonnées géographiques, critique, prix) d’être traitée automatiquement par un logiciel.

3) Concrètement, grâce aux microformats un webmaster peut enrichir ses pages de contenus sémantiques à l’aide de classes et d’attributs XHTML et HTML, le plus simplement du monde.

Prenons donc un exemple des plus simples, mon adresse professionnelle dans ce texte :

David Castéra
Immersive Lab
27 bis avenue Tristan Derême
64400 Oloron Sainte Marie
France
Téléphone: +33-559-343-181
http://www.immersivelab.fr

Au niveau du code source on obtient ceci :

<div>
<div>David Castéra</div>
<div>Immersive Lab</div>
<div>
<div>27 bis avenue Tristan Derême</div>
<div>64400 Oloron Sainte Marie</div>
<div>France</div>
</div>
<div>Téléphone: +33-559-343-181</div>
<div><a href="http://www.immersivelab.fr/">http://www.immersivelab.fr</a></div>
</div>

Ajoutons maintenant un marquage microformats hcard :

David Castéra
Immersive Lab
27 bis avenue Tristan Derême
64400Oloron Sainte Marie
France
Téléphone: +33-559-343-181
http://www.immersivelab.fr

Visiblement aucune différence… mais si on observe le code source :

<div class="vcard">
<div class="fn">David Castéra</div>
<div class="org">Immersive Lab</div>
<div class="adr">
<div class="street-address">27 bis avenue Tristan Derême</div>
<div><span class="postal-code">64400</span><span class="locality">Oloron Sainte Marie</span></div>
<div class="country-name">France</div>
</div>
<div>Téléphone: <span class="tel">+33-559-343-181</span></div>
<div><a class="url" href="http://www.immersivelab.fr/">http://www.immersivelab.fr</a></div>
</div>

On a ainsi ajouté une classe vcard et des attributs fn ou org ainsi qu’un classe adr (adresse) avec ses attributs street-adress ou postal-code par exemple, le tout emballé dans vcard… Bref, vous l’avez compris, Hcard est un microformat pour publier les contacts et ainsi permettre leur ajout au caret d’adresse grâce à un logiciel d’extraction comme l’extension Firefox Operator.

Il existe d’autres microformats comme par exemple :

  • hAtom – pour marquer des fils web Atom (standard) provenant du HTML standard
  • hCalendar – pour les événements
  • hCard – pour l’information de contact ; comprend  adr – pour les adresses postales et geo – pour les coordonnées géographiques
  • hReview – pour les critiques
  • hResume – pour les résumés ou CVs
  • rel-directory – pour la création et l’inclusion de répertoire distribué
  • rel-nofollow, une tentative pour décourager du spam provenant de tiers (par ex. le spam sur les blogs).
  • XHTML Friends Network (XFN) – pour les relations sociales
  • XOXO – pour les listes et les plans
  • et bien d’autres à consulter ici.

Pour en savoir plus sur le microformats je vous invite à consulter le wiki consacré au sujet.

Mais revenons au sujet de cet article : l’annonce datant du 12 mai sur le blog webmasters de Google de l’introduction des Rich Snippets dans les pages de résultats du moteur. Les rich snippets permettant de compléter un résultat par des informations glanées par le moteur sur la page concernée : vote, avis (review), prix, adresse…

Afin de l’aider à enrichir ses pages de résultat Google conseille donc au webmaster, considérant que personne ne connait mieux son contenu que lui même, de l’aider à trouver ces informations en utilisant… les microformats.. nous y voila.

Visiblement l’intégration des données se fera progressivement, certains font remarquer que par exemple la reconnaissance des données hcard par Google est des plus incomplètes, mais il est bon de s’y préparer. En effet en matière de référencement il faut travailler le positionnement bien entendu, mais également l’affichage de la page dans les SERPS (titre, description) et donc les rich snippets devraient participer largement à la génération de trafic. reste maintenant à vérifier si une position 5 ou 6 enrichie d’un microformat permettra plus de visite que la même position, ou meilleure, sans rich snippets.

Peut être avez-vous expérimenté, n’hésitez pas à témoigner…

Pour terminer, il y a deux microformats sur ce blog, si si, j’offre une bouteille de Jurançon aux trois premiers lecteurs qui me les trouvent. L’exemple de ce billet ne comptant pas ;)

Comment lit-on une page web ?

Posté le 15 mai 2006 | Laissez un commentaire

L’illustration ci-contre illustre cet excellent post de Nick Wilson : "I’m talking about where we place our rss links.
On the right, you can see a map that was produced as part of the EyeTrack 3 study written up by Steve Outing last year. It shows you how people’s eyes move over a web page, particularly, a news page, which in our case, as bloggers, is pretty damn relevant.
So, if that’s how people view a page, and a subscription to our blogs feed is truly gold, why the hell do we insist on burying our feed links down at the bottom of the page? " Cette illustration décrit le parcours des yeux du visiteur (en particulier d’un nouveau visiteur) sur une page web. Chacun en tirera donc les conclusions qu’il souhaite afin de placer les éléments essentiels au bon endroit dans la page.
Un petit bémol toutefois, ceci est trés subjectif et dépend beaucoup du contenu des pages visitées.
Qu’en pensez-vous ? Est-ce une bonne méthode, sachant que l’essentiel est tout de même le contenu des posts ?