Quelle est la taille idéale d’un logo en 2026 ? (Site web + Réseaux sociaux)

80 % des logos WordPress que j’audite sont mal dimensionnés.
Soit trop lourds (> 200 Ko, pénalité Core Web Vitals immédiate), soit trop petits (pixellisés sur écrans Retina), soit dans le mauvais format (JPEG là où il faut du SVG). Ce guide donne les dimensions exactes, les formats à privilégier en 2026, et les pièges techniques à éviter basé sur plus de 100 projets WordPress livrés depuis 2015.

Dimensions logo site web

Un logo de site web doit s’adapter à trois emplacements techniques : le header (en-tête), le favicon (icône navigateur), et parfois le footer (pied de page).

Logo header (en-tête de site)

Dimensions standard :

• Desktop : 250-300 pixels de largeur × 70-100 pixels de hauteur
• Mobile : 150-200 pixels de largeur × 50-70 pixels de hauteur
  

Écrans haute densité (Retina, 4K) :

• Doublez les dimensions : 500-600 × 140-200 pixels
• Le navigateur affichera automatiquement l’image réduite, mais avec une netteté parfaite
  

Format recommandé : SVG (vectoriel) ou PNG optimisé (< 50 Ko).

Pourquoi ces dimensions ?

Un logo trop grand ralentit le chargement de votre page (pénalité Core Web Vitals), un logo trop petit nuit à la lisibilité sur mobile.
Sur mes projets WordPress chez Adekoite, je standardise à 280 × 80 pixels pour le header, ce qui garantit un équilibre parfait entre visibilité et performance.

WordPress supporte nativement le format SVG depuis la version 5.0, mais de nombreux thèmes bridés ou mal configurés bloquent son upload par sécurité. Si vous envisagez une refonte de site internet, je m’assure que votre installation WordPress accepte les SVG (via plugin sécurisé ou whitelist serveur) et que vos logos s’affichent correctement sur tous les navigateurs.

Favicon (icône navigateur)

Dimensions 2026 :

• Minimum : 32 × 32 pixels (le 16×16 est obsolète sur écrans Retina)
• Recommandé : Fichier ICO multi-résolution contenant 16px, 32px et 48px
• Moderne : Favicon SVG (scalable, ultra-léger < 5 Ko)

Format : ICO (standard universel) ou SVG (navigateurs récents).

Note technique : le format ICO permet d’embarquer plusieurs résolutions dans un seul fichier (16/32/48px), ce qui évite la pixellisation selon le contexte d’affichage (onglet, favoris, barre d’adresse).

Logo footer (pied de page)

Dimensions : 120-150 pixels de largeur × 40-60 pixels de hauteur (généralement 50% plus petit que le header).

Format : SVG ou PNG optimisé.
Image de partage social (Open Graph) : lorsque vous partagez un lien sur Facebook, LinkedIn ou WhatsApp, ces plateformes affichent une image de prévisualisation.​
Dimensions : 1200 × 628 pixels (ratio 1.91:1)
Format : PNG ou WebP (< 300 Ko)
Balise HTML : <meta property="og:image" content="url-image.png" />

Les balises Open Graph font partie du SEO technique on-page. Lors d’un audit SEO WordPress, je vérifie systématiquement que vos images de partage social (og:image) sont correctement déclarées, dimensionnées (1200×628px) et compressées. Un bon paramétrage Open Graph améliore votre CTR sur les réseaux sociaux de 30 à 50%.

Taille idéale d’un header de site web : tableau récapitulatif

Emplacement	Dimensions standard	Écrans Retina (@2x)	Format	Poids max
Header desktop	250-300 × 70-100 px	500-600 × 140-200 px	SVG ou PNG	< 50 Ko
Header mobile	150-200 × 50-70 px	300-400 × 100-140 px	SVG ou PNG	< 50 Ko
Favicon	32 × 32 px	ICO 16/32/48 px	ICO ou SVG	< 10 Ko
Footer	120-150 × 40-60 px	240-300 × 80-120 px	SVG ou PNG	< 50 Ko
Open Graph	1200 × 628 px	—	PNG ou WebP	< 300 Ko

Dimensions logo réseaux sociaux (Guide 2026)

