Enrichir les résultats SERP à l’aide de GTM

Google a une myriade de façons de rendre la page de résultats des moteurs de recherche (SERP) plus vivante. Lorsque vous saisissez une requête de recherche, la mission du moteur est de vous fournir les informations les plus pertinentes en un minimum de clics. Souvent, cela signifie que vous verrez la réponse à votre requête directement dans la SERP :

Voir aussi l’excellente description par le Dr Pete de la variation dans le SERP (notez que ce message date de 2013 et que tous les types de données ne sont pas pertinents aujourd’hui). Comme vous pouvez le voir, il existe de nombreuses façons pour un site d’annoter les données qu’il contient, et de les fournir ainsi à Google pour qu’il les utilise s’il le souhaite. Il n’y a aucune garantie que vos données structurées soient récupérées par le moteur de recherche, mais cela ne devrait pas vous empêcher de baliser votre contenu de toute façon.

Maintenant, place aux affaires. Google a récemment publié un outil de test de données structurées qui accepte JSON-LD comme entrée. JSON-LD est une émanation du format de données JavaScript Object Notation (JSON), principalement en ce sens que vous pouvez spécifier des nœuds de données liés entre différents objets de notation.

Les données structurées prises en charge par JSON-LD sont encore assez limitées, mais le nombre d’options augmentera sûrement dans un proche avenir. Actuellement, vous pouvez baliser le contenu de votre site pour :

• Toutes les fonctionnalités du Knowledge Graph

• Extraits enrichis d’événements

• Champs de recherche de liens annexes

(MISE À JOUR 3 février 2016) Prise en charge des avis et des produits ! Merci Claudia Kosny pour le tuyau.

La chose intéressante à propos de cette nouvelle version est la citation suivante des pages de support :

[JSON-LD] vous permet d’intégrer un bloc de données JSON dans une balise de script n’importe où dans le code HTML… De plus, Google peut lire les données JSON-LD même lorsqu’elles sont injectées dynamiquement dans le contenu de la page, par exemple par du code Javascript ou des “widgets” intégrés.

Relisez la dernière partie. Cela ne ressemble-t-il pas à une balise HTML personnalisée dans Google Tag Manager ? Vous pariez que oui !

Balisage des données structurées à l’aide de Google Tag Manager

Vous pouvez injecter dynamiquement des spécifications JSON-LD sur vos pages à l’aide de Google Tag Manager. La seule stipulation est que le code doit être exécuté pendant la chargement initial de la page. Cela signifie que vous ne pouvez pas enrichir dynamiquement les données structurées du site après le chargement de la fenêtre, c’est-à-dire après gtm.load a été poussé dans dataLayer. Ainsi, tant que vos balises de données structurées s’exécutent avec le Toutes les pages Trigger, par exemple, ça devrait aller.

Voici quelques exemples de balises HTML personnalisées pour les données structurées. Assurez-vous que les balises se déclenchent avec le Toutes les pages Déclencheur.

Annoter les profils sociaux pour Knowledge Graph

Si votre site est inclus dans le Knowledge Graph, il peut être judicieux d’ajouter vos profils sociaux directement dans le SERP, comme Marimekko l’a fait :

Voici ce que vous devez écrire dans la balise HTML personnalisée :

<script type="application/ld+json"> {    "@context" : "http://schema.org",   "@type" : "Person",   "url" : "https://www.simoahava.com/",   "name" : "Simo Ahava",   "sameAs" : [ "http://fi.linkedin.com/in/simoahava",       "http://plus.google.com/+SimoAhava",       "http://www.twitter.com/SimoAhava" ]  } </script>

Le code ci-dessus annoterait ma case Knowledge Graph (si jamais j’atteins de tels niveaux de célébrité) avec mes profils sociaux directement dans le SERP.

Activer le champ de recherche des liens annexes

Ceci, je pense, est l’un des ajouts les plus cool au SERP. Sur certains sites, vous pouvez voir un champ de recherche directement dans les liens annexes. Ce champ de recherche est lié au moteur de recherche interne du site, vous permettant de rechercher directement du contenu sur le site !

Pour que cela apparaisse, la syntaxe du code dans la balise HTML personnalisée doit ressembler à ceci :

<script type="application/ld+json"> {    "@context": "http://schema.org",    "@type": "WebSite",    "url": "https://www.simoahava.com/",    "potentialAction": {      "@type": "SearchAction",      "target": "https://www.simoahava.com/?s={search_term}",      "query-input": "required name=search_term" }  } </script>

Ici, je fournis l’URL et le paramètre de requête de recherche nécessaire qui font fonctionner le moteur de recherche de site interne sur mon site. Désormais, si quelqu’un saisit un terme de recherche directement dans les liens de site SERP, il sera transporté vers la page de résultats de recherche de mon site pour cette requête particulière.

À noter

N’oubliez pas que vous pouvez combiner vos différents types de données structurées dans une balise HTML personnalisée, et vous devez le faire pour réduire le nombre de balises dans votre conteneur. Les deux exemples ci-dessus seraient combinés en une seule poussée de données structurées comme ceci :

<script type="application/ld+json"> [{    "@context" : "http://schema.org",   "@type" : "Person",   "url" : "https://www.simoahava.com/",   "name" : "Simo Ahava",   "sameAs" : [ "http://fi.linkedin.com/in/simoahava",       "http://plus.google.com/+SimoAhava",       "http://www.twitter.com/SimoAhava" ]  }, {    "@context": "http://schema.org",    "@type": "WebSite",    "url": "https://www.simoahava.com/",    "potentialAction": {      "@type": "SearchAction",      "target": "https://www.simoahava.com/?s={search_term}",      "query-input": "required name=search_term" }  }] </script>

Ici, j’ai inclus les deux objets JSON et les ai insérés dans un seul tableau (voir les crochets qui entourent les deux objets), délimités par une virgule.

Une fois que vous avez créé votre tag et publié le conteneur, pensez à tester votre site avec l’outil de test des données structurées :

Une chose que j’ai remarquée avec l’outil est qu’il ne fonctionne pas toujours, surtout si le HTML du site est complexe. Cela ne signifie pas que les données structurées n’ont pas été validées, cela signifie simplement qu’il y a eu une erreur dans le processus.

N’oubliez pas que puisqu’il s’agit de GTM, vous pouvez utiliser vos variables pour rendre l’injecteur de données structurées plus dynamique. Aussi, si vous avez défini dataLayer dans votre modèle de page et qu’il contient des informations qui, selon vous, seraient utiles dans le balisage de données structurées, vous pouvez extraire ces données à l’aide de variables de couche de données dans votre balisage de données structurées. Cela signifie que vous pouvez créer un injecteur de données structurées vraiment flexible en exploitant les propres fonctionnalités de GTM.

Cette fonctionnalité des robots de recherche de Google est attendue depuis longtemps. Il est tellement logique de pouvoir injecter des annotations sur votre contenu avec JavaScript, au lieu de les appliquer directement au modèle de page par le CMS. De plus, le fait que vous puissiez injecter l’objet n’importe où, pas seulement dans le <head> du document, est un grand atout, puisque GTM, par défaut, injecte à la fin du <body>.