Nous allons voir ici ce que sont les données structurées, pourquoi les implémenter et comment les implémente sur Wordress.

Et pour ce faire j’utilise un nouveau format que vous m’avez demandé : le format tutoriel.

Je vais donc vous expliquer le mieux possible comment l’implémenter étape par étape. Cet article va être un peu plus qu’un simple tuto car les données structurées méritent d’être expliquées convenablement.

Avant de commencer, j’aimerais préciser que

1) je ne suis pas une experte SEO loin de là, mais j’ai pu testé alors je vous fais un retour d’expérience

2) c’est du « SEO technique », rien de sorcier mais il faut s’accrocher un peu, mais promis je vais être la plus pédagogue possible 😇

3) c’est un tuto spécial WordPress car je n’ai pu pour le moment testé que sur WordPress 

01. C’est quoi les données structurées ?

Les données structurées sont aussi appelées schema de balisage, ou schema markup pour les bilingues.

Ces balises permettent de données des informations supplémentaires aux moteurs de recherches sur vos contenus.

Cela va permettre d’enrichir les résultats dans sur la page de résultat (SERP).

Il existe plusieurs résultats en fonctions des données structurées renseignées :

Knowledge graph

Un résumé des informations sur une requête. Exemple de Nasa ci-dessous

Rich card

C’est le petit carrousel, souvent vu sur mobile, qui propose plusieurs réponses pertinentes, en l’occurrence plusieurs films en lien avec la Nasa.

Featured snippet

Pour l’exemple ci-dessous c’est un featured snippet « paragraphe » mais il existe aussi celui à liste à puces, liste numérotée à vidéo et encore d’autre.

Google répertorie sur cette page de documentation d’autres exemple.

Les grands moteurs de recherches à savoir Google, Yahoo, Yandex mais aussi Microsoft se sont accordés pour créer un format standard appelé Schema.org.

Ce format permet d’indiquer aux moteurs de recherches le sens de vos contenus en délivrant 3 types d’informations :

  • itemscope : permet de regrouper les différents éléments en une catégorie pour indiquer aux moteurs de recherches qu’ils font tous partie du même bloc d’informations
  • itemtype : permet d’informer quel type d’élément il est question (recette, événement, auteur,etc)
  • itemprop : permet de préciser les propriétés du type de l’élément, par exemple les ingrédients d’une recette, le temps de cuisson, etc

Information importante, le codage se fait en Json-LD.

Est-ce que je vous ai perdu ? 😳 Je vous avais prévenu, c’est un peu technique aujourd’hui. 

Pour que ce soit un peu plus clair je vais prendre un exemple. Schema.org vous fournit aussi un exemple au sujet d’Avatar. 

Une recette de crêpe va un avoir un itemscop qui sera un bloc. Pour renseigner aux moteurs de recherches ce qu’il y a l’intérieur de ce bloc on utilise itemtype en choisissant « recipe » (recette). Les moteurs de recherche sait donc qu’à l’intérieur du bloc on va parler de recette. Mais de quel recette, quels ingrédients, temps de préparation ou de cuisson ?

Pour renseigner cela on utilise des itemprop comme « cooktime » (temps de cuisson) ou encore « recipeingredient » (ingrédient). Vous pouvez consultez les propriétés des recettes  et vous constaterez que vous avez l’embarras du choix.

Ok super Elody, mais concrètement ça donne quoi ?!

Voici une recette de crêpe sans données structurées :

Voici maintenant une recette avec des données structurées :

Nous sommes d’accord que le deuxième est plus clair et donc donne plus envie de cliquer.

Et c’est quoi la différence entre les deux alors que ce sont deux résultats de Marmiton ? Les données structurées ! Dans le deuxième exemple on a renseigné une donnée structurée sur l’image, sur les avis ingrédients.

Mais c’est pas tout. Les données structurées permettent aussi de créer des épingles enrichies. Oui Pinterest et ses rich pins utilisent les données structurées.

