Tailles de favicon expliquées (16–256) : que inclure dans favicon.ico
Sachez exactement quelles tailles d'icônes appartiennent à votre favicon.ico et pourquoi chacune compte
Convertir maintenantOù les favicons apparaissent réellement
La plupart des gens pensent aux favicons comme les petites icônes dans les onglets du navigateur, mais ils apparaissent dans bien plus d'endroits que cela. Comprendre chaque contexte vous aide à choisir quelles tailles inclure pour que votre icône semble toujours nette.
Les onglets de navigateur sont l'emplacement le plus visible. Chaque onglet ouvert affiche votre favicon à environ 16 pixels, ce qui en fait le principal moyen pour les utilisateurs d'identifier votre site lorsque de nombreux onglets sont ouverts. Les barres de signets et menus affichent également votre icône à 16 pixels dans la plupart des navigateurs, donc une version nette à cette taille est non négociable.
Les barres d'adresse et suggestions de recherche dans certains navigateurs montrent le favicon à côté de l'URL, généralement à 16 ou 32 pixels selon la densité d'affichage. Les panneaux d'historique se comportent de manière similaire, extrayant le favicon pour aider les utilisateurs à scanner les sites précédemment visités.
Au-delà du navigateur, les favicons apparaissent également dans des contextes de système d'exploitation. Lorsqu'un utilisateur épingle votre site à la barre des tâches Windows ou crée un raccourci bureau, le système d'exploitation extrait du fichier ICO et peut rendre l'icône à 48, 64 ou même 256 pixels. Sur les écrans haute résolution (classe Retina), une icône 32 pixels peut être étirée pour remplir un espace qui demande plus de détails, produisant un résultat flou à moins qu'une variante plus grande n'existe à l'intérieur de l'ICO.
Les applications web progressives (PWA) utilisent leurs propres icônes de manifeste plutôt que favicon.ico, mais le favicon compte toujours comme secours pour le chrome de navigateur standard et pour les utilisateurs qui mettent le site en signet sans installer la PWA.
À quoi sert chaque taille de favicon
Chaque dimension de pixel sert un objectif distinct. Le tableau ci-dessous mappe chaque taille de favicon standard à son utilisation courante et indique si vous devez l'inclure.
| Taille (px) | Utilisation courante | Inclure ? |
|---|---|---|
| 16 × 16 | Onglets de navigateur, barre de signets, barre d'adresse, historique | Oui — requis |
| 32 × 32 | Onglets de navigateur haute résolution, barre des tâches Windows, Safari macOS | Oui — requis |
| 48 × 48 | Raccourcis épinglés Windows, Explorateur Windows | Oui — recommandé |
| 64 × 64 | Certaines surfaces UI Windows, lecteurs RSS | Optionnel |
| 128 × 128 | Vue grande icône Windows, Chrome Web Store | Optionnel |
| 256 × 256 | Vue extra-large Windows, raccourcis bureau haute résolution | Recommandé pour complétude |
16 et 32 pixels sont les essentiels absolus. Sans eux, les navigateurs reviennent à un globe générique ou une icône vide, ce qui nuit à la reconnaissance de marque. Ces deux tailles couvrent pratiquement tous les scénarios d'onglets de navigateur en résolution standard et haute.
48 pixels entre en jeu lorsque les utilisateurs créent des raccourcis Windows vers votre site. Le système d'exploitation rend les raccourcis bureau à 48 pixels dans la vue d'icône par défaut, donc inclure cette taille empêche le système d'exploitation d'agrandir maladroitement la variante 32 pixels.
64 et 128 pixels apparaissent dans des contextes de niche. Certaines surfaces UI Windows et applications tierces demandent une icône 64 pixels, tandis que 128 pixels est utilisé par le Chrome Web Store et certaines vues de grandes icônes. Les inclure n'ajoute que quelques kilooctets au fichier ICO, donc le compromis est minimal.
256 pixels compte surtout sur les moniteurs haute résolution. Lorsque Windows rend une vue d'icône extra-large ou qu'un utilisateur épingle votre site à la barre des tâches sur un écran 4K, le système d'exploitation peut extraire la variante 256 pixels pour le rendu le plus net possible.
L'ensemble sûr recommandé
Si vous voulez un seul favicon.ico qui couvre la gamme la plus large de contextes sans encombrement inutile, utilisez cet ensemble sûr :
- 16 px — onglets et signets de navigateur
- 32 px — onglets haute résolution et barre des tâches Windows
- 48 px — raccourcis bureau Windows
- 256 px — haute résolution et vues d'icônes extra-larges
Cet ensemble de quatre tailles garde le fichier ICO compact (généralement moins de 30 Ko) tout en garantissant un rendu net dans chaque contexte majeur. Vous pouvez ajouter 64 et 128 pixels si votre cas d'utilisation le demande, mais la plupart des sites web ne remarqueront jamais de différence.
Si vous construisez un favicon purement pour le web et ne vous attendez pas à ce que les utilisateurs créent des raccourcis bureau, vous pouvez réduire l'ensemble à seulement 16 et 32 pixels. Cela produit un fichier ICO bien en dessous de 10 Ko. Cependant, le coût d'inclure 48 et 256 est si faible que nous recommandons l'ensemble sûr complet comme défaut pour presque tous les projets.
Pour un aperçu plus large du fonctionnement du format ICO et quand c'est le bon choix par rapport à PNG, consultez notre explication sur qu'est-ce qu'un fichier ICO.
Comment générer les bonnes tailles de favicon
Créer un favicon.ico multi-tailles ne prend que quelques étapes avec Any2ICO. L'outil accepte les images sources PNG, JPG, WebP, GIF, BMP, AVIF et SVG jusqu'à 10 Mo, et il produit un fichier ICO correctement structuré contenant chaque taille que vous sélectionnez.
- Commencez avec une source haute résolution. Téléchargez votre logo ou icône à 512 pixels ou plus. Une grande source donne au convertisseur suffisamment de détails pour produire des versions réduites propres à chaque taille cible. Les sources SVG fonctionnent particulièrement bien car elles s'adaptent sans aucune perte de détails.
- Sélectionnez vos tailles. Cochez les cases pour 16, 32, 48 et 256 (l'ensemble sûr), ou ajoutez 64 et 128 si vous en avez besoin.
- Choisissez le comportement de redimensionnement. Contenir adapte l'image à l'intérieur de chaque carré tout en préservant le rapport d'aspect, en remplissant tout espace supplémentaire. Couvrir remplit tout le carré, en recadrant les bords si nécessaire. Pour la plupart des logos, contenir avec un arrière-plan transparent est le meilleur choix.
- Téléchargez votre favicon.ico. Placez le fichier résultant à la racine de votre site web (
https://votresite.com/favicon.ico). Les navigateurs recherchent automatiquement ce chemin, donc dans de nombreux cas, vous n'avez même pas besoin d'une balise<link>.
Any2ICO effectue la conversion directement dans votre navigateur en utilisant l'API Canvas. Les fichiers importés depuis votre appareil sont transmis via le serveur pour traitement mais ne sont pas stockés. Les collages de presse-papiers restent entièrement sur votre machine. Si vous convertissez plusieurs icônes à la fois, le mode lot vous permet de tout télécharger dans un seul fichier ZIP.
Pour une procédure complète avec captures d'écran et extraits de code HTML, consultez notre guide étape par étape sur comment créer un favicon.ico. Et si vous devez convertir spécifiquement un PNG, notre guide PNG vers ICO détaille ce flux de travail en détail.
Conclusion
Choisir les bonnes tailles de favicon n'a pas à être compliqué. La règle de base est simple : incluez toujours 16 et 32 pixels, ajoutez 48 et 256 pour Windows et la couverture haute résolution, et utilisez une image source haute résolution pour garder chaque taille nette. Cet ensemble sûr de quatre tailles gère la grande majorité des scénarios du monde réel.
Lorsque vous êtes prêt à construire votre favicon, Any2ICO le rend facile. Téléchargez votre image, choisissez vos tailles et téléchargez un seul fichier ICO qui fonctionne partout. C'est gratuit, rapide et respecte votre vie privée.