Redimensionneur d'image OG en ligne
Créez des images Open Graph parfaitement dimensionnées pour Facebook, Twitter/X, LinkedIn et Discord. Redimensionnez et recadrez à 1200×630 ou à n'importe quelle taille de plateforme. Gratuit, pas d'inscription.
Déposez votre fichier iciAppuyez pour choisir votre fichier
ou
Supports M4A, WAV, FLAC, OGG, AAC, WMA, AIFF, OPUS • Max 100 MB
Comment créer une image OG
Télécharger ou capturer
Déposez votre image dans l'outil — une capture d'écran, une photo ou une image graphique. Ou saisissez l'URL d'un site pour capturer automatiquement une capture d'écran de n'importe quelle page Web.
Choisir la taille
Choisissez un préset de plateforme — Facebook 1200×630, Twitter 1200×628, LinkedIn ou Discord. L'image est recadrée au centre pour s'adapter aux dimensions exactes.
Télécharger
Cliquez sur Redimensionner et télécharger et obtenez votre image OG prête à l'emploi. Téléchargez-la sur votre site et référencez-la dans vos balises <meta>.
Tailles d'image OG pour chaque plateforme (2026)
Chaque plateforme a ses propres dimensions recommandées pour les images d'aperçu de lien. L'utilisation de la mauvaise taille entraîne un recadrage, du flou ou l'image n'apparaît pas du tout.
| Plateforme | Utilisation | Taille (px) | Ratio | Taille min | Fichier max |
|---|---|---|---|---|---|
| Partage de lien / og:image | 1200 × 630 | 1.91:1 | 600 × 315 | 8 MB | |
| Twitter / X | summary_large_image | 1200 × 628 | ~1.91:1 | 300 × 157 | 5 MB |
| Twitter / X | résumé (carré) | 800 × 800 | 1:1 | 144 × 144 | 5 MB |
| Lien partagé | 1200 × 627 | 1.91:1 | 200 × 200 | 5 MB | |
| Discord | Aperçu intégré | 1200 × 630 | 1.91:1 | — | 8 MB |
| Slack | Aperçu de lien | 1200 × 630 | 1.91:1 | — | — |
| Aperçu de lien | 1200 × 630 | 1.91:1 | 300 × 200 | — | |
| Telegram | Aperçu de lien | 1200 × 630 | 1.91:1 | — | 5 MB |
| Épingle riche | 1200 × 630 | 1.91:1 | — | — | |
| Extrait de recherche | 1200 × 630 | 1.91:1 | 1200 de large | — |
Conseil pratique : 1200 × 630 pixels fonctionne sur toutes les plateformes. Si vous ne créez qu'une seule image OG par page, utilisez cette taille. Pour les cartes de résumé Twitter spécifiquement, ajoutez une image carrée séparée de 800×800 via twitter:image.
Qu'est-ce que og:image ? (Balises Meta Open Graph)
og:image est une balise meta Open Graph qui indique aux plateformes sociales quelle image afficher lorsque quelqu'un partage un lien vers votre page. Sans cela, les plateformes essaient de détecter automatiquement une image — choisissant souvent la mauvaise, en utilisant un petit logo ou n'affichant rien du tout.
Comment fonctionne Open Graph
Facebook a créé le protocole Open Graph en 2010. Lorsqu'une URL est partagée sur les réseaux sociaux, l'explorateur de la plateforme récupère la page et lit les balises <meta property="og:..."> du <head>. La balise og:image spécifie l'URL de l'image d'aperçu.
Aujourd'hui, presque toutes les plateformes prennent en charge Open Graph : Facebook, Twitter/X (avec repli de twitter:image), LinkedIn, Discord, Slack, WhatsApp, Telegram, iMessage, Pinterest, et même Google pour les résultats de recherche enrichis.
Balises og:image essentielles
| Tag | Purpose |
|---|---|
og:image | URL de l'image d'aperçu (obligatoire, doit être une URL HTTPS absolue) |
og:image:width | Largeur de l'image en pixels (accélère le rendu — la plateforme n'a pas besoin de télécharger l'image en premier) |
og:image:height | Hauteur de l'image en pixels |
og:image:type | Type MIME : image/jpeg, image/png, ou image/webp |
og:image:alt | Texte alternatif pour l'accessibilité (lecteurs d'écran, échecs de chargement d'image) |
Pourquoi og:image est important pour le CTR
Les liens avec des images d'aperçu appropriées obtiennent 2 à 3 fois plus de taux de clic sur les réseaux sociaux par rapport aux liens sans images. Une image OG manquante ou cassée rend les liens partagés peu professionnels et réduit l'engagement. Google utilise également og:image pour les extraits d'articles dans certains résultats de recherche.
Comment ajouter og:image à votre site Web
Balises Meta HTML
Ajoutez ces balises à l'intérieur du <head> de votre page :
<meta property="og:image" content="https://example.com/og-image.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:type" content="image/jpeg">
<meta property="og:image:alt" content="Description of the image">
<!-- Also include these for complete previews -->
<meta property="og:title" content="Your Page Title">
<meta property="og:description" content="Your page description">
<meta property="og:url" content="https://example.com/page">Balises Twitter Card
Twitter utilise ses propres balises de carte mais replie vers og:image si twitter:image est absent :
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://example.com/og-image.jpg">
<meta name="twitter:title" content="Your Page Title">
<meta name="twitter:description" content="Your page description">WordPress
Les plugins SEO comme Yoast, Rank Math et All in One SEO gèrent les balises OG automatiquement. Définissez le champ « Image sociale » ou « Image Facebook » dans l'éditeur de publication. Téléchargez une image 1200×630 spécifiquement pour le partage — ne comptez pas sur l'image mise en avant, qui pourrait avoir un rapport d'aspect différent.
Next.js (App Router)
// app/page.tsx
export const metadata = {
openGraph: {
title: 'Your Page Title',
description: 'Your page description',
images: [{
url: 'https://example.com/og-image.jpg',
width: 1200,
height: 630,
alt: 'Description of the image',
}],
},
twitter: {
card: 'summary_large_image',
images: ['https://example.com/og-image.jpg'],
},
};Vérification de votre image OG
Après avoir ajouté les balises meta, testez avec ces débogueurs de plateforme :
- Facebook : Sharing Debugger (developers.facebook.com/tools/debug/) — cliquez sur « Scrape Again » pour actualiser le cache
- Twitter : Card Validator (cards-dev.twitter.com/validator)
- LinkedIn : Post Inspector (linkedin.com/post-inspector/)
- Général : opengraph.xyz — teste toutes les plateformes à la fois
Problèmes courants avec og:image (et comment les résoudre)
L'image n'apparaît pas lors du partage
Causes : balise meta og:image manquante, l'URL de l'image renvoie 404, l'image est trop petite (moins de 200×200), ou votre robots.txt bloque les explorateurs des réseaux sociaux. Corriger : vérifiez que l'URL de l'image se charge dans un navigateur, assurez-vous que c'est une URL HTTPS absolue, et vérifiez que votre serveur ne bloque pas l'agent utilisateur de la plateforme.
La mauvaise image apparaît
Les plateformes mettent en cache les images OG agressivement (24+ heures). Après avoir mis à jour votre og:image, utilisez l'outil de débogage de la plateforme pour forcer une réextraction. Pour Facebook, ouvrez le Sharing Debugger et cliquez sur « Scrape Again ». Vous pouvez également ajouter un paramètre de suppression du cache à l'URL : ?v=2.
L'image est recadrée mal
Les dimensions de votre image ne correspondent pas au rapport d'aspect attendu par la plateforme. Corriger : redimensionnez à 1200×630 et gardez le contenu important (texte, logos, visages) dans les 80% centraux de l'image. Différentes plateformes recadrent légèrement différemment aux bords.
L'image semble floue
L'image source est trop petite ou fortement compressée. Utilisez au moins 1200 pixels de large. Pour les écrans rétine, envisagez 2400×1260 (2x). Enregistrez en qualité JPG 80+ ou utilisez PNG pour les graphiques avec un texte net.
Fonctionne sur Facebook mais pas sur Twitter
Twitter nécessite la présence de la balise meta twitter:card. Sans elle, Twitter peut ne pas afficher d'image même si og:image est défini. Ajoutez <meta name="twitter:card" content="summary_large_image"> pour activer les cartes image grande.
Liste de vérification des meilleures pratiques d'og:image
og:image:width et og:image:height (accélère le rendu)og:image:alt pour l'accessibilitéQuestions fréquemment posées
og:image:width et og:image:height afin que les plateformes puissent afficher l'aperçu plus rapidement sans télécharger l'image complète en premier. og:image est manquante, l'URL de l'image renvoie un 404, l'image est plus petite que 600×315 pixels, ou votre robots.txt bloque l'explorateur de Facebook. Utilisez le Facebook Sharing Debugger (developers.facebook.com/tools/debug/) pour diagnostiquer le problème. Cliquez sur « Scrape Again » pour forcer Facebook à récupérer à nouveau votre page et effacer l'aperçu mis en cache. og:image ne soit pas un facteur direct de classement Google, les pages avec des images OG appropriées obtiennent 2 à 3 fois plus de taux de clic lorsqu'elles sont partagées sur les réseaux sociaux, entraînant plus de trafic et de signaux d'engagement. Google utilise également og:image pour les extraits d'articles enrichis dans certains résultats de recherche. <head> de votre page : <meta property="og:image" content="https://yoursite.com/image.jpg">. Incluez également og:image:width (1200) et og:image:height (630) pour un rendu plus rapide. Dans WordPress, utilisez le champ d'image sociale de Yoast ou Rank Math. Dans Next.js, utilisez l'export metadata dans votre composant de page. API OG Image Resizing
Exécutez og image resizing par programmation via l'API REST — gratuit, sans inscription, réponses JSON.
curl -X POST https://cleverutils.com/api/v1/tools/og-image-resizer \
-F "file=@your-file"