Le microformat hReview en pratique

En avril 2007, je survolais avec vous les différentes types de microformats. Sans entrer dans les détails, j’introduisais l’utilité présumée des microformats les plus répandus.

Malgré tout le bien qu’on en dit, il est difficile de calculer l’impact réel des microformats sur le référencement dans les moteurs de recherche. Avec la motivation de mettre toutes les chances de notre côté pour être bien référencé, on se dit qu’il est préférable de les utiliser que de ne pas le faire mais on ne va souvent pas beaucoup plus loin. Tout cela reste en général très théorique.

Aujourd’hui, j’ai donc décidé de vous présenter une application purement pratique du microformat hReview, utilisé sur WooRank, un outil d’analyse de sites Web dont je suis le co-fondateur.

Si vous avez déjà analysé votre site Web avec WooRank et que, par après, vous avez tapé votre nom de domaine dans Google, vous êtes peut-être tombé sur quelque chose de ce genre :

Il s’agit d’un résultat de recherche Google tout ce qu’il y a de plus classique à l’exception des étoiles accompagnées du « Review by WooRank » juste en dessous du titre.

C’est le fait que plusieurs personnes m’aient demandé comment nous avions fait pour obtenir cela qui m’a donné l’idée de rédiger ce billet.

De quoi s’agit-il ? Tout simplement de l’interprétation que Google fait du microformat hReview, implémenté par nos soins dans chaque rapport WooRank. L’implémentation du microformat est placée dans le badge avec le ranking sur 100.

Voici la partie du code source qui nous intéresse :

http://pastie.org/2120865.js

Le microformat est défini via quelques attributs class qu’on trouve appliqué à plusieurs balises.

D’une part, nous définissons sur quoi porte la cote (.item – ligne 4) et d’autre part, nous assignons la cote proprement dite (.rating – ligne 18).

A l’intérieur de .item, nous définissons le nom de ce qui est coté (.fn – ligne 7) ainsi que celui qui cote (.reviewer – ligne 11) au format hCard.

A l’intérieur de .rating, nous spécifions la valeur (.value – ligne 19) ainsi que la valeur maximum possible (.best – ligne 25). Ces deux attributs n’auraient pas été nécessaires si nous avions établi la cote sur 5 car il s’agit de la valeur maximum par défaut.

Par exemple :

<div class="rating"><span class="value">3</span> out of <span class="best">5</span></div>

est équivalent à :

<div class="rating">3</div>

Pour terminer, le tout doit être englobé dans une balise .hreview (ligne 1).

Et c’est tout. L’ajout de quelques attributs class nous a permis d’ajouter un peu de sémantique supplémentaire à nos rapports.

Je vous invite à aller lire la spécification du format pour connaître les autres attributs existants. Je n’en ai finalement utilisé que très peu dans cet exemple, mais il faut savoir qu’ils sont quasiment tous facultatifs et que Google ne les prend pas tous en considération.

Je rajoute que hReview est toujours en draft, ce qui veut dire que des changements pourraient encore survenir dans la spécification, même si c’est fortement improbable que cela ait un impact négatif sur les implémentations existantes.

Toujours est-il que quelques semaines après avoir mis cela en place, nous avons découvert que Google avait détecté le microformat et commençait à afficher le rating dans ses résultats de recherche. Une très bonne chose car le résultat est beaucoup plus visible et revêt un aspect officiel non négligeable.

Je vous conseille vivement de considérer hReview au cas où vous possédez un blog où il vous arrive de tester des produits, cela pourrait être bénéfique pour votre référencement.

Il y a encore beaucoup de choses à dire sur le sujet mais je vais le conclure ici pour aujourd’hui. La discussion continue bien entendu dans les commentaires.