Les réseaux sociaux imposent des contraintes techniques strictes. Voici les dimensions officielles mises à jour pour 2026.​

Facebook / Meta

Photo de profil : 400 × 400 pixels minimum (affichée 170×170, mais uploadée en haute résolution pour éviter la compression algorithmique).​
Photo de couverture : 820 × 312 pixels.
Image partagée (lien) : 1200 × 628 pixels (Open Graph).
Format : PNG ou JPG (< 2 Mo).

Instagram

Photo de profil : 320 × 320 pixels minimum (affichée 110×110).​
Post carré : 1080 × 1080 pixels.
Post vertical : 1080 × 1350 pixels (ratio 4:5).
Story / Reels : 1080 × 1920 pixels (ratio 9:16).
Format : JPG ou PNG (< 8 Mo).

LinkedIn

Photo de profil (personnel) : 400 × 400 pixels.​
Bannière profil : 1584 × 396 pixels.
Logo page entreprise : 300 × 300 pixels.
Image post : 1200 × 627 pixels.
Format : PNG (transparence) ou JPG.

YouTube

Photo de profil (chaîne) : 800 × 800 pixels.​
Bannière chaîne : 2560 × 1440 pixels (zone sûre visible sur tous appareils : 1546×423 pixels).
Vignette vidéo : 1280 × 720 pixels (ratio 16:9).
Format : JPG ou PNG (< 6 Mo pour bannière).

Twitter / X

Photo de profil : 400 × 400 pixels.​
Bannière : 1500 × 500 pixels.
Image tweet : 1200 × 675 pixels (ratio 16:9) ou 1200 × 628 (Open Graph).
Format : PNG, JPG ou GIF (< 5 Mo).

TikTok

Photo de profil : 200 × 200 pixels minimum.​
Vidéo (ratio optimal) : 1080 × 1920 pixels (9:16 vertical plein écran).
Format : JPG ou PNG pour profil.

Quel format de fichier choisir pour votre logo ?

Le choix du format impacte directement la qualité visuelle, le poids du fichier et la performance de votre site.​

SVG (Scalable Vector Graphics) : Format recommandé 2026

Définition : Format vectoriel (basé sur des formules mathématiques, pas sur des pixels).
​

Avantages :

• Zéro perte de qualité quel que soit le zoom ou la taille d’affichage
• Poids ultra-léger : 5-15 Ko en moyenne (vs 50-150 Ko pour PNG)
• Modifiable en CSS (changement de couleur, animation)
• Compatible 98% des navigateurs (Chrome, Firefox, Safari, Edge)
  

Inconvénients :

• Ne convient pas aux logos complexes avec photos ou dégradés subtils
• Nécessite un export propre depuis Illustrator, Figma ou Inkscape

Usage recommandé : Logo header site web, footer, email signature.​

Mon conseil (Adekoite) : Sur tous mes projets WordPress, j’exporte les logos en SVG. Cela divise le poids par 10 et garantit une netteté parfaite sur écrans 4K, tablettes et mobiles.

PNG (Portable Network Graphics) — Standard universel

Avantages :

• Transparence alpha (fond transparent)
• Compression sans perte (qualité préservée)
• Compatibilité 100% (tous navigateurs, réseaux sociaux, print)

Inconvénients :

• Poids élevé (30-150 Ko selon complexité)
• Format bitmap : pixellisation au zoom

Usage recommandé : Favicon (si pas ICO), logos complexes (dégradés, ombres portées), réseaux sociaux.​

Compression obligatoire : Utilisez TinyPNG, Squoosh ou ImageOptim pour réduire le poids de 60-80% sans perte visuelle. Visez < 100 Ko.

L’optimisation des images (logos, photos, icônes) représente 40% des gains de performance sur un site WordPress. Si votre site e-commerce WooCommerce affiche des dizaines de logos partenaires ou certifications, la compression automatique (via plugin Imagify ou ShortPixel) devient indispensable pour maintenir un temps de chargement compétitif.

WebP — Format moderne haute compression

Avantages :

• 30% plus léger que PNG à qualité visuelle identique
• Transparence alpha
• Support navigateurs modernes (Chrome, Firefox, Edge, Safari iOS 14+)

Inconvénients :