Ca y est, je vois vos yeux de Pinterest-lover s’illuminer. Vous voyez que c’est cool les données structurées !

Bon résumons, les données structurées sont un balisage, un morceau de code, qui permet aux moteurs de recherches de mieux comprendre et mieux retranscrire votre contenu. Au lieu de voir un simple texte il peut comprendre son sens.

02. Pourquoi utiliser les données structurées ?

Si vous n’avez pas encore bien perçu l’intérêt des données structurées, je vais vous énumérer ses avantages.

La première est qu’elles vont améliorer votre SEO. Et oui !

Elles vont permettre à Google de comprendre quel est votre contenu et donc de l’afficher sur les résultats de recherches en fonction de la pertinence. Et si contrairement à vos concurrents qu’ils ne l’ont pas fait, votre contenu ressortira en prem’s. Car contenu enrichie = contenu méga pertinent = contenu en top position. 👍

En plus de ça, si votre contenu est enrichi il le sera aussi dans les résultats de recherches. Il sera donc visuellement plus important et attractif. L’utilisateur verra beaucoup plus votre contenu et sera beaucoup plus tenté de cliquer sur votre site. Et donc un taux de clic plus important va aussi booster votre SEO.

Enfin, l’image de votre entreprise sera clairement optimisée. Vous allez renvoyer une image d’une entreprise avec du contenu de qualité. Et très souvent la qualité impacte la confiance.

Bon, vous l’avez compris les données structurées sont effrayantes au premier abord mais au final elles sont super cools !

03. Comment implémenter les données structurées sur WordPress ?

On est parti pour la question que tout le monde attend !

Pour implémenter les données structurées il 3 méthodes :

  • à la mano, si vous maîtrisez suffisamment l’éditeur de WordPress ou que vous êtes dev, vous pouvez vous amusez à le faire à la mano, mais c’est tout de même long et pas recommandé du tout pour ceux qui ne maîtrisent pas le code, sauf si vous voulez casser votre site, dans ce cas allez-y. La doc de schema.org est conséquente pour y arriver.
  • avec Google, et oui notre cher ami Google s’efforce de donner le plus d’infos pour que les sites améliorent enrichissent (enfin) leurs résultats sur le moteur de recherche. Leur outil code pour vous, ensuite il faut l’intégrer. Je vais vous expliquer la théorie mais pas la pratique, parce que loin de moi l’envie de casser des sites.
  • un plugin qui fait le boulot pour vous, ça c’est ma méthode, si on a compris les types et propriété, c’est un jeu d’enfant !

Implémenter les données structurées avec l’outil de Google

 

01. Rendez vous sur l’outil d’aide au balisage de Google. 💻

Allez sur l’outil d’aide. 

Renseignez l’activité ainsi que l’url que vous allez baliser. Je vous conseille de faire au minima la page d’accueil. Ensuite, vous pouvez baliser vos pages produits, vos articles de blog, contact, etc.

Pour l’exemple je vais baliser un article de blog.

02. Maintenant vous allez baliser. 🤓

Pour cela, l’outil est quand même vachement intuitif. Il y a deux parties, à gauche votre site et les éléments à baliser et à droite le balisage. Il vous suffit de surligner un élément, un menu déroulant apparaît et vous sélectionnez de quoi il s’agit dans la partie de gauche. Puis à droite, en face de chaque balise vos éléments vont être renseignées.

03. Ensuite, vous générez un code. ⚡

Vous allez cliquer en haut à droite dans « Créer le HTML ». Cela va vous donner un gros bloc de code. Pas de panique, c’est normal. Assurez-vous que vous avez sélectionné le code Json-Ld et téléchargez.

04. C’est l’heure d’intégrer votre code ! 👩‍💻

C’est là où les choses peuvent se gâter. Il va falloir insérer le bout de code téléchargé dans le corps de la page en question.

Sur WordPress, c’est un peu compliqué car il est difficile d’avoir accès au code d’une page entier car le header est dans un autre fichier.

