Open Graph / Twitter Card / Vérificateur d’aperçu social
Générez, inspectez et prévisualisez les meta tags Open Graph au même endroit
Saisissez une URL et OpenGraphy récupère le HTML côté serveur, analyse Open Graph et Twitter Card, affiche les cartes sociales et propose des corrections.
Vérifiez l’aperçu avant publication
Rendez vos liens cohérents, clairs et attractifs sur Facebook, LinkedIn, Slack et les applications de messagerie.
Conçu pour les endroits où les liens circulent réellement
Récupération sûre, analyse précise, aperçus fiables
OpenGraphy ne récupère pas les sites depuis le navigateur. Le backend simule un crawler et vérifie DNS, redirections, réseaux privés, HTML initial et images.
Protection SSRFChaque requête valide DNS, plages IP et redirections afin d’éviter localhost, réseaux privés et adresses réservées.
Cache de 4 heuresLa metadata et les aperçus sont temporairement stockés dans Redis sans historique long ni données personnelles.
DiagnosticsBalises manquantes, images relatives, taille d’image, statut HTTP, longueur du titre et de la description sont vérifiés.
Transformez chaque partage en emplacement marketing soigné
Open Graph est le langage commun utilisé par les plateformes sociales et messageries pour lire les aperçus de page.
Qu’est-ce qu’Open Graph ?
Les balises OG sont de la metadata pour crawlers. Beaucoup de plateformes lisent og:title, og:description et og:image pour créer un aperçu.
Taille d’image recommandée
La taille la plus sûre est 1200 x 630, ratio environ 1.91:1. Les images légères s’affichent plus vite dans les messageries.
Pourquoi récupérer côté backend ?
La plupart des crawlers n’exécutent pas JavaScript et n’attendent pas les SPA. La récupération serveur reflète mieux ce qu’ils voient.
Balises Open Graph minimales utiles
Commencez par title, description, image et URL canonique. Cela résout la plupart des aperçus cassés.
<meta property="og:title" content="你的頁面標題" />
<meta property="og:description" content="一段清楚、有吸引力的頁面摘要。" />
<meta property="og:image" content="https://example.com/preview.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:url" content="https://example.com/page" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Example" />
<meta name="twitter:card" content="summary_large_image" />
Chaque plateforme interprète la même metadata différemment
Facebook s’appuie sur og:title, og:description et og:image. Après modification, utilisez Sharing Debugger pour déclencher une nouvelle récupération.
X / Twitter
X peut se rabattre sur la metadata OG, mais twitter:card et twitter:image rendent les grandes cartes image plus fiables.
LinkedIn met souvent en cache la première récupération. Vérifiez avant publication puis rafraîchissez avec Post Inspector.
WhatsApp / iMessage
Les images trop lourdes échouent ou sont recadrées plus souvent. Compressez-les et indiquez largeur et hauteur.
Discord / Slack / Telegram
Les apps de chat préfèrent la metadata présente dans le HTML initial du serveur. Ne dépendez pas seulement du JavaScript frontend.
Pinterest / Reddit
Pour ecommerce, portfolios et articles, préparez aussi des variantes carrées ou verticales en plus de l’image large.
Intégration dans les stacks courantes
Next.js / Nuxt / Astro
Utilisez l’API metadata du framework ou SSR/SSG afin que les balises OG soient présentes dans le HTML serveur.
WordPress
Utilisez un plugin SEO ou le hook head du thème pour sortir titre, extrait, image mise en avant et lien canonique.
Applications SPA
Si tout est rendu côté client, beaucoup de crawlers manqueront la metadata. Ajoutez SSR, prérendu ou HTML statique pour les pages partagées.
FAQ
Open Graph influence-t-il directement le classement SEO ?
En général non comme facteur direct, mais il améliore les clics sociaux, la qualité des partages, le trafic, les citations et la visibilité.
Pourquoi l’ancienne image s’affiche encore ?
Les plateformes mettent les récupérations en cache. Utilisez Facebook Sharing Debugger ou LinkedIn Post Inspector, et versionnez l’URL de l’image si besoin.
Que se passe-t-il sans balises OG ?
Les plateformes devinent depuis title, meta description ou la première grande image. Le résultat est imprévisible.
La casse des balises compte-t-elle ?
Oui. Utilisez les noms standard en minuscules comme og:title, pas OG:Title. Beaucoup de crawlers sont stricts.