• Nécessite un fallback PNG pour Safari < iOS 14
• Moins universel que PNG pour le print

Usage recommandé : Images Open Graph (partage social), logos e-commerce, sites à fort trafic mobile.

Outil de conversion : Squoosh.app (Google), Cloudflare Polish, plugins WordPress (ShortPixel, Imagify).

ICO (Icon) — Standard favicon

Avantages :

• Multi-résolution : embarque 16px, 32px et 48px dans un seul fichier
• Compatibilité navigateurs anciens (IE, Edge Legacy)

Inconvénients :

• Usage limité au favicon uniquement
• Taille fixe (pas scalable comme SVG)

Usage recommandé : Favicon site web.​
Générateur en ligne : Favicon.io, RealFaviconGenerator, Favicon Generator (gratuits).

Récapitulatif : quel format pour quel usage ?

Usage	Format prioritaire	Format alternatif	Poids cible
Logo header site	SVG	PNG optimisé	< 15 Ko (SVG) / < 100 Ko (PNG)
Favicon	ICO (16/32/48px)	SVG ou PNG 32px	< 10 Ko
Réseaux sociaux	PNG	WebP	< 300 Ko
Open Graph (partage)	WebP	PNG	< 200 Ko
Email signature	PNG	SVG (si client mail compatible)	< 50 Ko
Print (flyer, carte)	PDF vectoriel	PNG 300 DPI	—

⚠️ Les 3 erreurs que je vois sur 80 % des sites WordPress que j’audite

Erreur 1 : Logo JPEG sur le header

Le JPEG est un format de photo, pas de logo. Compression destructrice (artefacts visibles autour des bords), pas de transparence. Si votre logo est en JPEG sur votre site, vous perdez en crédibilité visuelle dès le 1er regard du visiteur.
→À faire : convertir en SVG (si logo vectoriel) ou PNG transparent (si logo bitmap).

Erreur 2 : Logo PNG non compressé

Un logo PNG brut sorti de Photoshop pèse souvent 200-500 Ko.
Sur un site avec 5 pages, ce poids cumule et plombe le score Lighthouse Performance.
→ À faire : compresser avec TinyPNG ou Squoosh (réduction de 70 à 90 % sans perte visuelle). Cible : < 50 Ko.

Erreur 3 : Favicon en 16 × 16 px uniquement

Le 16 × 16 px est obsolète depuis 2018.
Sur iPhone, MacBook, écrans 4K, votre favicon apparaît flou et pixellisé.
→ À faire : ICO multi-résolution (16/32/48 px) OU favicon SVG.

Ces 3 corrections prennent 15 minutes et gagnent typiquement 8-12 points au score Lighthouse Performance.

Pourquoi la taille du logo impacte vos conversions

Au-delà du critère visuel pur, votre logo a un impact mesurable sur vos conversions.

Sur le site :

• Un logo trop grand (> 100 px de haut) écrase le hero et repousse le CTA principal sous la ligne de flottaison
• Un logo flou (pixellisé Retina) réduit la confiance perçue de 15 à 20 % selon une étude Nielsen Norman Group
• Un logo qui ralentit le LCP (poids > 100 Ko) augmente le taux de rebond mobile de 5 à 10 %

Sur les partages sociaux :

• Une image Open Graph mal dimensionnée (≠ 1200 × 628 px) est automatiquement recadrée par Facebook/LinkedIn, souvent en coupant le texte ou le logo
• Une image Open Graph optimisée (WebP < 200 Ko) booste le CTR des partages de 30 à 50 %.
  

Sur mes derniers projets de refonte WordPress, l’optimisation du logo et des images Open Graph représente 8 à 12 % de gain sur le taux de conversion global (formulaire de contact, prise de RDV).

FAQ : Taille et format logo (2026)

Quelle taille de logo pour un site WordPress ?

250-300 pixels de largeur × 70-100 pixels de hauteur pour le header desktop. Pour les écrans Retina (MacBook, iPhone), doublez les dimensions (500×200px) et compressez le fichier en SVG ou PNG optimisé (< 100 Ko). Le format SVG est recommandé car vectoriel et ultra-léger (5-15 Ko).

La taille du logo se définit dans le cadre plus large de la conception graphique du site. Pour intégrer votre identité visuelle dans un site vitrine WordPress, voir la page service. Si vous vous demandez combien coûte un site vitrine WordPress en 2026, sachez que l’optimisation des logos (export multi-format, compression, responsive) est incluse dans mes prestations dès 1 500 € HT.

Favicon : 16×16 ou 32×32 pixels ?

32×32 pixels minimum en 2026. Idéalement, utilisez un fichier ICO multi-résolution (16/32/48px dans un seul fichier) ou un favicon SVG pour une qualité parfaite sur tous écrans. Le 16×16 est obsolète sur écrans haute densité (Retina, 4K, tablettes).​

PNG ou SVG pour un logo de site web ?

SVG est préférable pour 98% des cas : vectoriel (zéro pixellisation au zoom), poids 5-15 Ko (vs 50-150 Ko pour PNG), modifiable en CSS. Utilisez PNG uniquement pour logos complexes (photos, dégradés subtils) ou si contraintes techniques (CMS ancien). Compressez toujours avec TinyPNG ou Squoosh (visez < 100 Ko).​

Quelle taille de logo pour partage Facebook/LinkedIn ?

1200 × 628 pixels (ratio 1.91:1), format PNG ou WebP (< 300 Ko). C’est la dimension Open Graph standard affichée lors du partage de lien sur Facebook, LinkedIn, Twitter/X. Ajoutez la balise HTML <meta property="og:image" content="url-image.png" /> dans le <head> de vos pages.
​

Comment optimiser le poids d’un logo pour la performance web ?

Ciblez < 100 Ko maximum pour le header. Utilisez SVG pour logos simples (5-15 Ko), PNG compressé avec TinyPNG ou Squoosh pour logos complexes (30-80 Ko), et WebP pour images réseaux sociaux (30% plus léger que PNG). Vérifiez l’impact avec Google PageSpeed Insights (score Core Web Vitals).​

Mon logo s’affiche pixellisé sur iPhone/MacBook, pourquoi ?

Votre logo est probablement en 72 DPI (résolution écran standard) alors que les écrans Retina affichent en 144-220 DPI. Solution : exportez votre logo en dimensions doubles (ex : 600×200px au lieu de 300×100px) ou utilisez un SVG (vectoriel, donc toujours net).

Quelle différence entre logo et favicon ?

Le logo est l’identité visuelle complète de votre marque, affichée dans le header de votre site (250-300 × 70-100 px). Le favicon est une mini-icône carrée (32 × 32 px) affichée dans l’onglet du navigateur, les favoris et les raccourcis mobiles. Les deux doivent être cohérents visuellement mais ne sont pas interchangeables.

Mon logo doit-il avoir un fond transparent ?

Oui pour la majorité des cas. Format PNG (transparence alpha) ou SVG. Un fond transparent permet d’afficher votre logo sur n’importe quel fond (header sombre, hero coloré, signature email, etc.) sans rectangle blanc disgracieux. Évitez le JPEG qui ne supporte pas la transparence.

Combien coûte la création d’un logo en 2026 ?
Pour un logo simple (typographique ou pictogramme épuré) : 300 à 600 € HT chez un graphiste freelance.
Pour un logo complet avec charte graphique (déclinaisons, guidelines, formats multiples) : 800 à 2 500 € HT.
Sur mes projets de création de site WordPress, je travaille avec ma graphiste partenaire pour produire les logos et déclinaisons techniques optimisées (SVG, PNG, ICO, WebP).

Besoin d'intégrer votre logo sur un site WordPress performant ?

Chez Adekoite, j'intègre vos logos au format optimal (SVG header, ICO favicon, PNG/WebP réseaux sociaux) en respectant les standards de performance Google (Core Web Vitals, score Lighthouse 90+). C'est que j'ai fait sur plusieurs site, notemment lors de la création du site WordPress d'une agence immobilière Laforêt.

Mes services :

• Création de site vitrine WordPress (dès 1 500 € HT)
• Création de site e-commerce WooCommerce
• Refonte complète de site
• Optimisation performance et SEO technique
• Formation à la gestion de votre site WordPress

Cet article reflète mon expertise terrain acquise sur 100+ sites WordPress livrés depuis 2015. Les dimensions et formats recommandés sont testés et validés sur des projets réels.