Ceux qui maîtrisent allez-y ! Ceux qui, comme moi, préfèrent être sages et ne rien casser, le deuxième tutos est fait pour vous (Oui 2 tutos dans 1 article, c’est fou !) !

05. Vérifiez votre balisage, et c’est fini ! ✅

Vous avez intégrez vos données structurées. Pour être sûr que tout roule, Google a encore pensé à nous et nous met à disposition un outil pour tester l’intégration.

Il vous suffit de coller l’URL en question. Et de voir s’il y a des erreurs, de trouver le problème (l’outil vous le dit explicitement) et de le résoudre. Et voilà !

Deuxième tutos : implémenter données structurées avec des plugins

Bon vous l’avez compris, je vous ai préparé une deuxième méthode pas à pas pour implémenter vos données structurées, et c’est archi simple !

J’ai testé pas mal de plugins et j’en retenu 2.

Le premier est Markup (JSON-LD) structured in schema.org

Il est assez simple et convient parfaitement à ceux qui veulent renseigner les infos de bases sans y retoucher. C’est parfait pour un site vitrine par exemple.

Il vous suffit de choisir que type d’éléments vous souhaitez activer.

Ensuite, vous cliquez et vous renseignez chaque champ que vous souhaitez voir apparaître. Et voilà !

Mais, je souhaitais un plugin où l’on puisse renseigner les infos globales du site mais aussi les renseigner à la mano pour chaque produit ou article de blog.

Et ce plugin s’appelle Schema & Structured Data for Wp.

Allez je vous montre comment on l’utilise !

01. Installation les données structurées

Evidement vous installer et activer le plugin.

Ensuite, vous allez d’abord dans la partie settings et nous allons renseigner les infos globales du site.

Pensez à touuuuuus les champs, comme le Knowledge grapf ou le Default data.

 

Ensuite, allez dans « Schema type ». On va créer les types de schéma selon les pages.

01. Créer un type de schéma

Cliquez sur « add schema type » en haut.

Une page va s’ouvrir. Pour l’exemple on va créer le type schema « produit » pour toutes les pages produit.

On choisit « product » et « next ».

Ici vous sélectionné « product » pour le post type. Cela signifie que le type de schema sera déclenché sur toutes les pages produit.

Ce type de schéma vous permettra de renseigner des propriétés pertinents pour des produits comme le prix, le nom, les avis, etc.

Ensuite, il vous suffira d’aller dans vos produit, et tout en bas vous pourrez remplir les propriétés.

Et voilà, vous pouvez mettre des données structurées sur votre site et booster votre SEO ! 💪

Le gros bémol que je trouve à ce plugin (il en fallait bien un) c’est que je n’ai pas trouvé comme faire en même temps des données structurées product et post. En clair, même dans les articles de blog en bas je retrouve les propriétés d’un produit. Je pense que c’est dû au fait que c’est l’option freemium.

Pour pallier à ça j’ai installé le plugin Schema app structured data qui semble ne fonctionner que pour les types blogpost.

 

Merci d’avoir lu jusqu’ici pour ce très long article de blog. Si vous avez aimé ou non ce nouveau format « Tuto » n’hésitez pas à me le dire en commentaire ou sur les réseaux sociaux. 🙂 

Et vous, prêt à passer aux données structurées ?

Rejoignez la Team E/A

Recevez tous les lundis vote dose de bonne humeur et d’astuces

2 comments

  • charlotte
    31/07/2019

    hello Elody,

    Merci beaucoup pour ce tuto, c’est top. J’ai voulu donc faire ta troisième solution via le plugin Schema & Structured Data for Wp.
    Mais, je suis vraiment pas douée, mais je n’arrive pas à l’activer je ne comprend pas comment l’installer…. je suis sur Mac je ne sais pas si cela change. j’ai téléchargé le fichier zip, mais après j’ai fouillé un peu partout dans le dossier et après c’est du chinois 😅..
    Merci pour ta réponse.
    Charlotte

    reply

Laisser un commentaire