Softonic

Aperçu Open Graph

Étape 1 / 2
Suivant

Saisissez votre titre, votre description, le nom du site, l’URL de la page et l’URL de l’image, et cet outil rend en direct une carte de partage Facebook et X (Twitter) qui se met à jour à chaque frappe. C’est un bac à sable de conception pour vos balises Open Graph : rien n’est récupéré ni publié, vous pouvez donc répéter la longueur du titre et le cadrage de l’image jusqu’à ce que la carte soit correcte, puis copier le texte dans vos vraies balises og:.

Comment l'aperçu est assemblé

  1. 1

    Saisissez les champs de la carte

    Titre, nom du site, description, URL de la page et URL de l'image. Chaque champ correspond à une balise og:.

  2. 2

    Regardez les cartes se mettre à jour

    Les maquettes Facebook et X se recomposent à mesure que vous tapez, en utilisant la mise en page et la troncature réelles de chaque plateforme.

  3. 3

    Ajoutez une URL d'image

    Collez une adresse d'image https absolue pour voir le cadrage ; laissez-la vide et la carte Facebook affiche un espace réservé.

  4. 4

    Copiez dans vos balises og:

    Quand la carte se lit bien, reportez le même titre, la même description et la même image dans les balises méta de votre page.

Ce que devient chaque champ

Champ Balise Open Graph Affiché dans la carte
Titre og:title Titre en gras, tronqué à une ligne
Description og:description Sous-titre gris, limité à deux lignes
Nom du site og:site_name Petit libellé au-dessus du titre Facebook
URL og:url Le domaine est affiché ; le host le détermine
URL de l’image og:image Cadrée en 1.91:1 sur les deux cartes

L’outil extrait le host de l’URL que vous saisissez, donc https://blog.example.com/post affiche blog.example.com sur la carte.

Les deux cartes et en quoi elles diffèrent

  • Facebook affiche l’image cadrée en 1.91:1, puis le domaine en petites capitales, le titre en gras sur une ligne et la description sur deux lignes au maximum. Sans URL d’image, elle rend un espace réservé gris, ce qui est de loin la cause la plus fréquente d’un partage plat et sans image dans la nature.
  • X (Twitter) affiche une carte summary_large_image aux coins arrondis : l’image cadrée en 2:1, le domaine, le titre et la description en dessous.

Faire tenir le texte

  • Titre : visez 60 à 70 caractères. Facebook coupe autour de 88 et X autour de 70, donc un titre en dessous de 70 reste entier partout.
  • Description : gardez-la sous environ 160 caractères ; la carte se limite à deux lignes et le reste est supprimé.
  • Image : concevez-la en 1200 x 630 px pour que le cadrage 1.91:1 soit net, et hébergez-la sur une URL https:// absolue. Un chemin relatif ne se chargera pas une fois les balises en ligne.
  • Nom du site : court et limité à la marque, sans slogan. Il se place au-dessus du titre comme un libellé.

Liste de contrôle du jour de publication

  • [ ] Titre sous 70 caractères
  • [ ] Description sous 160 caractères
  • [ ] L’URL de l’image est absolue (https, pas // ni un chemin relatif)
  • [ ] Image conçue en 1200 x 630 px, JPG ou PNG
  • [ ] L’URL correspond à la canonique que vous allez publier
  • [ ] Texte copié dans les vraies balises og:, puis vérifié avec un vérificateur

Questions fréquentes

Non. Vous saisissez les champs de la carte à la main et l’outil maquette leur apparence. C’est un bac à sable de conception, pas un scraper, il fonctionne donc aussi avant la mise en ligne de la page. Pour lire les balises déjà présentes sur une page, collez plutôt le HTML de cette page dans le Vérificateur Open Graph.

Une carte Facebook et une carte à grande image X (Twitter). Elles utilisent les mêmes valeurs Open Graph, donc une carte qui se lit bien ici est un bon indicateur pour LinkedIn, Slack, Discord et d’autres applications qui déploient les liens à partir des mêmes balises og:, chacune avec des limites légèrement différentes.

Parce que le champ image est vide, ou que l’URL collée n’est pas une adresse https absolue fonctionnelle. Ajoutez une URL d’image https complète et le cadrage apparaît aussitôt. Lors de la mise en ligne, gardez le fichier sous 5 Mo et servez-le avec un content-type public image/*.

Chaque plateforme tronque à un point différent (Facebook près de 88 caractères, X près de 70), et la maquette le reproduit. Réduisez le titre à 60-70 caractères et il restera entier sur toutes les plateformes.

Outils similaires

Vérificateur de longueur de méta description

Mesurez une méta description en caractères et en pixels estimés, comparez des repères éditoriaux et examinez des maquettes pour ordinateur et mobile.

Générateur de schéma FAQ

Générez un balisage JSON-LD FAQPage à partir de paires de questions et réponses pour être éligible aux résultats enrichis de Google et aux placements dans les boîtes de réponse.

Vérificateur d'URL canonique

Collez le HTML d'une page et vérifiez sa balise rel=canonical : est-elle présente, est-ce une URL absolue valide, correspond-elle à l'URL de la page ?

Simulateur de SERP Google

Prévisualisez un snippet approximatif de style Google avec des limites de caractères sur mobile et ordinateur. Votre brouillon reste dans cette session du navigateur.

Validateur de sitemap XML

Vérifiez dans votre navigateur les erreurs de syntaxe, les URL absentes ou dupliquées et les valeurs courantes d'un sitemap XML.

Compteur de fréquence des mots

Repérez les mots les plus répétés dans un texte avec leurs occurrences et leur densité. Utile pour la relecture, le SEO et les audits de contenu.

Outil disponible dans d’autres langues