Les balises Open Graph sont des balises meta HTML qui indiquent aux réseaux sociaux et aux applications de messagerie comment afficher un aperçu lorsque l'URL d'une page est partagée, en précisant le titre, la description, l'image et le type à afficher plutôt que ce que la plateforme pourrait deviner par elle-même. Développé à l'origine par Facebook, le protocole Open Graph est aujourd'hui lu par presque toutes les grandes plateformes sociales et de messagerie, ce qui en fait le moyen standard pour un e-commerçant de maîtriser l'apparence de ses pages produits lorsqu'elles sont partagées, épinglées ou liées depuis l'extérieur de son site. En e-commerce, des balises Open Graph bien configurées font la différence entre un lien produit partagé qui affiche une image et un prix attractifs, et une vignette générique ou cassée.
Pourquoi les balises Open Graph sont importantes pour les pages alimentées par le flux
Les pages produits sont partagées en permanence, que ce soit par le bouche-à-oreille des clients, les liens d'affiliation, les publications d'influenceurs ou les emplacements payants sur les réseaux sociaux, et chacun de ces partages s'affiche à partir des balises Open Graph plutôt que du contenu réel de la page qu'un visiteur verrait après avoir cliqué. Une page produit sans balises correctement configurées peut afficher un logo étiré, une description tronquée ou hors sujet, voire aucune image, ce qui pénalise le taux de clic d'un partage qui représente pourtant une diffusion gratuite et à forte intention. Comme les pages produits sont généralement générées en masse à partir du même catalogue qui alimente le flux Shopping, les valeurs Open Graph peuvent être générées par modèle directement à partir des métadonnées produits existantes au lieu d'être rédigées à la main pour chaque SKU, ce qui en fait l'un des gains les plus faciles à déployer à grande échelle pour un grand catalogue.
Comment fonctionnent les balises Open Graph
Les balises Open Graph se trouvent dans le <head> d'une page web sous la forme d'éléments <meta property="og:...">, og:title, og:description, og:image et og:url couvrant les champs d'aperçu essentiels lus par la plupart des plateformes. Pour un catalogue produits, ces valeurs correspondent généralement directement à des attributs de flux déjà maintenus pour Shopping et Meta Catalog : les mêmes titre, description et image principale utilisés dans le flux peuvent alimenter les balises Open Graph équivalentes, ce qui garde les deux surfaces cohérentes sans nécessiter de rédaction distincte. Les plateformes et les moteurs de recherche croisent de plus en plus ce balisage structuré avec un knowledge graph plus large d'entités pour comprendre ce que représente une page : des données Open Graph cohérentes renforcent donc la compréhension d'un produit par les machines au-delà du simple aperçu social. Comme ces balises déterminent le comportement d'un lien partout où il est partagé, elles jouent aussi un rôle discret mais important dans une syndication de contenu efficace, où un même produit peut apparaître sur plusieurs sites partenaires ou agrégateurs.
Exemple
<item>
<g:id>SKU-10234</g:id>
<g:title>Organic Cotton Crewneck Sweater - Charcoal, M</g:title>
<g:description>Soft, breathable organic cotton crewneck in charcoal.</g:description>
<g:image_link>https://example-shop.com/img/org-sweater-charcoal.jpg</g:image_link>
</item><!-- Open Graph tags on the corresponding product page, templated from the feed -->
<meta property="og:title" content="Organic Cotton Crewneck Sweater - Charcoal, M">
<meta property="og:description" content="Soft, breathable organic cotton crewneck in charcoal.">
<meta property="og:image" content="https://example-shop.com/img/org-sweater-charcoal.jpg">
<meta property="og:type" content="product">Concepts associés
Comme les valeurs Open Graph reflètent de très près les métadonnées produits existantes, il vaut mieux les gérer comme un modèle que comme une tâche manuelle, et elles contribuent à la cohérence avec laquelle l'identité d'un produit est comprise dans un knowledge graph plus large d'entités. Elles facilitent aussi discrètement la syndication de contenu, en garantissant qu'un produit ait le même aspect et le même texte partout où un lien vers lui finit par être partagé.
