Open Graph
Ce qu'est Open Graph
Open Graph est un protocole, créé à l'origine par Facebook, qui permet de contrôler l'apparence d'une page web lorsqu'elle est partagée sur les réseaux sociaux et les messageries. Quand quelqu'un poste votre lien sur LinkedIn, Facebook, WhatsApp, Slack ou beaucoup d'autres plateformes, ces services cherchent les balises meta Open Graph dans le HTML de votre page pour construire l'aperçu : le titre, la description et surtout l'image. Sans elles, la plateforme devine, souvent mal, et votre lien apparaît avec une image au hasard ou sans image du tout.
Concrètement, Open Graph transforme une simple URL en un aperçu riche et à votre marque. Cet aperçu est la première impression que fait votre contenu dans un fil social, et il a un effet direct sur le fait de cliquer ou non. Le réussir est une petite tâche technique au impact démesuré sur l'aspect partageable et professionnel de vos liens.
Comment fonctionne Open Graph
Les balises Open Graph vivent dans le <head> de votre page et suivent un schéma simple : un attribut property commençant par og: et une valeur content. Les quatre balises essentielles sont og:title (le titre de l'aperçu), og:description (le texte d'accompagnement), og:image (l'image d'aperçu) et og:url (le lien canonique). Vous pouvez en ajouter d'autres, comme og:type (article, website, product) et og:site_name, pour donner plus de contexte aux plateformes.
- og:title définit le titre en gras affiché sur la carte.
- og:description donne le court texte sous le titre.
- og:image fixe l'image d'aperçu, idéalement 1200x630 pixels.
- og:url déclare l'URL canonique du contenu partagé.
Quand un lien est collé, le robot de la plateforme récupère la page, lit ces balises et met en cache un aperçu. Comme le résultat est mis en cache, modifier vos balises peut exiger l'outil de débogage de la plateforme pour rafraîchir ce qu'elle a stocké.
Open Graph et Twitter Cards
On voit souvent Open Graph mentionné aux côtés des Twitter Cards, l'équivalent propre à X qui utilise des balises twitter:. Bonne nouvelle : X se rabat sur les balises Open Graph quand les balises spécifiques à Twitter sont absentes, si bien qu'un jeu solide de balises og: couvre la plupart des plateformes d'un coup. Beaucoup de sites ajoutent quelques balises twitter:card et twitter:image par-dessus pour affiner l'apparence sur X, mais Open Graph reste le socle commun que lit la majorité des réseaux.
Pourquoi Open Graph compte
Open Graph n'agit pas directement sur votre classement de recherche, ce n'est pas un facteur de positionnement SEO, mais il agit fortement sur le comportement une fois votre contenu arrivé sur les canaux sociaux. Un titre clair, une description accrocheuse et une image nette et bien dimensionnée rendent un lien fiable et cliquable, ce qui augmente le taux de clic et le partage. Un aperçu manquant ou cassé fait l'inverse : il fait amateur et étouffe l'engagement. Pour toute marque qui diffuse du contenu sur les réseaux, ou dont les pages sont partagées par les utilisateurs, Open Graph fait partie d'une stratégie complète de meta description et de métadonnées, aux côtés de vos balises SEO plutôt qu'à leur place.
Il protège aussi la cohérence. En fixant l'image et le texte explicitement, vous décidez de la manière dont votre marque apparaît dans chaque fil, au lieu de la laisser à la supposition d'une plateforme. Ce contrôle compte surtout pour les pages clés : votre page d'accueil, vos landing pages et les articles piliers que vous promouvez activement.
Erreurs fréquentes
Le problème Open Graph le plus courant est une og:image manquante ou mal dimensionnée : trop petite, mauvais ratio, ou un fichier que le robot ne peut pas atteindre, ce qui laisse une carte moche ou vide. On trouve aussi l'oubli complet des balises sur de nouveaux gabarits, l'usage d'URL d'image relatives au lieu d'absolues, et des balises dupliquées ou contradictoires. Un piège subtil : le cache périmé ; après avoir corrigé une balise, la plateforme peut encore afficher l'ancien aperçu tant que vous ne forcez pas un rafraîchissement dans son outil de partage. Tester chaque page importante dans l'outil d'aperçu d'une plateforme avant de la promouvoir est le moyen le plus simple d'éviter une première impression gênante.
Open Graph chez BeBranded
Chez BeBranded, nous configurons Open Graph dans le cadre de la construction de tout site, pour que chaque page, et surtout celles destinées à être partagées, produise un aperçu propre et à la marque. Sur Webflow, nous définissons le titre, la description et une image bien dimensionnée pour les gabarits clés, ajoutons des balises Twitter Card quand c'est utile, et validons le résultat dans les outils de débogage des plateformes avant le lancement. C'est un petit détail qui façonne discrètement le professionnalisme d'une marque dès que ses liens commencent à circuler, et c'est exactement le genre de finition qui sépare un site soigné d'un site inachevé.
FAQ
À quoi sert Open Graph ?
Quelles sont les balises Open Graph essentielles ?
Quelle taille pour og:image ?
Open Graph a-t-il un effet sur le SEO ?
Quelle différence entre Open Graph et Twitter Cards ?
Pourquoi mon aperçu de lien ne se met-il pas à jour ?
Outils associés
