Schema.org et métadonnées dans Drupal

Les métadonnées Schema.org sont l'un des sujets de l'optimisation SEO les plus importants. Ce sont les extensions des documents HTML qui permettent aux robots des moteurs de recherche de mieux comprendre le sens des sous-pages individuelles de votre site web. La gestion des métadonnées des visiteurs dans Drupal existe déjà depuis la version 7. Dans cet article, je vais vous présenter différentes méthodes pour les implémenter.

À quoi servent les métadonnées ?

Les moteurs de recherche modernes comme Google ou Bing ne sont plus de simples outils d'indexation de texte. Ils deviennent de plus en plus intelligents et lisent le contenu de la page avec des résultats de plus en plus précis. Ils classifient le contenu et l'affichent sous une forme intéressante. Si vous étiquetez correctement le type de contenu et ses paramètres de base dans le code HTML, cela ouvrira de nouvelles possibilités SEO pour vous. En tant que agence Drupal professionnelle qui crée de grands sites web, nous attachons une grande importance au SEO.

Un exemple serait un site d'événements. Lorsque vous organisez plusieurs événements et les mettez sur un site web, Google lit les métadonnées contenues dans la liste (type de contenu "Événement", date, nom, lieu, etc.) et les présente sous le résultat de recherche. De cette manière, vous devenez plus visible.

Les métadonnées sont également largement utilisées dans les avis de services et de produits. Les évaluations correctement étiquetées apparaissent dans le moteur de recherche sous forme d'étoiles, grâce auxquelles elles atteignent un taux de conversion plus élevé :

Google prend actuellement en charge un ensemble très limité de types de métadonnées. Cependant, il est possible que cela soit étendu à de nouveaux types de contenu à l'avenir. Il est donc judicieux d'ajouter des métadonnées au cas où – pour avoir une longueur d'avance sur la concurrence.

Formats de métadonnées

Supposons que vous ayez le code HTML suivant sur la page, accueillant un utilisateur nommé John. Vous souhaiteriez fournir aux robots des moteurs de recherche des informations sur cet utilisateur.

<p>Salut, je suis John.</p>

Pour ce faire, vous utiliserez le type de contenu "Person" défini par schema.org.

Il existe trois formats principaux de métadonnées, chacun ayant ses propres avantages et inconvénients. Ils sont tous pris en charge par Google.

JSON-LD

Ce format est définitivement le plus facile à mettre en œuvre et il devient de plus en plus populaire. Il consiste à ajouter un objet JSON contenant toutes les métadonnées au document (généralement au début) – dans notre exemple, il s'agit du type de contenu "Person", qui est – une personne et son nom, c'est-à-dire "John". Cette approche ne nécessite pas de manipulation du code HTML de la page web contenu entre les balises <p>, cependant, elle se caractérise par une redondance de code substantielle. Si vous avez des métadonnées à fournir, par exemple une description plus longue, vous devez la répéter dans le code HTML deux fois.

<script type="application/ld+json">
{
 "@context":"http://schema.org",
 "@type":"Person",
 "name":"John"
}
</script>

<p>Salut, je suis John.</p>

RDF

RDF offre une approche légèrement différente de l'étiquetage de contenu. Afin d'éviter la redondance caractérisant JSON-LD, vous modifiez le code HTML déjà existant pour indiquer où se trouvent les métadonnées. Dans l'exemple ci-dessus, conformément à la spécification RDF, vous trouvez la balise HTML contenant le type de contenu "Person" et indiquez où se trouve le nom de la personne.

<p vocab="http://schema.org/" typeof="Person">
  Salut, je suis <span property="name">John</span>.
</p>

Microdata

Les microdonnées sont actuellement le format le plus populaire, employant un principe similaire à RDF. Il y a une bonne raison pour laquelle je le mets à la fin de cette liste cependant. Il est considéré comme très limité. Malgré sa prévalence (on estime qu'environ 75 % des sites web mettant en œuvre des métadonnées l'utilisaient en 2016), c'est la spécification la moins flexible de celles répertoriées. C'est pourquoi vous ne le trouverez pas dans Drupal.

