freelight'

chargement…

Les balises OG - Open Graph

Les balises OG (Open Graph) sont des balises HTML utilisées pour décrire le contenu d'une page web lorsque celle-ci est partagée sur les réseaux sociaux, notamment sur Facebook, Twitter et LinkedIn. Les balises OG permettent aux sites web de contrôler comment leur contenu est affiché et partagé sur les réseaux sociaux, en fournissant des informations telles que le titre, la description, l'image et le type de contenu.

Les balises OG sont importantes pour l'optimisation des réseaux sociaux (SMO) et peuvent aider à améliorer l'apparence et la visibilité des liens partagés sur les médias sociaux.


Elles sont également utilisées par les bots des réseaux sociaux pour récupérer les informations nécessaires à l'affichage du contenu partagé.

Les balises OG sont généralement incluses dans la section <head> de la page HTML d'un site web et sont définies avec les attributs meta. Voici quelques exemples de balises OG couramment utilisées :

  • <meta property="og:title" content="Titre de la page">
  • <meta property="og:description" content="Description du contenu">
  • <meta property="og:image" content="URL de l'image">
  • <meta property="og:url" content="URL de la page">


Rassure-toi bien sûr, sur ton site internet freelight', les balises OG sont automatiquement pré-remplies. Toutefois, pour plus de confort et afin d'optimiser la taille de l'image qui sera utilisée lors d'un partage sur les réseaux sociaux, nous mettons à ta disposition une administration te permettant de modifier facilement toi-même ces balises.


Bien connaitre ces balises OG


La balise OG-title

La taille idéale de ta balise OG-title dépend de plusieurs facteurs, notamment la longueur du titre de ta page et la façon dont tu veux que le titre apparaisse sur les réseaux sociaux. En général, il est recommandé de limiter la taille de ta balise OG-title à environ 60 caractères pour optimiser l'affichage sur les résultats de recherche et les réseaux sociaux.

Si ton titre est plus long que 60 caractères, les moteurs de recherche et les plateformes de médias sociaux peuvent tronquer le titre, ce qui peut rendre ton message moins clair et moins attractif. Par conséquent, il est conseillé de garder ta balise OG-title courte et percutante pour attirer l'attention des internautes et maximiser le taux de clics.


La balise OG-description

La balise og-description est utilisée pour fournir une brève description de ta page web ou de ton article sur les réseaux sociaux et les résultats de recherche. Elle permet aux internautes de comprendre rapidement de quoi traite ta page et peut les inciter à cliquer sur le lien pour en savoir plus.

Il est recommandé de limiter la taille de ta balise og-description à environ 155 caractères pour optimiser son affichage sur les résultats de recherche et les réseaux sociaux. Cela permet de s'assurer que la description ne sera pas tronquée et que les internautes pourront lire l'intégralité de la description.

Il est important de rédiger une description claire, concise et attrayante pour inciter les internautes à cliquer sur ton lien. N'hésite pas à inclure des mots-clés pertinents pour améliorer le référencement de ta page et à mettre en avant les avantages ou les points forts de ton contenu pour encourager les internautes à cliquer.


La balise OG-image

La taille idéale pour une image Open Graph dépend des recommandations spécifiques de la plateforme de médias sociaux sur laquelle vous prévoyez de partager votre contenu. Cependant, voici quelques conseils généraux pour la taille d'image recommandée pour les balises Open Graph :

  • Facebook : La taille recommandée pour une image Open Graph sur Facebook est de 1200 x 630 pixels, avec un rapport hauteur/largeur de 1,91:1.

  • Twitter : La taille recommandée pour une image Open Graph sur Twitter est de 1200 x 675 pixels.

  • LinkedIn : La taille recommandée pour une image Open Graph sur LinkedIn est de 1200 x 627 pixels.

Il est important de noter que ces recommandations sont sujettes à changement et qu'il est préférable de consulter les dernières directives de chaque plateforme de médias sociaux pour vous assurer que vos images Open Graph sont optimisées pour une expérience de partage optimale sur ces plateformes.


La balise OG-url

La balise "url" est utilisée pour spécifier l'adresse web complète (URL) de la page ou de l'article en question. Cette URL est utilisée par les moteurs de recherche et les plateformes de médias sociaux pour indexer et afficher le contenu en ligne. Elle est également utilisée par les navigateurs pour accéder à la page web.

Bien sûr, la balise "url" est autogénérée par ton systèmes de gestion de contenu freelight', et tu n'a donc pas à te soucier de la générer toi-mêmes.

