Le guide ultime pour utiliser Schema.org


  • Français

  • Découvrez notre guide complet sur Schema.org pour apprendre à utiliser les balises telles que Article, NewsArticle, BlogPosting, Offer, Product, Organization, ClaimReview, JobPosting et bien d’autres encore. Notre guide de Schema.org tente de couvrir les balises les plus populaires pour que vous soyez au top pour utiliser les données structurés et améliorer la visibilité de votre site.


    Optimisez votre site avec le balisage Article, NewsArticle, Blogposting, Organization, Website de Schema.org pour exploiter les données structurées.
    Publicités

    Sommaire

    Il y a quelques années, l’optimisation et le SEO d’un site web se basaient principalement sur l’optimisation du contenu, la création des liens et des trucs assez basiques. Ensuite, Google a débarqué avec sa norme Schema.org et le monde du web a changé de manière définitivement. Un webmestre qui n’optimise pas son site ou son blog avec Schema.org perd une grande partie du trafic.

    Qu’est-ce que Schema.org ?

    Schema.org est une norme de données structurées pour la sémantique du web. Schema.org est supporté par les principaux moteurs de recherche tels que Google, Yandex, Bing ou Yahoo. Schema.org permet d’utiliser la sémantique pour marquer chaque contenu de votre page web. Le principal avantage est que le moteur de recherche saura exactement ce dont vous parlez dans chaque partie de la page. Il existe des centaines de balises de Schema.org, mais notre dossier vous permettra de connaitre les principales balises de Schema.org pour vos sites.

    Comparez votre site web à un plat de cuisine. Le plat est l’ossature de votre site et il est connu comme le Boilerplate par les moteurs de recherche. Ensuite, vous mettez les différents aliments sur ce plat. Et Schema.org vous permet de préciser chaque aliment au moteur de recherche afin d’avoir un meilleur classement. Les données structurées comme Schema.org sont l’avenir de la recherche en ligne et si vous êtes dans la création et la gestion des sites, alors Schema.org devra faire partie de votre savoir-faire.

    Comprendre l’importance de Schema.org

    Et la plupart des webmestres et blogueurs utilisent le Schema.org sans le savoir. De nombreux thèmes sous WordPress, mais également Blogger sont optimisés pour le Schema.org, mais on peut aller beaucoup plus loin. Les données structurées vous permettent d’afficher des contenus enrichis. Est-ce que vous avez déjà vu un article dans les résultats d’un moteur de recherche qui affichait des étoiles ? Et bien, c’est du Schema.org. La même chose quand vous voyez directement les prix d’un produit dans les résultats de recherche. Et il ne faut pas confondre le contenu enrichi et les cartes enrichies.

    Les cartes enrichies sont assez récentes et elles ne concernent que quelques balises de Schema.org telles que Recipes (pour les recettes de cuisine), Events (pour les événements), Products (les produits), Reviews (le test ou des avis), Courses (tutoriels ou formation). On a également des cartes enrichies pour les Movies (pour les films) et les restaurants. Tapez le nom d’un film et vous verrez que Google va extraire des données de Wikipédia ou d’autres sites pour afficher les acteurs, la durée, la date de sortie. Ces informations sont un mélange de Rich Cards, mais également de la Search Answer Box où Google vous donne directement la réponse à votre question. Comme on le voit, Schema.org est présent dans les moindres recoins des produits Google et il est important de connaitre les balises essentielles.

    Avant toute chose, nous vous recommandons de mettre l’outil de test des données structurées dans vos favoris. Vous allez en avoir besoin constamment et cet outil est crucial pour tester si une URL affiche bien les données structurées, mais vous pouvez aussi tester directement le code si vous testez uniquement le balisage de Schema.org.

    Les balises importantes de Schema.org pour un site

    Si vous utilisez l’outil de test des données structurées, alors vous allez voir que la plupart des sites vont afficher une balise de type BlogPosting, mais rien de plus. Les webmestres se contentent de plugins ou de thèmes pour intégrer directement Schema.org, mais ce n’est pas de l’optimisation, mais de la paresse. Certes, il faut utiliser des plugins pour automatiser certains trucs, mais il faudra aussi passer à l’intégration manuelle des balises de Schema.org selon votre type de contenu.

    Blogposting, Article ou NewsArticle

    Les webmestres posent souvent des questions entre le choix de la balise Blosposting, Article ou NewsArticle pour leur contenu. En général, vous devez privilégier Blogposting dans la majorité des cas. Article et NewsArticle sont dédié pour de l’actualité.

    Blogposting pour tous les types d’articles

    Choisissez toujours Blogposting si vous avez un doute.. La différence avec Article et NewsArticle est que ce dernier va exiger l’éditeur, son logo, mais surtout, qu’Article demande également le corps du texte ce qui peut être compliqué. Si votre URL affiche un schema.org Blogposting et qu’il n’y a aucune erreur, alors vous n’avez pas de souci à vous faire.

    Actualités et reportages

    Si votre site fait de l’actualité et que vous avez l’habitude de faire des reportages, alors la balise Article est recommandée. Notons que la balise Article a également des variantes avec NewsArticle, Report, ScholarlyArticle, SocialMediaPosting, TechArticle. Si vous faites de l’actualité quotidienne, utilisez Article. Si votre site est inscrit dans Google Actualités, alors privilégiez NewsArticle, car Google regarde cette balise en priorité.

    Mais on peut dire que Blogposting, Article et NewsArticle sont assez similaires. Blogposting est le plus facile à utiliser, car de nombreux plugins et thèmes l’intègrent par défaut. La balise NewsArticle est également essentielle si vous voulez que vos articles soient bien optimisés pour le Carrousel AMP de Google News même si Google peut aussi accepter la balise Article. En fait, c’est la seule différence entre Article, NewsArticle et Blogposting. Un contenu marqué avec Blogposting n’est pas éligible pour ce carrousel pour les éditeurs de Google Actualités (cela peut changer dans le futur).

    Les balises Report, ScholarlyArticle, SocialMediaPosting, TechArticle sont très spécialisées. La balise Report concerne un rapport par une organisation gouvernementale ou une ONG. Attention, vous ne devez pas utiliser la balise Report pour couvrir l’actualité de ce rapport, car ce sera Article ou NewsArticle. Si une ONG ou une organisation gouvernementale veut optimiser son rapport pour Schema.org, alors c’est ce qu’il lui faut utiliser. Il semble que la balise Report soit également utilisée par Google pour Google Scholars, mais ce n’est pas confirmé.

    ScholarlyArticle concerne une étude scientifique, SocialMediaPosting concerne une publication de réseau social tel qu’un Tweet ou une publication de Facebook et TechArticle concerne les tutoriels, les guides et les How to en général. Par exemple, si vous détaillez chaque étape pour rooter un Smartphone, alors la balise TechArticle peut faire l’affaire, mais sachez que ces balises spécialisées ne bénéficient pas encore d’un affichage enrichi de la part Google, mais comme on l’a dit, Google va se baser entièrement sur Schema.org à l’avenir et c’est bien d’être prêt.

    Avec ces balises, vous avez ce qu’il faut pour baliser votre contenu principal. Une chose importante est que Google préfère le format JSON pour le balisage de Schema.org. Pour ceux qui n’ont jamais touché à du code, cela peut sembler complexe, mais le site Schema.org recèle d’exemples en bas de ses pages et il vous suffit de changer les valeurs correspondantes. Ci-dessous, un exemple d’un balisage de Schema.org en JSON pour Blogposting pour un des articles sur ce site.

    Exemple de la balise Blogposting de Schema.org

    Parmi les informations importantes dans le code ci-dessous, vous avez le @type qui est BlogPosting, la headline qui est votre titre, la date de publication et de modification, l’auteur, l’image de l’article, l’éditeur et son logo. Notons qu’à cause de l’AMP, vous devrez avoir une image d’une largeur minimale de 696 pixels et un logo de votre site ou organisation d’une dimension de 600 x 60 pixels.

    Si au lieu de BlogPosting, vous utilisez Article ou NewsArticle, alors sachez que les spécifications des images deviennent obligatoires pour être éligibles pour le carrousel dans l’AMP dans Google News. Vous pouvez faire des concessions dans l’image de l’article, mais le logo de votre site doit absolument respecter les normes. En plus de Blogposting, on fournit des exemples de code pour Article ou NewsArticle.

    Vous pouvez les tester en mode Code dans l’outil de test de données structurées de Google et ils vont marcher. Il vous suffit de changer les valeurs selon votre site. Toutefois, pour ces balises qui vont s’appliquer à tous vos contenus, il est préférable d’utiliser des plugins dans le cas de WordPress, car cela devient fatigant de marquer individuellement chaque article.

    Exemple de la balise Article de Schema.org en JSON

    Exemple de la balise NewsArticle de Schema.org

    Si vous comparez le code de BlogPosting, Article et NewsArticle, alors vous verrez très peu de différences. Mais leur utilisation dépend vraiment de votre contenu.

    La balise Organization de Schema.org

    Les balises Blogposting, Article et NewsArticle sont propres à chaque contenu. Plus tard dans l’article, je vous recommanderais des plugins WordPress qui permettent de marquer automatiquement vos contenus pour Schema.org. Et comme les plugins WordPress sont une vraie jungle, je vous donnerais les plugins que j’utilise pour la plupart des sites. Mais en plus de marquer individuellement vos contenus, vous devez également marquer tout le site et vous pouvez le faire avec la balise Organization de Schema.org. On parlera aussi de la balise WebSite si vous n’avez pas d’organisation physique.

    Exemple de la balise Organization de Schema.org

    Notez que ce code provient du plugin de Schema.org que j’utilise. Mais vous pouvez également l’adapter à vos besoins et l’intégrer dans vos pages directement dans le code. La balise Organization concerne l’établissement physique de votre site ou de votre entreprise, mais vous pouvez l’intégrer même si vous avez seulement un site. On peut intégrer beaucoup d’informations, mais l’essentiel est les informations de contact, la langue du site ou de l’entreprise et des liens vers vos réseaux sociaux respectifs. Ces derniers ne sont pas obligatoires.

    Notez que comme avec le reste des balises de Schema.org, Google ne va pas obligatoirement les prendre en compte, mais comme je l’ai dit, c’est bien d’être prêt. Si votre activité principale est un établissement physique tel qu’un restaurant ou une boutique, alors il est préférable de passer par Google My Business qui vous permettra également d’apparaitre dans le Knowledge Graph comme dans l’image ci-dessous.

    La balise Organization ou Google My Business vous permet d'afficher votre site dans le Knowledge Graph de Google.

    La balise Organization ou Google My Business vous permet d’afficher votre site dans le Knowledge Graph de Google.

    Par exemple, j’ai inscrit ce site dans Google My Business et Google affiche parfaitement les informations sur le côté droit de la page dans le Knowledge Graph. Important : Google ne prend pas en compte ma balise Organization pour afficher ces informations, mais bien les données de Google My Business. Quand vous inscrivez un établissement dans Google My Business, Google va vous enverra une lettre par la poste avec un code pour déterminer que vous êtes autorisé à inscrire cet établissement.

    La balise WebSite de Schema.org

    Selon la définition de Schema.org, la balise WebSite désigne un ensemble de pages lié à un nom de domaine et accessible via l’URL. Au moins, c’est clair. La balise Website possède simplement le nom, l’URL et les actions potentielles.

    La balise WebSite de Schema.org

    La balise WebSite de Schema.org

    Les actions potentielles sont en général un champ de recherche. Vous verrez souvent des sites qui incluent un petit moteur de recherche situé sous le nom. Cette fonction n’est pas automatique, mais cela dépend de la quantité de votre contenu. Mais c’est toujours bien d’intégrer la fonction de recherche dans le cas où Google estime qu’il est pertinent de fournir un moteur de recherche à votre site.

    Exemple de la balise WebSite de Schema.org

    La balise BreadcrumbList de Schema.org

    La balise BreadcrumbList permet d’afficher correctement votre fil d’Ariane. Au lieu d’une URL sous la forme votresite.com/votrearticle.html, il va afficher votresite.com > votre article comme dans l’exemple ci-dessous.

    La balise BreadcrumbList de Schema.org vous permet d'avoir un joli fil d'Ariane

    La balise BreadcrumbList de Schema.org vous permet d’avoir un joli fil d’Ariane

    Je recommande d’utiliser un plug-in pour BreadcrumbList comme pour NewsArticle et Blogposting, car cela deviendra un cauchemar de l’implémenter article par article. Un peu plus bas, je décris un plugin WordPress que j’utilise désormais pour automatiser une grande partie des balises de Schema.org.

    Exemple de la balise BreadcrumbList de Schema.org

    Les balises Product et Offer de Schema.org

    Les balises Product et Offer sont sans doute l’une des plus importantes pour les sites e-commerce, mais également si vous vendez des produits sur votre site. La force de Product et Offer est qu’ils peuvent s’appliquer à n’importe quel produit qu’il soit virtuel ou physique. Notons qu’on peut la combiner avec la balise Offer qui concerne surtout le prix du produit. En fait, il faut toujours la combiner avec Offer pour afficher les prix. Par exemple, vous pourrez avoir le résultat suivant :

    Affichez les prix d'un produit dans les résultats avec les balises Product et Offer de Schema.org

    Affichez les prix d’un produit dans les résultats avec les balises Product et Offer de Schema.org

    Dans ce résultat, on voit surtout le prix qui est affiché. Et ce qui est très intéressant est qu’on peut afficher une fourchette de prix pour un même produit. Par exemple, si vous voulez parler d’un hébergement web, alors c’est un produit comme un autre, mais vous avez un seul hébergement qui est disponible pour plusieurs tarifs.

    Dans ce cas, vous devez utiliser AggregateOffer au lieu d’Offer dans la section Offer de Product. Si c’est un AggregateOffer, alors vous devez fournir le prix minimal, maximal et le prix standard. En général, il faut mettre le prix standard comme le prix minimal. N’oubliez pas d’indiquer la devise de votre prix. Si c’est Offer

    Exemple de la balise Product avec AggregateOffer de Schema.org

    Exemple de la balise Product avec Offer de Schema.org

    La seule différence avec Offer et AggregateOffer est qu’Offer ne propose pas de prix minimal ou maximal. Une chose quand vous créez le code de Product est que vous devez fournir le nom du produit dans Name et non le titre de votre article. La balise Product est strictement liée au produit que vous décrivez et non l’article.

    Mais qu’est-ce qui se passe si vous affichez plusieurs produits sur une seule page ? Et bien, c’est là qu’on va parler des pénalités que vous pouvez subir par Google si vous ne faites pas attention. Mais avec ces balises de Schema.org, vous avez de quoi bien marquer votre site pour qu’il soit bien optimisé.

    Je ne cesse de me répéter, mais ce n’est pas parce que vous ajoutez ces balises que votre site sera superbe dans les résultats de recherche. Certaines balises vont marcher et d’autres non. De plus, faites attention aux doublons. Par exemple, de nombreux thèmes WordPress intègrent déjà des balises telles que BreadcrumbList ou Blogposting et si vous les ajoutez manuellement, alors Google aura dû mal avec les doublons.

    La balise SiteNavigation de Schema.org

    La balise SiteNavigationElement vous permet de spécifier et d’améliorer la navigation de votre site. Par navigation, on parle des sitelinks qui sont les liens qui sont affichés automatiquement dès que votre nom de domaine possède une certaine autorité. Le problème est comme le processus est automatique, vous pouvez avoir des sitelinks qui sont non pertinents.

    La balise SiteNavigationElement permet de résoudre le problème… en théorie, car Google semble accorder une place secondaire à SiteNavigationElement par rapport à son propre processus automatisé des Sitelink. Notons qu’on peut également utiliser la balise SiteNavigationElementpour une page individuelle. Par exemple, si votre article est très long, alors vous pouvez créer une balise SiteNavigationElementpour la table des matières si vous en avez eu. Mais encore une fois, mes tests montrent que Google ne semble pas accorder trop d’importance à SiteNavigationElementpour le moment, mais il faut se tenir prêt au cas où.

    Exemple de la balise SiteNavigation de Schema.org

    La balise Review avec Rating et AggregateRating de Schema.org

    La balise Review est l’une des plus simples et les plus utilisées de Schema.org puisqu’elle consiste à noter un article. La balise Review est très puissante, car elle peut s’appliquer à n’importe quoi tel qu’une série, un film, un livre, un jeu vidéo, un produit, etc. Une chose importante est de différencier la balise Rating et AggregateRating.

    AggregateRating concerne une moyenne des notes laissés par des visiteurs en général. Donc, si vous utilisez les votes des utilisateurs provenant d’un autre site, assurez-vous qu’ils soient visibles sur la page. De même, la balise AggregateRating doit être toujours automatisée puisque c’est une moyenne qui est calculée selon le nombre de votes. Vous pouvez intégrer manuellement la balise Rating, mais pas AggregateRating.

    Exemple de balise Rating de Schema.org

    Exemple de balise AggregateRating de Schema.org

    La balise UserComments de Schema.org pour les commentaires

    Marquez vos commentaires avec des données structurées en utilisant la balise UserComments de Schema.org

    Vous pouvez également utiliser les données structurées sur les commentaires. Actuellement, c’est un peu le fouillis, car Schema.org propose plusieurs balises Schema.org pour les commentaires. On a Comment, UserComments ainsi que la catégorie Action qui est plus recommandé par Schema.org, mais Action ne propose pas de section spécifique à un commentaire.

    On va donc prendre l’exemple d’UserComments qui est la balise la plus adaptée pour les commentaires à l’ancienne. Je vous donne juste une preuve à l’appui que ça marche, car je n’ai pas encore pu l’implémenter dans WordPress. L’une des raisons est qu’il faudrait créer des boucles dans JSON, car il faudrait marquer individuellement chaque commentaire. On pourrait utiliser le format de MicroData, mais je ne l’aime pas, car c’est trop dépendant des thèmes si on utilise un CMS.

    Exemple de la balise UserComments pour Schema.org

    La balise Recipe de Schema.org

    Utiliser la balise Recipe de Schema.org pour afficher les données structurées de vos recettes de cuisineComme son nom l’indique, la balise Recipe de Schema.org vous permet d’afficher les données structurées sur les recettes de cuisine. Etant donné que les blogs, les sites et les plateformes de cuisine pullulent sur le web, Recipe de Schema.org a été l’une des premières balises à bénéficier de l’affichage enrichi par Google. Mais contrairement à d’autres balises de Schema.org qui sont assez simples, Recipe de Schema.org nécessite de nombreuses informations pour fonctionner. Pour avoir l’affichage enrichi sous forme de carte, nous vous recommandons de respecter les directives fournies par Google.

    On a crée un balisage Recipe de Schema.org pour cet article sur le Coucous Royal Express (notre exemple du code ci-dessous). Il y a de nombreux critères à respecter pour Recipe de Schema.org dont les principaux sont listés ci-dessous :

    • cookTime – Le temps estimé pour la préparation
    • cookingMethod – Le type de cuisson (friture, bain marie, à l’étouffé, etc)
    • nutrition – Les informations nutritionnelles telles que le nombre de calories ou la quantité de matière grasse.
    • recipeCategory – Le type de plat (entrée, dessert, etc)
    • recipeCuisine – L’origine de la cuisine (orientale, européenne, etc)
    • recipeIngredient – La liste des ingrédients nécessaires
    • recipeInstruction – Les instructions pour préparer les ingrédients
    • recipeYield – La quantité produit par la recette, par exemple, pour dire que ce plat convient à 4 personnes
    • suitableForDiet – Pour quel genre de régime, les valeurs pour cette balise peuvent être :
      • DiabeticDiet – Diabétique
      • GlutenFreeDiet – Sans gluten
      • HalalDiet – Halal
      • HinduDiet – Hindou
      • KosherDiet – Casher
      • LowCalorieDiet – Faible calorie
      • LowFatDiet – Faible matière grasse
      • LowLactoseDiet – Faible en lactose
      • LowSaltDiet – Faible en sel
      • VeganDiet – Végan
      • VegetarianDiet – Végétarien

    Comme on le voit, la balise Recipe de Schema.org va vous forcer à utiliser une grande partie de votre contenu standard dans ses balises. Notons que Google peut afficher sans respecter toutes ces balises, mais c’est fortement recommandé. De même, on ne doit pas confondre l’affichage enrichi avec l’Answer Box où Google affiche un extrait d’une page web quand on tape une requête. Dans le cas d’Answer Box, j’ai remarqué que le balisage Schema.org n’était pas toujours nécessaire, mais que c’est la popularité et le classement de l’article qui sont les critères.

    Exemple de la balise Recipe de Schema.org

    La balise ClaimReview de Schema.org (Fact-Checking de Google)

    La balise ClaimReview de Schema.org est très récente et elle concerne des articles spécialisés dans le Fact Checking. Pendant des mois, la balise ClaimReview était une extension de Schema.org et il y a quelques semaines, elle a été reconnue officiellement comme une balise officielle par Google. Parmi les critères de ClaimReview, vous avez le claimReviewed qui indique l’information que vous voulez vérifier, le reviewRating qui est la note que vous allez donner à la véracité de l’information. En général, on doit mettre un chiffre à la note, mais si ce n’est pas possible, alors vous pouvez mettre la valeur -1.

    Un exemple d'affichage de la balise ClaimReview de Schema.org dans les résultats de Google pour les articles de Fact-Checking.

    Un exemple d’affichage de la balise ClaimReview de Schema.org dans les résultats de Google pour les articles de Fact-Checking.

    Et le problème est que lorsque vous donnez une note dans ClaimReview, mais que vous ne l’affichez pas dans l’article, alors cela pourrait être du spam selon Google. Dans le reviewRating, vous avez également le worstRating et le bestRating. Plus la rumeur est proche de la vérité, plus la note est supérieure. Mais je n’apprécie pas ce concept de note, car c’est mieux de mettre le texte avec alternateName. C’est ce dernier qui sera affiché et vous pouvez mettre la chaine de caractères que vous voulez telle que Vrai, Faux, Quasiment Vrai, etc.

    C’est la partie itemReviewed qui contient l’article que vous voulez “débunker”. Cette section doit contenu le titre, l’URL, l’auteur et la date de publication. Il est également recommandé de mettre un sameAs pour désigner un profil de réseau social ou autre où on peut identifier l’auteur. Dans mes tests, Google n’affiche pas correctement la balise ClaimReview, car je pense que c’est surtout lié aux sites anglophones pour le moment. Vous pouvez voir un exemple de ClaimReview sur un de mes articles.

    Exemple de la balise ClaimReview de Schema.org

    La balise JobPosting de Schema.org

    La balise JobPosting de Schema.org pour les petites annonces d'emploi

    La balise JobPosting de Schema.org pour les petites annonces d’emploi

    Pendant la conférence Google I/O 2017, Google a annoncé le service Google for Jobs qui va proposer un affichage optimisé sur les offres et les demandes d’emploi en utilisant les balises de Schema.org. En passant, cela s’annonce de mauvaise augure pour les sites des annonces d’emploi, car le shérif Google vient de débarquer dans la ville. Toutefois, le vol du trafic ne sera pas dévastateur, car les sites, qui affichent les annonces, seront toujours affichés dans Google. Quelques semaines plus tard. Google a officialisé Google for Jobs en proposant aux développeurs et aux webmestres de marquer les annonces sur leurs sites avec la balise JobPosting de Schema.org. Il y a de nombreuses directives à respecter, mais si vous êtes familier avec le JSON, alors cela ne devrait pas être trop difficile.

    Google supporte le format Microdata qui vous permet de marquer vos balises HTML, mais Google préfère le JSON. Pour commencer, allez sur la page de JobPosting sur Schema.org et regardez bien les exemples. Ensuite, comparez avec les directives fournies par Google pour voir s’il y des balises manquantes. Par exemple, des attributs tels que hiringOrganization, identifier, validThrough sont obligatoires ou recommandées alors qu’elles ne sont pas indiqués sur la page de Schema.org. De plus, certains balises comme baseSalary ou jobLocation sont également différentes sur les recommandations de Google sur jobPosting par rapport aux directives de Schema.org.

    Exemple de la balise jobPosting de Schema.org

    Mais voici un exemple de balise JobPosting de Schema.org qui fonctionne parfaitement sur l’outil de test des données structurées de Google.

    Si vous testez ce code dans l’outil de test des données structurées de Google, alors il sera valide. Mais on ne peut pas encore voir d’affichage optimisé dans l’aperçu, car cela dépend du site, mais également du fait que jobPosting semble principalement destiné au mobile.

    L’implémentation de jobPosting peut être automatisé, mais je pense que cela va être très compliqué. Google privilégie le format JSON et à moins d’avoir un plugin dédié sur WordPress ou autre, ça va être chaud. On pourrait le faire via les Microdata, mais dans ce cas, il faudra changer le Template de sa page d’annonce pour correspondre aux critères de Google. L’ajout manuel est vraiment difficile avec Json quand on sait qu’un site peut avoir des milliers d’annonces.

    Utiliser Schema.org sur un forum avec la balise DiscussionForumPosting

    Utiliser la balise DiscussionForumPosting de Schema.org pour ajouter des données structurées à un forum

    La norme Schema.org propose aussi la balise DiscussionForumPosting qui est assez récente. Et je vous explique comment l’implémenter sur un forum. Je prend l’exemple d’un site WordPress qui utilise bbPress et chaque implémentation est différente. Par exemple, le forum xenforo propose aussi d’utiliser la balise DiscussionForumPosting avec ses propres codes.

    Dans le cas de bbPress avec Schema.org, il faut modifier un fichier du thème de WordPress qui se trouve dans wp-content/plugins/bbpress/templates/default qui s’appelle content-single-topic.php. Vous pouvez le mettre dans plusieurs fichiers, mais comme la structure des fichiers de bbpress est un vrai bordel, j’ai pris celui-là pour plus de facilité. Notez que vous devez déplacer ce fichier dans votre thème WordPress enfant, car si vous modifiez le fichier original, alors les changements seront perdus à la prochaine mise à jour de bbPress. Créez un thème enfant WordPress et copiez le fichier content-single-topic.php dans le répertoire de ce thème enfant.

    Schema.org supporte le format JSON et comme je l’ai mentionné, préférez toujours ce format plutôt que le Microdata ou le RDF. Le principal avantage de JSON est qu’il interprète le PHP. De ce fait, vous pouvez simplement intégrer des fonctions de bbPress pour utiliser Schema.org dans vos forums. Comme la balise est très récente, j’ai fait un véritable bricolage. Ca a l’air de marcher, mais on ignore si la balise ne va pas changer dans le futur.

    Un exemple de la balise DiscussionForumPosting de Schema.org pour un forum

    Si vous avez modifié du code de WordPress ou de bbPress, alors vous devriez comprendre ce machin. Ainsi, “@id”:”<?php bbp_reply_id(); ?>”, vous permet d’afficher l’ID du forum qui est équivalent à l’URL. La date et l’heure m’ont posé des problèmes, car le format de bbPress était bordélique. J’ai donc utilisé la fonction date/heure de WordPress avec “datePublished”:”<?php the_time(‘c’); ?>”,. Le paramètre permet d’avoir une date à la norme ISO 8601 qui est supporté par Schema.org. Ensuite, vous devez mettre une image, car la balise DiscussionForumPosting l’exige.

    Mais comme c’est un forum et qu’il est très difficile d’extraire une image via une fonction en sachant que la plupart des articles de forum sont sans images, alors il vaut mieux mettre l’image d’un logo ou de votre bannière. L’attribut Headline indique le titre du sujet du forum et on le fait avec : “headline”:”<?php bbp_topic_title(); ?>”. Ce n’est pas obligatoire, mais j’ai également mis le forum dans lequel le sujet est publié avec “articleSection”:”<?php bbp_forum_title(); ?>”. En gros, c’est l’équivalent d’une catégorie. Ensuite, j’ai mis l’auteur avec la fonction de “name”: “<?php the_author(); ?>” qui est une fonction de WordPress. Ca marche parfaitement avec bbPress.

    La propriété articleBody m’a donné le plus de fil à retordre. En fait, vous pouvez afficher le contenu du sujet de forum avec la fonction bbp_topic_content, mais il va afficher les balises HTML et tout le tintouin et JSON a dû mal avec ce formatage. Il vaut mieux fournir du texte brut, mais c’est impossible. Donc, j’ai utilisé la fonction get_the_content() à la place qui est la principale fonction pour les articles standards de WordPress, mais comme bbPress se base sur ce dernier, alors on a bien le sujet du forum qui s’affiche. Donc, la ligne “articleBody”:”<?php echo wp_strip_all_tags( get_the_content() ); ?>”, va supprimer toutes balises HTML et d’autres ponctuations pour afficher uniquement le texte brut grâce à la fonction wp_strip_all_tags. On pourrait croire que les fonctions de bbPress supporteraient wp_strip_all_tags, mais ce n’est pas le cas et j’ai dû me rabattre sur get_the_content. Notons qu’articleBody n’est pas du tout obligatoire, mais c’est bien de le fournir quand même. Donc, si vous n’avez pas envie de trop bidouiller, vous pouvez vous faire passer de cette propriété.

    La partie interactionStatistic vous permet d’afficher le nombre de commentaires. La balise ReplyAction m’a semblé la plus proche des réponses à un sujet d’un forum.

    Une ou plusieurs balises DiscussionForumPosting ?

    Moi, j’ai utilisé le fichier content-single-topic.php, mais vous pouvez aussi utiliser le fichier loop-single-reply. De cette manière, votre balise DiscussionForumPosting se retrouvera dans chaque réponse du forum. Cela signifie que si un seul sujet de forum possède 10 réponses, alors Google va reconnaitre 10 balises DiscussionForumPosting différentes. J’ignore si cette balise s’applique à un fil de forum tout entier ou qu’on peut la mettre sur chaque réponse du forum.

    Je vous conseille de suivre mon exemple, une seule balise, car vous risqueriez de vous prendre une pénalisation pour spam. L’inconvénient est que les réponses du sujet ne seront pas intégré dans Schema.org, mais je pense qu’on peut bidouiller un peu en les intégrant comme des commentaires.

    Comment ajouter manuellement les balises de Schema.org dans WordPress ?

    Maintenant que nous avons décrit les balises et fournis les exemples correspondants. Il vous faut maintenant les intégrer dans WordPress. Dans de nombreux cas, vous devrez ajouter manuellement les balises de Schema.org, car chaque article sur votre site peut être différent. En fait, les données structurées ont été conçus pour différencier précisément chacun de votre contenu.

    Avec l’éditeur de WordPress

    Vous pouvez mettre le code de Schema.org dans l’éditeur de WordPress en mode texte. Vous basculez en mode Texte et vous collez le code de Schema.org. Evidemment, cela ne fonctionne que si vous choisissez le format JSON-LD. Mais il est le plus facile à utiliser une fois qu’on comprend la syntaxe. Vous pouvez coller le code à la fin de votre article et si vous rebasculez en mode Visuel, vous verrez que le code sera invisible.

    Comment ajouter manuelle les balises de Schema.org dans WordPress ?

    Comment ajouter manuellement les balises de Schema.org dans WordPress ?

    Ajoutez les balises Schema.org à la fin de votre article en mode texte dans l'éditeur de WordPress (ne laissez pas de lignes vides entre le code)

    Ajoutez les balises Schema.org à la fin de votre article en mode texte dans l’éditeur de WordPress (ne laissez pas de lignes vides entre le code)

    Une chose importante si vous choisissez cette méthode est que votre code ne doit pas contenir des lignes vides. Donc, vérifiez bien que vous n’avez pas de retour chariot qui laisse des lignes vides entre le code. La raison est WordPress ajoute automatiquement la balise p dans ces lignes vides et cela cassera le code. C’est pourquoi, vérifiez toujours avec l’outil d’extration de données structurées que votre balisage Schema.org est correct.

    Avec les champs personnalisés de WordPress

    La première méthode est un peu barbare, mais ça fonctionne. Si vous voulez une méthode plus propre, alors vous pouvez passer par les champs personnalisés de WordPress. Ils sont présents dans l’éditeur de WordPress, mais parfois, vous devez les rendre visible via les Options de l’écran qui se trouve en haut de votre éditeur.

    Afficher les champs personnalisés dans l'éditeur de WordPress

    Afficher les champs personnalisés dans l’éditeur de WordPress

     

    Afficher les champs personnalisés dans l'éditeur de WordPress

    Une fois qu’ils sont visibles, vous trouvez les champs personnalisés en bas de l’éditeur. Ajoutez un nouveau champ personnalisé avec un nom tel que schema et collez tout le code de balise de Schema.org dans le champ Valeur.

    Ajouter le code de Schema.org avec un champ personnalisé dans WordPress

    Ensuite, il faut bidouiller un des fichiers de votre thème WordPress. Trouvez le fichier d’en-tête (header.php) et collez le code ci-dessous avant la balise </head> :

    Désormais, à chaque que vous voulez ajouter une balise Schema.org, vous pouvez utiliser ce champ personnalisé et cela va s’afficher automatiquement.

    Les meilleurs plugins WordPress pour Schema.org (Markup (JSON-LD) structured in schema.org) et WP-PostRatings

    J’ai testé des dizaines de plugins WordPress pour Schema.org et aucun n’était satisfaisant. Pendant très longtemps, j’ai été très content du plug-in Add Meta Tags, mais le développeur a abandonné son développement à cause des relations toxiques avec certains utilisateurs qui se fichaient de lui. Add Meta Tags était excellent, car il supportait différentes normes de données structurées tels que Schema.org, mais également l’Open Graph de Facebook ou Dublin.

    Les gens conseillent souvent d’utiliser le plugin Yoast SEO et même s’il est bien, c’est une véritable usine à gaz. De plus, cette saloperie de Yoast SEO a tendance à foutre le bordel si vous utilisez un autre plugin de Schema.org vous incitant à désinstaller le concurrent de manière systématique.

    Encore aujourd’hui, la référence des plugins WordPress de Schema.org était All In One Schema.org Rich Snippets. Et je vais dire qu’il est très bon, mais je ne suis pas à l’aise avec certaines de ces caractéristiques. Le principal est que le plugin All In One Schema.org Rich Snippets affiche les données structurées en dessous de chaque article. Si vous voulez en voir un exemple, allez sur le site de Ghacks qui l’utilise depuis plusieurs années. Le principal avantage de All In One Schema.org Rich Snippets est que vous n’avez pas d’écrire une seule ligne de code et vous pouvez personnaliser vos balises pour chaque article. Mais ce plugin provoque parfois des erreurs et pour être honnête, je ne suis plus très chaud pour l’utiliser. Mais si vous commencez avec Schema.org sur WordPress, alors c’est un bon point de départ.

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

    Depuis plusieurs mois et sur la plupart de mes sites, j’utilise Markup (JSON-LD) structured in schema.org. La principale force de ce plugin est qu’il affiche uniquement les données en JSON-LD qui est le format recommandé par Google. De plus, c’est le plugin WordPress qui supporte le plus de balises par rapport aux autres.

    Ainsi, il supporte les balises Article, BlogPosting, BreadcrumbList, Event, LocalBusiness, NewsArticle, Organization, Person, SiteNavigation, Video et Website. Quand vous avez activé le plugin, vous aurez une simple interface où vous pouvez activer/désactiver les balises que vous voulez.

    L'interface du plugin Markup (JSON-LD) structured in schema.org

    L’interface du plugin Markup (JSON-LD) structured in schema.org

    Avant tout, vérifiez si votre thème intègre déjà certaines balises Schema.org pour éviter les doublons. C’est souvent le cas de Blogposting. Pour ma part, je vous recommande d’activer Blogposting, Article, NewsArticle, Organization, SiteNavigation et Website dans ce plugin. De cette manière, ces balises vont s’afficher automatiquement sur toutes les pages. L’un des inconvénients de Markup (JSON-LD) structured in schema.org est qu’il ne permet pas de spécifier les balises par page comme dans le cas du plugin All In One Schema.org Rich Snippets. Par exemple, pour des balises tels que Video, LocalBusiness ou Event, on aurait aimé avoir plus de contrôle. Mais le plugin est très propre. Il n’y a pas d’options payantes et les résultats sont assez performants.

    Le plugin WP-PostRatings pour des notes associés à Article de Schema.org

    Le plugin Markup (JSON-LD) fonctionne aux petits oignons, mais il lui manque certaines options. Aujourd’hui, Google affiche souvent les avis des utilisateurs pour un article. L’idée serait d’associer la balise AggregateRating avec celle d’Article de Schema.org. Malheureusement, Markup (JSON-LD) ne peut pas le faire. Et à la place, je vous recommande le plugin WP-PostRatings qui est spécifiquement conçu pour ça. Ce plugin va permettre à vos visiteurs de noter votre article et une fois que le vote est activé, alors le plugin active la balise Article de Schema.org. De cette manière, vous pourrez avoir le résultat suivant :

    L’image ci-dessus montre un article standard, marqué avec la balise Article de Schema.org, mais qui affiche les votes des utilisateurs. Ce n’est pas obligatoire, mais c’est toujours intéressant d’avoir ce type d’affichage. Si vous utilisez le plugin WP-PostRatings, il vous faudra modifier votre thème pour insérer le code pour permettre aux gens de voter et il faudra désactiver la balise Article de Markup (JSON-LD) si vous l’utilisez en même temps pour éviter les doublons. Attention, le plugin WP-PostRatings affiche uniquement le format Article de Schema.org lorsqu’il y a un vote au minimum.

    Attention aux pénalisations de Google sur Schema.org

    Il y a quelques semaines, j’ai eu un joli message de pénalisation manuelle de la part Google pour une mauvaise utilisation de mes balises Schema.org. Étant donné que c’est un dimanche matin, vous ne pouvez pas imaginer ma joie devant une telle nouvelle. Et pourtant, je n’utilise aucune tactique de Spam et croyez-moi, la pénalisation manuelle de Google sur Schema.org est bien plus catastrophique qu’on le pense.

    Quand vous vous prenez cette pénalisation sur les données structurées, le classement de votre site n’est pas impacté même si j’ai eu des fluctuations pendant quelques jours. Mais toutes les données enrichies affichées par Google disparaissent. Parmi les directives de Google sur Schema.org, on a :

    • Une page décrit un seul produit. Vous ne pouvez pas mettre plusieurs descriptions de produit dans une seule balise. Et mon problème venait de cette confusion. J’avais utilisé la balise ClaimReview qui permet de dire à Google qu’on a écrit un article de Fact Checking. Pour démonter un Hoax, j’ai dû fournir plusieurs URLs d’exemple dans la balise et Google n’a pas du tout apprécié. Donc, quand vous faites la Review ou la description d’un produit, vous devez fournir une seule description. Mais quid si votre page affiche plusieurs produits, par exemple, pour un comparatif ? Et bien, il faut autant de balisage Schema.org que de produit. Si vous écrivez un article sur 4 Smartphones à 100 euros, alors vous devez fournir 4 balisages Schema.org pour les 4 produits.
    • Pas de données structurées cachées par rapport au contenu de la page. Les blogueurs et les webmestres utilisent souvent la balise Rating (le vote) pour avoir un meilleur affichage dans les résultats de recherche. Ces Ratings peuvent venir de votre site, par exemple, votre note sur un produit, ou les notes des visiteurs. Mais dans tous les cas, ces notes doivent visibles sur la page si vous utilisez une balise Review.
    • Pas de contenu violent ou sexuel. Comme d’habitude, il est interdit d’utiliser les données de Schema.org pour marquer du contenu illicite, sexuel, violent, etc.

    Si votre classement n’est pas pénalisé, alors pourquoi les pénalités de Schema.org sont assez graves ? Ça devient grave si vous utilisez l’AMP (Accelerated Mobile Pages) sur votre site. L’AMP est un format de Google qui permet d’alléger considérablement ses pages et de les afficher instantanément. Google promeut énormément l’AMP et le principe est qu’il copie vos pages dans ses propres serveurs pour un affichage ultra-rapide. Mais seulement voilà, l’AMP exploite énormément les données de Schema.org.

    Donc, si vous êtes pénalisé par Google sur vos données structurées, alors vous n’êtes plus éligible pour l’AMP par la même occasion. Et viendra le moment où Google va considérer les pages AMP comme un facteur de référencement et là, vous allez prendre très cher. Donc, même si vous avez bien configuré vos données structurées, faites des vérifications régulières. La norme Schema.org évolue constamment et il arrive que les balises que vous utilisez il y a quelques années ne soient plus conformes.

    En conclusion

    Ce guide pratique de Schema.org est loin d’être exhaustif. Mais il suffit pour convenir à la plupart des sites. De nombreuses personnes choisissent d’automatiser tout le processus de Schema.org pour leurs sites et cela peut poser des problèmes. Une bonne pratique est de mélanger les processus automatisés et manuels. Par exemple, je voulais afficher la note des visiteurs sur mes articles. Mais le plugin Markup (JSON-LD) structured in schema.org ne permet pas de le faire.

    Donc, j’ai utilisé un autre plugin appelé WP-PostRatings qui permet aux visiteurs de voter tout en intégrant la balise Article de Schema.org. Et pour éviter les doublons, j’ai dû désactiver le balisage d’Article du plugin Markup (JSON-LD) structured in schema.org. Il y a d’autres astuces pour peaufiner toujours plus le marquage de ses données structurées. Et seuls l’expérience et des milliers de tests vous permettront de déterminer les balises intéressantes pour votre site.

    Houssen Moshinaly

    Rédacteur web depuis 2009 et webmestre depuis 2011. Je suis également un blogueur dans la vulgarisation scientifique et la culture.

    Je m'intéresse à tous les sujets comme la politique, la culture, la géopolitique, l'économie ou la technologie. Toute information permettant d'éclairer mon esprit et donc, le vôtre, dans un monde obscur et à la dérive. Je suis l'auteur de deux livres "Le Basilic de Roko" et "Le Déclin".

    Pour me contacter personnellement :

    10 réponses

    1. Pascal dit :

      Bonjour Houssen : enfin un article bien fait et en français sur ce sujet 🙂

      Moi aussi j’utilise le plugin Markup (JSON-LD) structured in schema.org et pour le “rating” j’utilisais jusqu’à présent “Yasr – Yet Another Stars Rating” mais il faut que je lui trouve un remplaçant car je suis sur un serveur LiteSpeed et j’utilise l’excellent plugin de cache LiteSpeed Cache (https://wordpress.org/plugins/litespeed-cache/). Les développeurs de ce plugin disent que WP-PostRatings est compatible avec ce système de cache, bon alors alors go…

      Seulement voilà, il y a des choses qui dérangent dans WP-PostRatings :
      – Il utilise des “display:none” dans son code qui violent les règles de Google : https://wordpress.org/support/topic/google-stop-my-rank-stars/ (et qui sont en place sur ton site > https://s1.postimg.org/8ac0l626dr/dnone.jpg
      – Je ne comprend strictement rien à la façon dont on peut traduire, ou utiliser une autre langue… Avec Loco Translate c’est impossible car il semble que développeur n’utilise pas les standards .po/.mo et la lecture de cet article : https://wordpress.org/support/topic/translation-does-not-work-on-the-website/ ne m’éclaire pas du tout sur la façon de procéder… Je vois que tu ton site c’est en français, alors une petite aide sur le sujet serait la bien venue… 🙂
      РLes images des ̩toiles sont vraiment affreuses et ridiculement petites, les tiennes sont un peu mieux : tu as carr̩ment remplacer les images dans le plugin ?

      Merci…

    2. Pascal dit :

      Merci pour tes réponses 🙂
      Une autre question concernant la méthode de logging : https://s1.postimg.org/77qlt1fykf/logging.jpg
      J’avoue que je comprends pas à quoi ça sert… là j’ai mis sur “Do not log” mais pourtant quand je vais dans “Manage ratings”, je vois bien les logs qui s’incrémentent au fur et à mesure de mes votes tests…
      Meci

    3. Victor dit :

      Bonjour Houssen,

      Je rencontre une problématique et je ne trouve aucune ressource à ce sujet concernant une erreur qui ressort à 5 reprises dans l’outil de test structuré de Google.
      Il s’agit de “Nous ne reconnaissons pas la propriété ImageObject pour un objet de type WebPage.”
      Sur chaque image de la page, le code ressemble à ça :
      J’ai l’impression que ça vient du thème en lui même : Enfold et je ne sais pas comment corriger le tir pour récupérer l’affichage de mes rich snippets…

      Je suis preneur de toute aide pour arriver à régler ce soucis 😉
      Merci d’avance,
      Victor

      • Houssen Moshinaly dit :

        Bonjour, ça peut venir du thème, mais également de la balise utilisée. WebPage n’est pas forcément indiqué pour toutes les pages et il faut préférer BlogPosting ou Article. De plus, certaines balisent exigent une image

    4. Totelae dit :

      Merci pour cet article ! Je ne connaissais pas (encore) schema.org, je vais de ce pas rajouter ça à mon blog !

    5. Léa dit :

      Bonjour Houssen,
      Merci pour cet article très précis !
      J’ai une question : est-il possible de mettre plusieurs balises à la suite ? Si oui, comment les enchaîner ? Quand je le fais, l’outil de test de Google ne voit que le premier
      Ex. mettre Corporation, puis Review, puis SiteNavigation ?

      • Houssen Moshinaly dit :

        Bonjour Léa, ça dépend comment tu les implémentes. Avec des balises, cela devient compliqué et rapidement ingérable. Sur WordPress, tu as énormément de plugins pour le faire. Et sinon, c’est mieux d’utiliser le format Json qui permet d’avoir autant de balisages qu’on veut. Mais attention aux risques de Spam.

    6. hristophe dit :

      Bonjour Houssen
      Bravo !!!
      Ton article est clair,concis et très précieux car un vide monumental en français sur le sujet ou abscons en Anglais .
      Un grand merci Voisin à l amateur que je suis qui aide sa femme pour son site .
      Christophe / St Denis ,ile de la Réunion .

    Répondre à Houssen Moshinaly Annuler la réponse

    Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *