Devsource

Balises Open Graph (OG)

Les balises Open Graph sont des métadonnées intégrées au code HTML qui permettent de contrôler la manière dont un contenu s’affiche lorsqu’il est partagé sur les réseaux sociaux (Facebook, LinkedIn, etc.).

Définition

Le protocole Open Graph (OG) a été créé par Facebook pour transformer une simple URL en un objet riche. En définissant des balises spécifiques comme og:title, og:image et og:description, vous garantissez que l’aperçu affiché sur les plateformes sociales est attractif, professionnel et cohérent avec votre identité visuelle.

[Image of Open Graph meta tags preview on social media vs HTML code]

Bonnes pratiques

  • Implémenter progressivement : Prioriser l’ajout des balises og:image (format recommandé : 1200 x 630 px) sur vos pages à fort potentiel de partage comme les articles de blog ou les fiches produits.
  • Mesurer l’impact : Utiliser des outils comme le Facebook Sharing Debugger ou l’aperçu LinkedIn pour vérifier que les images et les titres s’affichent correctement avant toute publication.
  • Automatiser le monitoring : Configurer votre CMS pour qu’il génère dynamiquement la balise og:description à partir du début de votre contenu ou de votre méta-description SEO.

À éviter

  • Chargements bloquants : Éviter d’utiliser des scripts lourds pour générer ces balises côté client ; elles doivent être présentes dans le HTML source pour être lues par les robots des réseaux sociaux.
  • Assets non optimisés : Utiliser des images trop lourdes ou mal cadrées. Une image mal dimensionnée peut être rognée ou ne
The Bridge
reside
AFFS7
12
R
kp
S
K
The Bridge
reside
AFFS7
12
R
kp
S
K
The Bridge
reside
AFFS7
12
R
kp
S
K
The Bridge
reside
AFFS7
12
R
kp
S
K
The Bridge
reside
AFFS7
12
R
kp
S
K