<p itemscope itemtype="http://schema.org/Person">
  Salut, je suis <span itemprop="name">John</span>.
</p>

Métadonnées dans Drupal

La mise en œuvre des métadonnées est possible dans presque tous les outils utilisés pour la création de sites web. Tout ce dont vous avez besoin est d'accéder aux modèles contenant les balises HTML qui vous intéressent. Dans Drupal, les données sont généralement gérées par deux modules - un intégré dans le noyau RDF, et un créé par la communauté Schema.org Metatag. Je vais brièvement décrire ces deux solutions.

Module RDF

Le module RDF intégré à Drupal est utilisé pour mapper les champs des entités vers les types de métadonnées appropriés. Ce mappage est effectué à l'aide de fichiers .yml et est assez fastidieux - principalement en raison de l'absence de documentation officielle et d'interface graphique. Supposons que vous ayez le type de contenu "Événement", définissant le nom de l'événement (titre), le lieu où il se tiendra (field_place), sa date (field_date) et le prix des billets (field_price). Pour baliser la page de l'événement conformément à la norme RDF, vous créez un fichier de configuration rdf.mapping.node.event.yml et le placez dans le nouveau module foobar dans le répertoire config/install :

status: true
dependencies:
  config:
    - node.type.event
  module:
    - node
    - foobar
  enforced:
    module:
      - foobar
id: node.event
targetEntityType: node
bundle: event
types:
  - 'schema:Event'
fieldMappings:
  title:
    properties:
      - 'schema:name'
  field_date:
    properties:
      - 'schema:startDate'
  field_place:
    properties:
      - 'schema:location'
  field_price:
    properties:
      - 'schema:price'

Ensuite, vous exécutez le module foobar que vous venez de créer et consultez le code HTML du site de l'événement. Il contient déjà des balises RDF.

<article role="article" about="/node/1" typeof="schema:Event">
  <div class="node__content clearfix">
    <div class="field__label">Lieu</div>
    <div property="schema:location" class="field__item">Wrocław</div>
    <div class="field__label">Date</div>
    <div class="field__item">
      <time datetime="2020-04-25T08:00:00Z" property="schema:startDate" class="datetime">Sam, 25/04/2020 - 08:00</time>
    </div>
    <div class="field__label">Prix</div>
    <div property="schema:price" class="field__item">1000</div>
  </div>
</article>

Module Schema.org Metatag

Il existe une méthode beaucoup plus simple et plus directe pour implémenter les métadonnées, fournie par le module schema_metatag, qui est une extension du projet populaire Metatag. Il utilise le format JSON-LD et permet d'ajuster le mappage des champs via un panneau d'administration pratique. Pour notre exemple concernant un événement, cela ressemble à ceci (après avoir activé le module helper schema_event) :

Les indices sur les exigences de Google sont extrêmement utiles ici – ils économisent beaucoup de temps lors de l'optimisation du site web et le résultat final dans le code HTML ressemble à ceci :

<script type="application/ld+json">{
    "@context": "https://schema.org",
    "@graph": [
        {
            "@type": "Event",
            "name": "DrupalCamp Poland",
            "startDate": "Sam, 25/04/2020 - 08:00",
            "location": {
                "@type": "Place",
                "name": "Wrocław"
            },
            "offers": {
                "@type": "Offre",
                "price": "1000"
            }
        }
    ]
}</script>

Comment vérifier la justesse des métadonnées ?

Pour vous assurer que votre site est correctement traité par les robots des moteurs de recherche, vous devriez vérifier son code avec l'outil de test de données structurées de Google. Les erreurs dans la mise en œuvre des microdonnées apparaissent également dans la Google Search Console.