Graphe ouvert expliqué

Tout le monde veut créer du contenu qui se démarque, encourage la notoriété de la marque et est facile à partager dans le monde du marketing en ligne.

Les balises Open Graphs sont un moyen de gagner plus de vues sur les réseaux sociaux. Ces balises utiles déterminent comment vos aperçus de liens apparaissent sur les réseaux sociaux. Lorsque quelqu’un partage un lien depuis votre site Web, il verra les parties les plus importantes de votre page Web dans l’aperçu.

Qu’est-ce qu’un graphique ouvert ?

En 2010, Facebook a introduit les balises méta Open Graph pour faciliter le partage de sites Web sur la plate-forme. Twitter et LinkedIn ont depuis adopté les balises méta Open Graph pour améliorer l’expérience de leurs utilisateurs.

Lorsque vous collez une URL dans une zone de saisie Facebook, vous verrez probablement un aperçu du lien. Avant les balises méta Open Graph, vous n’aviez aucun contrôle sur l’apparence de l’aperçu de votre lien, et parfois Facebook affichait le mauvais contenu.

Les balises méta Open Graphs aident les utilisateurs à optimiser leurs aperçus de liens vers les réseaux sociaux, afin que les utilisateurs voient toujours les informations essentielles.

Dans les images suivantes, nous avons un exemple de balises méta incluses dans le code d’une page Web. Lorsque quelqu’un publie l’URL de cette page Web sur Facebook, nous voyons un aperçu du lien stylisé :

Pourquoi les balises Open Graph sont-elles importantes ?

Les canaux de médias sociaux sont une source constante de trafic Web et de conversions. Avec le bon mélange de stratégie et de design, vous pouvez convaincre les utilisateurs de cliquer sur votre site Web pour en savoir plus sur votre marque, réaliser une vente et bien plus encore.

Les balises méta Open Graph améliorent les aperçus des liens de votre page Web d’une manière qui attire l’attention de votre public. Voici à quoi ressemble un aperçu de lien pour une page Web sans balises méta Open Graph sur Facebook :

Passons en revue un aperçu de lien pour une page Web avec Open Graph. En comparaison, nous voyons une image plus grande et un titre en gras, et une URL tronquée.

Comment utiliser un graphique ouvert

listes Facebook 17 balises Open Graph dans leur documentation officielle, mais seulement quatre sont nécessaires pour que Facebook comprenne votre page Web. Vous utiliserez les balises en les plaçant entre les balises dans le backend de la page Web.

Les quatre balises requises sont :

1. OG : titre pour le titre de l’article

2. OG : tapez pour indiquer le type d’objet que vous mettez en ligne (article, vidéo, etc.)

3. OG : image pour l’URL de l’image principale

4. OG : URL pour indiquer l’URL réelle vers laquelle l’utilisateur cliquera

Vous pouvez utiliser d’autres balises OG, telles que :

• OG : audio (connectez un fichier audio à votre message)
• OG : description (ajouter une brève description)
• OG : déterminant (indiquer le mot qui apparaît avant le titre de l’objet dans une phrase)
• OG : nom du site (liste du site d’où provient l’objet)

Autres formes de graphe ouvert

Cartes Twitter

Les cartes Twitter fonctionnent de manière similaire à Open Graph en ce sens que vous pouvez personnaliser la façon dont vos aperçus de liens apparaissent dans les tweets. Lorsque vous collez une URL dans la zone de saisie de Twitter, elle génère automatiquement un titre et une image principale :

Vous pouvez toujours utiliser les balises Open Graph avec Twitter ; la plate-forme implémente simplement son propre système de balises avant Open Graph.

Cependant, les cartes Twitter ont une exigence : les images doivent être dimensionnées à 1024 pixels par 512 pixels. Vous pouvez revérifier l’apparence de votre carte Twitter avec son Validateur de carte.

Tester les résultats de vos graphiques ouverts

Il peut être utile de tester votre implémentation Open Graph pour vous assurer qu’elle fonctionne au moment de publier. Pour tester, plusieurs options s’offrent à vous, notamment :

Outil d’audit de site

L’outil d’audit de site comprend plus de 120 vérifications SEO techniques et sur page pour chaque partie de votre site Web. Une de ces vérifications indique combien de vos pages auditées ont des balises Open Graph.

Pour commencer avec l’outil d’audit de site :

1. Affichez l’outil d’audit de site à partir du tableau de bord de votre projet. (Si vous n’avez pas configuré de projet, vous devrez créer un projet pour votre site Web afin d’utiliser l’outil d’audit de site.)

2. Configurez les paramètres de l’audit avec les panneaux de configuration de l’outil. Vous pouvez définir la portée de l’analyse de l’audit et inclure toutes les pages non autorisées. Sélectionner Démarrez l’audit du site.

3. Une fois l’audit terminé, utilisez le Rapport thématique de balisage dans le Onglet Présentation pour voir toutes les pages avec le balisage Open Graph :

D’après l’exemple ci-dessus, nous voyons que 78% des pages n’ont aucun balisage. Si vos résultats ressemblent à ceux-ci, il peut être utile d’envisager d’ajouter un balisage Open Graph à vos pages les plus importantes.

Débogueur d’objets Facebook

Étant donné que Facebook utilise le protocole Open Graph pour déterminer ce qu’il faut afficher lorsqu’un lien est disponible, ils offrent un outil de débogage pour tester votre code Open Graph. Pour utiliser l’outil :

1. Accédez à Facebook Outil de débogueur.
2. Entrez l’URL de la page que vous souhaitez récupérer et enquêter.
3. Sélectionner Déboguer.

S’il y a des problèmes avec votre lien, l’outil renvoie un message d’avertissement :

Autres façons de vérifier les données structurées

Points clés à retenir

Open Graph est un simple ajout à votre page Web qui peut apporter des résultats remarquables pour vos campagnes marketing. L’apparition de votre contenu sur les réseaux sociaux peut attirer plus d’utilisateurs et éventuellement les convertir en ventes.

Si vous débutez dans l’utilisation du code Open Graph, il existe de nombreux outils pour vous aider à tester si votre implémentation fonctionne. Essayez un outil d’audit de site ou tout autre outil pouvant vous aider à examiner vos données structurées.