Vous êtes visible dans Google, génial ! Mais pourquoi les internautes cliqueraient sur votre site plutôt qu’un autre ? Un moyen de se démarquer est celui-ci : les Microdonnées (ou données structurées)
Vous êtes moins cher que vos concurrents, beaucoup de clients ont témoigné positivement après achat, votre produit a un réel avantage concurrentiel… autant d’arguments que vous devriez mettre en avant dès la page de résultats de recherche.
Cette optimisation SEO vous permettra d’augmenter votre taux de clics (CTR) visible dans la Search Console.
Qu’est-ce qu’un extrait enrichi ?
Mise en place depuis 2009, les Microdonnées c’est un balisage conçu avec le vocabulaire schema.org qui aide les moteurs à mieux comprendre le contenu d’un site. Le rendu visuel dans les résultats de recherche est enrichi d’informations supplémentaires. C’est ce qu’on appelle un extrait enrichi (Rich Snippets)
L’objectif est d’aider un internaute faisant une recherche à discerner rapidement le contenu qu’il va découvrir et à décider s’ils souhaitent cliquer ou non.
Ainsi, si vous effectuez une recherche sur Google, un résultat normal peut ressembler à ceci :
Mais avec un Rich Snippet, il pourrait ressembler à ceci :
Donc avec un extrait enrichi :
- On prend beaucoup plus de place dans les résultats
- On gagne en pertinence
- On attire l’oeil
- On se différencie
- On obtient plus de clics !
« L’équipe de Kalys m’a récemment aidé a ajouté des données structurées à mon site web, et je dois dire que cela a vraiment fait une différence. Avant, mes pages n’étaient pas mises en valeur dans les résultats de recherche, mais depuis que l’on a ajouté les balises appropriées, j’ai remarqué une augmentation significative du trafic organique. Mes pages sont maintenant affichées avec des extraits enrichis, des étoiles de notation et d’autres informations utiles. »
Joris – Outillage de Pro
Types de Microdonnées pour l’e-commerce
Il en existe de nombreuses, mais toutes ne sont pas forcément adaptées à votre boutique. Certaines peuvent être spécifiques par exemple la microdonnée « Recipe » est utilisable sur une page de recette de cuisine uniquement.
Vous trouverez ci-dessous quelques exemples de types de données que vous pourriez utiliser pour votre boutique :
Reviews : Une note sous forme d’étoiles sur 5 pour l’ensemble des avis ou pour un avis individuel. Parfait pour afficher les avis généraux sur chacun de vos produits.
Product Offer : Informations sur votre produit, y compris le prix, les images du produit et le niveau de stock.
FAQ : Répondez aux questions les plus courantes sur ce sujet et faites apparaître les réponses dans les résultats de recherche. Ne fonctionne plus pour l’instant.
Organisation : Expliquez les principaux détails de votre entreprise, y compris le nom, l’adresse, le logo et les coordonnées.
Le vocabulaire Schéma.org
Format des données structurées
Le vocabulaire Schema.org peut être utilisé avec de nombreux encodages différents.
Mais il existe trois principaux formats de données structurées :
- Microdata
- JSON-LD
- RDFa
Ce sont des manières différentes d’encoder les données structurées sur votre page. JSON-LD est le plus largement utilisé et il est possible que votre thème ou certaines applications l’utilisent déjà.
Le format JSON-LD est également recommandé et soutenu par Google. Plus simple à mettre en place, c’est un simple morceau de code à ajouter n’importe où sur votre page indépendamment de votre contenu.
Nous verrons comment mettre en place les données structurées JSON-LD dans la section « Comment ajouter des données structurées à Shopify ».
Types de données
Le type de données est ce que les données structurées décrivent.
Pour le commerce électronique, vous utiliserez généralement :
- Product : pour décrire chaque produit
- Offer : pour décrire le prix et les options de votre produit
- AggregateRating : pour résumer l’évaluation globale de chaque produit et les commentaires.
- Article : pour décrire les articles de votre blog
- Organization : pour décrire les détails de votre entreprise
- WebSite : pour décrire comment effectuer une recherche sur votre site web
- BreadcrumbList : pour décrire vos fils d’Ariane
- FAQPage : pour décrire les questions fréquemment posées (et les réponses) utilisées sur vos pages
Recommandations pour les boutiques Shopify
Bien que chaque boutique de commerce électronique soit différente, il existe généralement quelques types de pages et de données structurées que je recommande d’utiliser.
En page d’accueil
WebSite : La recherche est importante pour les magasins de commerce électronique, ce balisage décrira aux moteurs de recherche comment procéder.
Organization : Il s’agit d’un endroit standard pour expliquer les détails de votre entreprise.
Nous vous recommandons d’utiliser le sous-type schema.org de « Organization » le plus spécifique qui correspond à votre organisation. Dans votre cas puisque vous avez un site e-commerce, le plus correct à utiliser est OnlineStore.
Les données « Organization » qui se trouvent présentes sur l’ensemble des pages d’un site est une erreur. Comme le précise Google, ces données ne doivent être utilisées que sur la page d’accueil ou la page à propos d’un site Web :
En pages collections
BreadcrumbList : Sur les collections, votre fil d’Ariane doit renvoyer à votre page d’accueil et éventuellement à une collection mère. Veillez à ce que ce fil d’Ariane soit balisé avec un schéma pour que les moteurs de recherche puissent le comprendre.
AggregateRating : Il est également possible avec un peu d’astuces, d’afficher les étoiles dans les SERP pour les pages collections.
En pages produits
BreadcrumbList : Sur les produits, votre fil d’Ariane doit renvoyer à la page d’accueil ainsi qu’à toutes les collections et sous-collections.
Product : Décrivez les détails du produit pour les moteurs de recherche.
ProductGroup + variant : Si vous avez des variantes.
Offer : Décrit les options de prix et le stock du produit.
AggregateRating : Résume l’évaluation globale et les avis sur ce produit.
En pages articles de blog
BreadcrumbList : Sur les posts, votre fil d’Ariane doit renvoyer à la page d’accueil et à la page principale du blog.
Article : Décrivez le titre, l’auteur et le contenu de l’article.
Vérifier les données structurées existantes
Il est fort probable que votre thème et/ou vos applications Shopify ajoutent déjà des données structurées à vos pages, c’est pourquoi je vous recommande vivement de les tester en premier lieu.
Vous pouvez le faire sur une page individuelle ou sur l’ensemble du site en utilisant Google Search Console, je recommande les deux.
Google Search Console
Si votre site utilise des données structurées et qu’il est configuré avec Google Search Console depuis un certain temps, vous devriez voir ces deux sections « Améliorations » et « Achats » dans la barre latérale de GSC :
Cliquez sur l’une d’entre elles, par exemple « Achats » puis dans « Fils d’Ariane », et vous arriverez à une page comme celle-ci :
Espérons qu’il n’y ait pas d’Erreurs, sinon vous devrez vous plonger dans la section Détails pour voir de quoi il s’agit et à quelles pages elles s’appliquent.
Pour les sites web de plus de 100 pages, vous trouverez probablement des pages « Valide avec avertissement ». Ce n’est pas grave, les avertissements sont normaux, mais cela vaut la peine d’être vérifié.
Et bien sûr, si les éléments sont en verts « valides » c’est une confirmation que vous utilisez le schéma et qu’il est correctement configuré.
Ce que vous recherchez au final, ce sont les données structurées que vous avez manquées comme par exemple : Extraits d’avis, Fils d’Ariane ou Sitelinks… Si tous ces éléments sont utilisés, recherchez ensuite les erreurs ou les avertissements.
Pages individuelles
Les pages individuelles peuvent être vérifiées à l’aide de l’outil de test des résultats enrichis de Google.
Il vous suffit de saisir votre URL (ou votre code), puis de cliquer sur Tester l’URL :
Vous accéderez ensuite à une page comme celle-ci :
Dans ce cas, nous pouvons voir que la page utilise des données structurées et qu’elle est éligible aux résultats enrichis.
En y regardant de plus près, nous pouvons voir qu’ils utilisent le schéma Produits et le schéma Offre dans cette page :
Pour X, il y a en fait X produits sur cette page.
Pourquoi ? Ils marquent chaque couleur et chaque variante de produit sur cette page comme des produits distincts. Pas de problème.
Comment ajouter des données structurées à Shopify ?
Vous n’avez pas besoin d’une application pour ajouter des données structurées à Shopify, surtout si vous utilisez le format JSON-LD. Il suffit de coller du code dans la page directement ou dans les fichiers du thème.
Voici comment procéder :
Ajouter à la description de page
Il est possible d’ajouter le script JSON-LD directement dans la description d’une page. Depuis l’éditeur HTML, collez directement dans vos types de page Collection ou autres, en passant en mode HTML/Code :
Puis en collant le code Schema.org en haut ou en bas (peu importe lequel) :
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [{
"@type": "Question",
"name": "Cet article est-il utile ?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Je l'espère, mais n'hésitez pas à nous contacter pour nous en faire part !"
}
},{
"@type": "Question",
"name": "Devriez-vous faire appel à nous pour obtenir de l'aide en matière de référencement et de rich snippets ?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Probablement. Vous pouvez essayer vous-même, mais soyez prudent. Le référencement ne se résume pas aux rich snippets, c'est pourquoi il serait bon d'obtenir des recommandations de la part de personnes expérimentées."
}
}]
}
</script>
Ajouter au thème
Pour tout le reste, vous devrez l’ajouter à votre thème, bien qu’il soit probable qu’une version de base soit déjà présente par défaut.
Vous pouvez les modifier en allant dans Boutique en ligne > Thèmes > Actions > Modifier le code :
Voici un exemple de l’endroit où l’ajouter, donné par l’un de nos clients (chaque thème est légèrement différent) :
Par soucis de lisibilité et d’organisation on va préférer créer un extrait (snippet) pour chaque intégration de données structurées dans les sections.
Type « product » : La section product-template.liquid
comprend un extrait product-schema.liquid
qui contient le code de données structurées.
{% comment %}
Données structurées Json type "Product" intégrées dans product-template.liquid > {% render 'product-schema' %}
{% endcomment %}
<script type="application/ld+json">
{
"@context": "http://schema.org/",
"@type": "Product",
"name": "{{ product.title | strip_html | escape }}",
"url": "{{ shop.url }}{{ product.url }}",
"sku": "{{fa_product_id_value}}",
{%- if product.variants.first.barcode.size == 12 -%}
"gtin12": {{ product.variants.first.barcode }},
{%- endif -%}
{%- if product.variants.first.barcode.size == 13 -%}
"gtin13": {{ product.variants.first.barcode }},
{%- endif -%}
{%- if product.variants.first.barcode.size == 14 -%}
"gtin14": {{ product.variants.first.barcode }},
{%- endif -%}
"productID": "{{ product.id }}",
"brand": {
"@type": "Thing",
"name": "{{ product.vendor | escape }}"
},
"description": {{ product.description | strip_html | json }},
"image": "https:{{ product.featured_image.src | img_url: 'grande' }}",
{%- if product.variants -%}
{%- assign fa_count = fa_count | plus: 1 -%}
"offers":
{
"@type" : "Offer",
"priceCurrency": "{{ cart.currency.iso_code }}",
"price": "{{ fa_product_price }}",
"itemCondition" : "http://schema.org/NewCondition",
"availability" : "http://schema.org/{% if fa_current_variant.available %}InStock{% else %}OutOfStock{% endif %}",
"url" : "{{ shop.url }}{{ fa_current_variant.url }}",
{%- if fa_current_variant.image -%}
{%- assign variant_image_size = fa_current_variant.image.width | append: 'x' -%}
"image": "https:{{ fa_current_variant.image.src | img_url: variant_image_size }}",
{%- else -%}
"image": "https:{{ product.featured_image.src | img_url: 'grande' }}",
{%- endif -%}
{%- if fa_current_variant.title != 'Default Title' -%}
"name" : "{{ product.title | strip_html | escape }} - {{ fa_current_variant.title | escape }}",
{%- else -%}
"name" : "{{ product.title | strip_html | escape }}",
{%- endif -%}
{%- if fa_current_variant.barcode.size == 12 -%}
"gtin12": {{ fa_current_variant.barcode }},
{%- endif -%}
{%- if fa_current_variant.barcode.size == 13 -%}
"gtin13": {{ fa_current_variant.barcode }},
{%- endif -%}
{%- if fa_current_variant.barcode.size == 14 -%}
"gtin14": {{ fa_current_variant.barcode }},
{%- endif -%}
"sku": "{{fa_product_id_value}}",
{%- if product.description != blank -%}
"description" : {{ product.description | strip_html | json }},
{%- endif -%}
"priceValidUntil": "{{ 'now' | date: '%s' | plus: 31536000 | date: '%Y-%m-%d' | uri_encode | replace:'+','%20' }}"
}
{%- if product.variants.size > 1 -%},
"additionalProperty": [{
"@type": "PropertyValue",
"propertyID": "item_group_id",
"value": "{{ product.id }}"
}]
{%- endif -%}
{%- if product.metafields.spr.reviews -%}
{%- assign fa_rating = product.metafields.spr.reviews | split: '"reviewCount": "' | last | split: '"' | first | plus: 0 -%}
{%- if fa_rating > 0 -%}
,"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": {{ product.metafields.spr.reviews | split: '"ratingValue": "' | last | split: '"' | first | plus: 0 }},
"ratingCount": {{ product.metafields.spr.reviews | split: '"reviewCount": "' | last | split: '"' | first | plus: 0 }}
}
{%- endif -%}
{%- endif -%}
{%- endif -%}
}
</script>
Type « Breadcrumb » : Peut être ajouté ou personnalisé directement dans breadcrumbs.liquid
sous theme > snippets.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"item": {
"@id": "{{ shop.url }}",
"name": "{{ 'general.breadcrumbs.home' | t }}"
}
},
{% if product.metafields.global.breadcrumb != blank %}
{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "{{ collections[product.metafields.global.breadcrumb].url }}",
"name": "{{ collections[product.metafields.global.breadcrumb].title }}"
}
},{
"@type": "ListItem",
"position": 3,
"item": {
"@id": "{{ product.url }}",
"name": "{{ product.title }}"
}
}
{% elsif %}
{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "{{ product.url }}",
"name": "{{ product.title }}"
}
}]
{% endif %}
}
</script>
(Remarque : le code ci-dessus suppose que vous utilisez un champ méta personnalisé pour les fils d’Ariane, comme expliqué dans notre guide sur les structures d’URL).
Type « organization » : Nous avons créé un nouveau extrait organization-schema.liquid
qui contient le code des données structurées, puis nous l’avons inclus dans le modèle theme.liquid
.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "{{ shop.name }}",
"url": "{{ shop.secure_url }}/",
"logo": "https://mettre-url-du-logo",
"sameAs": [
"https://lien-du-profil-social-facebook",
"https://lien-du-profil-social-twitter",
"https://lien-du-profil-social-insta"
]
}
</script>
Type « website » : Pareillement, nous avons créé un extrait website-schema.liquid
pour l’intégrer après la balise <head>
dans le theme.liquid
.
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "WebSite",
"name": "{{ shop.name }}",
"url": "{{ shop.secure_url }}",
"potentialAction": {
"@type": "SearchAction",
"target": "{{ shop.secure_url }}/search?type=product&q={search_term_string}",
"query-input": "required name=search_term_string"
}
}
</script>
Type « article » : La section
comprend un extrait article
-template.liquidarticle-schema.liquid
qui contient le code de données structurées.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BlogPosting",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "{{ article.url }}"
},
"headline": "{{ article.title }}",
"description": "{{ article.excerpt }}",
"image": "{{ article.image.src }}",
"author": {
"@type": "Person",
"name": "{{ article.author }}"
},
"publisher": {
"@type": "Organization",
"name": "{{ shop.name }}",
"logo": {
"@type": "ImageObject",
"url": "https://enter-logo-url"
}
},
"datePublished": "{{ article.published_at | date: '%Y-%m-%d' }}",
"dateModified": "{{ article.updated_at | date: '%Y-%m-%d' }}",
}
</script>
Questions fréquemment posées
J’ai mis en place des données structurées, alors pourquoi n’ai-je pas d’extraits enrichis ?
Cela peut arriver pour l’une ou l’autre des raisons suivantes :
- Le moteur de recherche n’a pas encore exploré votre page mise à jour.
- Ils ne pensent pas qu’elle soit pertinente.
- Vous êtes dans un créneau concurrentiel où ils ne les affichent pas souvent.
- Ce n’est pas le bon type de page/données structurées pour ce mot-clé.
- Votre site web ne jouit pas d’une confiance/autorité suffisante.
Dois-je m’inquiéter des avertissements de la GSC ?
Il n’y a pas lieu de s’inquiéter des avertissements, qui ne sont généralement que des recommandations. En particulier, s’il s’agit d’avertissements concernant l’absence d’avis/de notes sur des produits, c’est généralement parce qu’il n’y a pas encore d’avis sur le produit en question. Les erreurs, en revanche, doivent absolument être corrigées.
Pourquoi y a-t-il des balises de données de structure multiples ou en double sur ma page ?
Il y a parfois un conflit entre le thème et les applications, ce qui fait que les données structurées sont ajoutées plusieurs fois. Je recommande de demander à un développeur de regarder le code pour voir s’il peut identifier d’où cela vient, puis de supprimer l’une d’entre elles.
Ai-je besoin d’une application pour cela ?
Absolument pas. En fait, je vous le déconseille. La plupart de ces applications essaient de vous vendre quelque chose que votre thème fait probablement par défaut. Les extras qu’elles proposent peuvent être réalisés facilement avec un outil gratuit de génération de données structurées JSON-LD – très facilement.
Résumé
Je vous recommande vivement d’utiliser les données structurées sur votre boutique Shopify, pour récapituler, voici ce que vous devez faire maintenant :
- Vérifier dans Google Search Console si votre configuration actuelle présente des problèmes (et corrigez-les).
- Vérifier manuellement quelques types de page avec l’outil de test de Google ou celui de Schéma.org.
- Ajuster ou corriger votre configuration de données structurées pour les produits, les collections, la page d’accueil et les articles de blog (comme expliqué ci-dessus).
- Ajouter manuellement des données structurées aux descriptions si besoin.
- Tester à nouveau ces données après les avoir ajoutées, puis vérifier périodiquement si des problèmes se posent sur le SGC.
Avec un peu de chance, vous obtiendrez quelques Rich Snippets, sinon, continuez votre référencement et ils viendront probablement. Cela dépend en grande partie du mot-clé spécifique, de la niche globale et de la confiance/autorité de votre site web.
Quoi qu’il en soit, cela vaut la peine de faire un petit effort pour le mettre en place correctement.