Rich snippet

Les snippets sont de petits textes extraits d’un site web et affichés dans les pages des résultats de recherche. Ils se composent normalement d’un titre, d’une description et d’une URL. Ils fournissent un aperçu du résultat de recherche et visent à inciter le lecteur à cliquer sur le lien.

Les snippets enrichis sont une forme plus avancée des snippets et peuvent contenir d’autres éléments comme des étoiles de notation, des liens, des images, des prix ou encore d’autres formes d’informations. Ils fournissent à l’utilisateur des informations supplémentaires. Les informations peuvent être formatées d’une certaine façon au sein du code source et affichées de manière proéminente dans les résultats de recherche. Cela est censé aider les visiteurs à décider rapidement sur quel résultat cliquer et si les résultats proposés sont pertinents pour sa recherche. Les snippets enrichis peuvent être utilisés afin d’augmenter le taux de clics.

600x400-RichSnippets-fr-01.png

Procédure

Il existe trois façons d’intégrer des snippets enrichis dans le code source. Des connaissances sur le format HTML sont requises.

Définir le langage de balisage

Les langages balisés qui sont prioritairement acceptés par Google sont les microformats, les microdonnées et les RDFa.

Étiquetage du contenu

Google soutient différentes formes d’informations. Il intègre des snippets enrichis lorsque les indications suivantes sont données :

  • Critique
  • Personnalités, auteurs
  • Entreprises et organisations
  • Recettes
  • Produits
  • Evénements
  • Musique
  • Prix
  • Vidéos
  • Informations relatives au droit d’auteur

Schema.org propose une collection de tags HTML et de balisages qui peuvent être employés dans l’utilisation de snippets enrichis. Les webmasters peuvent simplement piocher dans cette liste et utiliser les balisages de Schema.org correspondant. Les moteurs de recherche lisent les données structurées et incluent les snippets enrichis correspondant dans les résultats de recherche. Les moteurs de recherche accordent une grande valeur à ces données structurées, car elles permettent un accès plus simple aux informations. La mise en valeur des données est une fonction rendue disponible par le Google Search Console. Elle peut être utilisée pour marquer certaines informations pertinentes du site web, même sans utiliser ce langage de balisage et sans toucher au code source.

Modes de mises en œuvre de snippets enrichis

Il existe différentes manières de mettre en œuvre des snippets enrichis, en fonction de l’objectif et de la norme utilisée.

Microdonnées

Les microdonnées permettent la déclaration de types d’informations utilisant le format HTML5 et attribuent des propriétés. Il est donc possible de déclarer des critiques, des personnes, des produits, des entreprises, des recettes, des événements, des organisations, des vidéos, etc., en utilisant un vocabulaire spécial. Une personne créée par une microdonnée pourrait ressembler à cela :


<div itemscope itemtype=“http://data-vocabulary.org/Person”>
My name is <span itemprop=“name”>John Doe</span>
  
and I am a <span itemprop=“title”>programmer</span> at <span itemprop=“affiliation”>Example Co., Ltd.</span>.
 
More information about me can be found at:
<a href=“http://www.example.com” itemprop=“url”>www.example.com</a>.
 
I come from
<span itemprop=“address” itemscope
itemtype=“http://data-vocabulary.org/Address”>
<span itemprop=“locality”>Cologne</span> in
<span itemprop=“region”>North Rhine-Westphalia.</span>
</span>
</div>


L’utilisation d’itemscope au cœur du tag indique qu’un élément suit. Le type d’élément est spécifié en tant que « personne » en utilisant le itemtype= e=“http://data-vocabulary.org/Person”. L’objet est ensuite complété par des propriétés en ajoutant itemprop= “ ”. À l’intérieur des guillemets se trouvent différentes propriétés telles que le nom, le titre, l’affiliation, l’URL ou l’adresse. La propriété de l’adresse est un cas spécial et peut être divisée en sous-propriétées, comme le département et la région.

Microformats

Les microformats sont aussi utilisés dans le tag HTML et aident à la mise en place de snippets enrichis. On peut décrire les entités et autres propriétés au travers d’un attribut de classe au sein du tag. Afin de créer le concept d’une personne, le microformat hCard est utilisé et est enregistré dans le code source en utilisant class= “vcard”. L’exemple ci-dessous illustre ce à quoi un microformat pourrait ressembler.