adapte tes balises Open Graph

La balise OG-title

Cette balise est autogénérée à partir des données de ton site.

Par exemple, si nous parlons d'une page, le texte utilisé pour la balise og-title sera automatiquement le titre que tu as renseigné dans les paramètres de la page.

Si nous parlons d'un événement, alors le texte utilisé sera automatiquement le titre de l'événement que tu as renseigné.

En d'autres termes, tu n'as pas besoin de générer toi-même la balise "og-title" car elle est automatiquement créée à partir des informations que tu as fournies pour la page ou l'article en question.


La balise OG-description

Il en est exactement de même avec la balise og-description.

Par exemple, si nous parlons d'une page, le texte utilisé pour la balise og-description sera automatiquement la description courte que tu as renseignée dans les paramètres de la page.Si nous parlons d'une actualité, alors le texte utilisé pour la balise og-description sera automatiquement sa description courte.

Autrement dit, il n'est pas nécessaire que tu génères toi-même la balise "og-description", car elle sera créée automatiquement à partir des informations que tu as fournies pour la page ou l'article en question.

"environ 155 caractères pour optimiser son affichage sur les résultats de recherche et les réseaux sociaux"

La balise OG-image

Cette balise est susceptible d'être celle que tu modifieras le plus souvent. Si tu ne définis aucune image pour la balise Open Graph, par défaut il sera utilisé l'image 'OG image' que tu as renseignée dans ton administration 'Fiche freelight' => 'Images par défaut'.

Pour t'aider à effectuer cette tâche plus facilement, nous avons ajouté une icône d'administration spécialement dédiée à cette action. Tu pourras la trouver en haut de chaque page sous la section "Paramètre Open Graph image".


Préfère le JPG et pense à la compresser !!

Pour être sûr que l'image que tu souhaites voir apparaître soit correctement utilisée par les moteurs de recherche et les réseaux sociaux lorsque tu partages un lien, il est essentiel de respecter quelques directives générales :

  1. Résolution : Privilégie une résolution élevée pour une image nette et détaillée. Une résolution de 1200 x 630 pixels est souvent utilisée pour les images Open Graph, car elle est adaptée à la plupart des plateformes de médias sociaux.

  2. Format : Utilise des formats d'image courants tels que JPEG ou PNG. Le format JPEG est plus couramment utilisé car il offre une bonne qualité d'image avec une taille de fichier relativement petite.

  3. Taille du fichier : La taille du fichier de l'image devrait idéalement être inférieure à 1 Mo pour garantir un chargement rapide de la page.

  4. Ratio d'aspect : Le ratio d'aspect recommandé pour l'image Open Graph est de 1.91:1. Cela signifie que la largeur de l'image doit être environ 1,91 fois sa hauteur. Cela permettra d'éviter que l'image ne soit trop étirée ou trop compressée lorsqu'elle est affichée sur différentes plateformes.

  5. Compatibilité mobile : Assurez-vous que l'image est également adaptée aux appareils mobiles, car de nombreux utilisateurs consultent les réseaux sociaux et les sites Web sur leurs smartphones.

Design Section Editor

Tu peux adapter et modifier le design de chaque section pour trouver celui qui te convient le mieux. Dans […]

Bien nommer ses images

Pourquoi est-il préférable d'éviter les accents et les majuscules dans le nom des […]

Ponctuation & typographie

Cette section a pour but de vous expliquer comment écrire correctement un texte sur un ordinateur. […]

Convertir une image - Pourquoi ?

L'optimisation de vos images peut avoir un impact significatif sur le référencement de votre site web. […]

hashtag, c'est quoi ce truc ?

Un hashtag (mot-dièse en français) sert à catégoriser et regrouper des publications sur votre site web. […]

Personnalise ton profil en quelques clics !

Découvrez comment gérer et mettre à jour votre profil, vos photos et vos services sur les plateformes […]

Section Animate by freelight

Le module Animate de freelight te permet d'afficher des informations de manière animée sur […]

Configurer son adresse e-mail professionnelle

Cette ressource complète vous guidera pas à pas dans le processus de paramétrage de votre adresse e-mail […]

Section event version Next Time

Découvre en détail la toute nouvelle version de la section Next Time de notre module […]

Gère tes propres formulaires de contact

Tu veux savoir comment créer et gérer tes propres formulaires de contact ? Découvre comment dans ce tuto […]