Optimisation Open Graph, conseils pour les opérateurs de sites Web

Le protocole Open Graph a été introduit pour la première fois par Facebook à l’automne 2010. Il a remplacé « Facebook Connect », qui servait auparavant à vérifier les profils Facebook sur les sites Web.

L’activité clic joue un rôle clé pour le contenu partagé sur Facebook et d’autres réseaux sociaux, tout comme dans les pages de résultats de recherche. Outre le titre et la description, vous pouvez également définir d’autres éléments (par exemple, des images de prévisualisation) dans les réseaux sociaux. Un aperçu bien optimisé et ciblé de l’article partagé permet d’améliorer considérablement le TDC (Taux de clics). Cet article vous montrera les conseils les plus importants sur l’optimisation Open Graph pour vous aider à tirer le meilleur parti de vos parts sociales !

Lire également : Les avantages et inconvénients de faire un audit SEO de son site

L’intégration

og:title

L’élément og:title est l’élément le plus en évidence à côté de l’image sur un message Facebook. Vous devriez donc essayer de vous adresser au mieux à votre groupe cible sur les réseaux sociaux afin d’améliorer le TDC de vos messages partagés ! Assurez-vous que votre titre ne dépasse pas 95 caractères. Pour que le titre soit court et précis, vous devez également garder à l’esprit qu’il y a toujours un saut de ligne après les 50 premiers caractères.

<meta property= »og:title » content= »Optimisation Open Graph – Conseils que les exploitants de sites Web devraient considérer »/>

A lire en complément : Les enjeux du référencement dans votre stratégie de tremplin numérique

og:description

Tout comme pour la méta description HTML, vous pouvez ajouter une description pour les réseaux sociaux en utilisant og:description. Les mots-clés primaires, secondaires, etc. n’ont pas d’importance dans ce cas, et aucun mot-clé n’est mis en évidence en gras. Votre description doit donc avoir pour but d’inciter les utilisateurs à cliquer et de leur donner une idée de ce à quoi ils peuvent s’attendre de votre lien (cela permet d’éviter la déception des utilisateurs et donc la détérioration des signaux des utilisateurs). Nombre maximum de caractères : 297 !

<meta property=”og:description” content=”description “/>

og:image

Un élément très crucial des propriétés og est og:image. Vous devez porter une attention particulière à cet élément et l’optimiser au mieux. Pour que l’image soit parfaitement présentée au groupe cible correspondant, il est conseillé d’utiliser un og:image personnalisé, surtout si le contenu est crucial pour les réseaux sociaux. Il existe souvent de nombreuses façons d’optimiser l’image de l’article utilisé sur votre site Web. Un utilisateur peut également sélectionner une image si og:image n’est pas utilisé. Des bannières publicitaires, des icônes et d’autres éléments du site Web sont souvent affichés dans cette sélection, ce qui ne devrait pas se produire. Plus de détails sur les dimensions et les tailles d’image idéales seront discutés plus loin dans cet article.

Comme pour votre propre site Web, vous n’avez qu’à continuer à expérimenter les différentes options. Un suivi idéal vous permet de savoir rapidement quelle option est la plus appréciée par les différents groupes cibles. Idéalement, og:image devrait offrir des indices sur le contenu de l’article, tandis que le titre et la description devraient être utilisés pour encourager les utilisateurs à cliquer.

C’est bon à savoir : si og:image n’est pas utilisé, XING ne recherche pas d’image sur le site. L’élément og:image est nécessaire pour afficher un aperçu du lien partagé sur XING.

og:url

Certaines personnes considèrent la liste og:url redondante dans l’utilisation de la balise canonical. Cependant, comme vous devez utiliser plusieurs URL à la fois (p. ex. par le suivi de campagnes de médias sociaux), il est important de les configurer à l’aide du protocole Open Graph Protocol afin de fournir aux réseaux sociaux de meilleurs indices sur le calcul Edge Rank (Facebook). Et considérant que les réseaux sociaux fonctionnent aussi avec d’autres indices (par exemple, l’URL Canonical), il est recommandé de lister og:url avant l’étiquette Canonical Tag dans le code source. Contrairement à ce qui se passait auparavant lorsque plusieurs problèmes entraînaient souvent de fausses URL dans le flux Facebook, tous les principaux réseaux sociaux fonctionnent actuellement bien avec des séquences différentes.

<meta property= »og:url » content= »https://exemple.com/magazine/?p=7112&preview= true »/>

og:type

Dans la plupart des cas, nous pouvons utiliser og:type pour les sites Web, blogs ou articles. Cependant, si vous travaillez également avec d’autres médias, comme la musique, les vidéos, les livres, etc., vous devriez certainement bien connaître les propriétés og:type. Dans cet article, nous nous concentrons sur l’optimisation des documents HTML pour Open Graph. Le référencement de og:type ressemble à ceci :

<meta property= »og:type » content= »article »/>

Le format d’image idéal (og:image)

Vous devez être au courant des formats et tailles d’image actuellement utilisés si vous voulez présenter og:image de manière optimale dans Facebook. Facebook utilise actuellement un format 1.91:1 pour les images de ses flux. Mais il faut quand même tenir compte de plusieurs aspects pour cette taille :

• Format optimal : au moins 1200 x 630 pixels au format 1.91:1. L’image affichée est suffisamment grande et bien présentée, même sur des appareils haute résolution.
• OK : 600 x 315 pixels. L’image affichée dans le Newsfeed est suffisamment grande, l’affichage sur les appareils haute résolution n’est pas idéal, OK si l’image n’est pas disponible en haute résolution.
• Minimum : 200 x 200 pixels. L’image est affichée sous la forme d’un petit carré, non recommandé.

Si vous travaillez avec de petites images et que vous souhaitez les intégrer dans votre texte, vous devriez essayer de les positionner de manière aussi centralisée que possible. Cela garantit que les images sont également visibles dans le flux Facebook (sans être tronquées).

Le débogueur Open Graph

Le débogueur d’objets Facebook est un outil très utile et précieux pour optimiser les éléments Open Graph. Vous y trouverez les informations enregistrées sur Facebook pour une URL spécifique ainsi que la façon dont cette URL est affichée sur Facebook.

La fonction la plus importante de l’Open Graph Debugger est de récupérer de nouvelles informations de grattage. Récupérez de nouvelles informations de grattage. Cette fonction est particulièrement importante lorsque vous voulez tester et optimiser beaucoup de choses sur votre site Web. Il sert également de fonction de « suppression du cache » dans le protocole Open Graph Protocol. Facebook stocke temporairement des informations. Si vous optimisez og:title, og:image, ou d’autres éléments, cela peut prendre un certain temps avant que Facebook affiche enfin les éléments correctement. La fonction « Récupérer de nouvelles informations de grattage » efface et recharge les informations mises en cache.

J’avais préparé un signet de navigateur pour mes tâches quotidiennes et je l’ai annexé à ce message. Pour utiliser le bookmarklet, il vous suffit de créer un bookmark sur votre navigateur et d’ajouter le code JavaScript suivant dans le code d’adresse des bookmarks :

javascript :(function(){%20window.open(‘https://developers.facebook.com/tools/debug/og/object?q=’+encodeURIComponent(location.href))})() ;

Vous pouvez ensuite placer le signet dans la barre de signets et ainsi le rendre prêt à l’emploi sur n’importe quelle URL.