<div class=“vcard”>
 My name is <strong class=“fn”>John Doe</strong>
 
and I am a <span class=“title”>programmer</span> at <span class=“org”>Example Co., Ltd.</span>.
 
More information about me can be found at:
 <a href=http://www.example.com class=“url”>www.example.com</a>.
 
 I come from
 <span class=“adr”>
 
 <span class=“locality”>Cologne</span> in
 <span class= “region”> North Rhine-Westphalia.</span>
 </span>
</div>

Dans ce cas-là également, la personne est définie sur la base de différentes propriétés. L’adresse peut aussi être spécifiquement séparée en sous-catégories. La définition des différentes propriétés est faite en utilisant la série class=“ ”. Ce n’est pas une coïncidence si la plupart des propriétés ont le même nom que celles mentionnées dans l’exemple des microdonnées ci-dessus. Les propriétés utilisées pour la microdonnée se basent sur le microformat hCard.

RDFa

Le RDFa rend aussi possible l’intégration d’éléments avec leurs propriétés respectives. De ce fait, les critiques, les personnes ou les recettes sont directement disponibles pour les snippets enrichis. Cependant, au contraire de la microdonnée et du microformat, le RDFa emploie des tags XHTML afin de définir ces propriétés. L’exemple suivant, qui présente une utilisation du format RDFa, reprend les caractéristiques précédentes :


<div xmlns:v=“http://rdf.data-vocabulary.org/#” typeof=“v:Person”>
 My name is <span property=“v:name”>John Doe</span>
 	
 and I am a <span property=“v:title”>programmer</span>
 
 at <span property=“v:affiliation”>Example Co., Ltd.</span>.
 
 More information about me can be found at:
 <a href=“http://www.example.com” rel=“v:url”>www.example.com</a>.
 
 I come from
 <span rel=“v:address”>
 <span typeof=“v:Address”>
 <span property=“v:locality”>Cologne</span> in
 
 <span property=“v:region”> North Rhine-Westphalia</span>.
 
 </span>
 </span>
 
</div>

La déclaration d’espace nom, couplée aux xmlns, montre quel vocabulaire est utilisé dans la définition des éléments et leurs propriétés. L’usage du typeof=“v :Person ” définit le type d’élément, dans ce cas une personne. Pour ajouter une propriété, on utilise la série property=“v :Property ”. « Property » doit bien sûr être substituée par le terme correspondant. Pour préciser une URL, on utilise à la place le rel-tag. Exactement comme avec les microdonnées et les microformats, l’adresse peut aussi être sous-divisée et on peut lui attribuer plusieurs sous-propriétés.

Différences entre la microdonnée, le microformat et le RDFa

Pendant un certain temps, la microdonnée était le seul standard soutenu par Schema.org. Elle est donc reconnue par la majorité des moteurs de recherche et peut être mise en œuvre sans aucune difficulté. Cependant, un des avantages du RDFa consiste en son extension très facile en comparaison avec les standards limités des deux autres modèles. D’un autre côté, les microformats sont plutôt facile d’utilisation et peuvent en conséquence être relativement rapidement mis en œuvre.

Phase de test

Après que chaque microdonnée ait été ajoutée dans le code source, elle peut être testée pour la donnée structurée en utilisant le rich Snippets Tools. Si des snippets enrichis sont affichés sur cet outil de test, on peut présumer qu’ils seront aussi prochainement visibles dans les résultats de recherche. Cependant, l’expérience a montré que cela peut prendre quelques semaines.

Importance pour le SEO

La structure des snippets joue un grand rôle dans l’attitude du visiteur et dans l’évolution du taux de clics. Le taux de clics des résultats de recherche est un facteur important dans l’évaluation et le classement d’un site web. Les snippets enrichis sont utilisés pour mettre en valeur des résultats de recherche individuels, car les éléments visibles comme les vidéos, les images et les étoiles de notation peuvent être intégrés. L’usage de snippets enrichis est particulièrement saisissant et attire le regard au sein des résultats normaux. Ils peuvent donc provoquer une augmentation du taux de clics.

Catégorie

Besoin d’aide?
Donner son avis