Pourquoi l’icône fabriquée en trois clics sur un convertisseur en ligne finit-elle floue dans l’onglet du navigateur, ou carrément blanche sur le bureau ? Parce qu’un fichier ico n’est pas une image.
C’est un carton qui range plusieurs images de tailles différentes dans un seul fichier. Windows et les navigateurs viennent y piocher celle qui les arrange. Livrer un ico d’une seule taille, c’est livrer un carton à moitié vide.
Ce qu’il faut préparer avant de fabriquer l’icône
Le point de départ n’est pas le convertisseur, c’est le visuel source. Il vous faut une image carrée, à fond transparent, et large d’au moins 512 pixels. Un logo posé sur un rectangle blanc donnera une pastille blanche dans l’onglet, et personne ne comprendra pourquoi.
Le format du fichier source compte aussi. Un PNG 512 × 512 avec transparence fait très bien l’affaire. Un SVG est encore mieux, puisqu’il se rastérise proprement à n’importe quelle taille : c’est d’ailleurs tout l’intérêt du format SVG, qui divise le poids des images sans perdre en netteté.
En revanche, oubliez un JPEG de photo ou un fichier TIFF prévu pour l’imprimeur : aucun des deux ne gère la transparence utile ici.
Côté outil, deux options gratuites suffisent. GIMP, si vous préférez cliquer. ImageMagick en ligne de commande, si une ligne à taper ne vous effraie pas.
Les convertisseurs en ligne restent utilisables, mais la plupart sortent une seule taille sans le dire. C’est exactement le piège que la suite cherche à vous éviter.
Un dernier détail qui n’en est pas un : simplifiez le dessin. Un logo à trois mots et deux dégradés devient une tache grise en 16 pixels. Gardez une forme, une couleur dominante, deux au maximum.
Étape 1 : choisir les tailles à embarquer, et pas au hasard
Les quatre tailles utiles sont 16, 32, 48 et 256 pixels. Elles ne sont pas décoratives, chacune est consommée à un endroit précis de Windows, et c’est ce qui explique les bugs d’affichage bizarres.
- 16 px : vue Détails et vue Liste de l’explorateur, coin de la fenêtre, zone de notification.
- 32 px : barre des tâches, menu Démarrer, petites icônes du bureau.
- 48 px : vue Mosaïque et icônes de taille moyenne sur le bureau.
- 256 px : grandes et très grandes icônes, et source de tous les paliers intermédiaires que Windows recalcule entre 48 et 256.
D’où le symptôme classique : une icône fabriquée uniquement en 256 s’affiche parfaitement en grandes vignettes, et se transforme en bouillie dès qu’on repasse en vue Détails. Rien n’est cassé, Windows réduit simplement une image trop grande à la volée, sans aucun soin.
Pour un favicon de site, la logique est la même mais la liste se raccourcit. 16 et 32 suffisent largement, avec un 48 en bonus. Microsoft, de son côté, recommande d’aller jusqu’à sept tailles dans un même fichier (16, 24, 32, 48, 64, 128 et 256) pour une application distribuée. Pour une icône personnelle, quatre suffisent, et le fichier reste sous les 100 Ko.
Étape 2 : fabriquer un vrai conteneur, pas un PNG déguisé
Renommer logo.png en logo.ico ne convertit rien du tout. Le navigateur télécharge le fichier, n’arrive pas à le décoder, et retombe sur son icône de page vierge. Windows, lui, affiche une case blanche. Le fichier est mort-né, même s’il porte la bonne extension.
Dans GIMP, la méthode qui marche tient en quatre gestes :
- Créez un nouveau document de 256 × 256 pixels, avec un fond transparent.
- Importez votre visuel avec Fichier puis « Ouvrir en tant que calque », jamais en ouvrant l’image directement.
- Dupliquez le calque et réduisez chaque copie à 48, 32 puis 16 pixels. Un calque égale une taille dans le fichier final.
- Exportez sous, en choisissant « Microsoft Windows icon », et réglez chaque calque sur 32 bpp, 8-bit alpha, no palette.
Ce point 2 mérite qu’on insiste, parce qu’il fait perdre des soirées entières. Si vous ouvrez l’image directement puis réduisez son échelle, le calque rétrécit mais le canevas reste à la taille d’origine. Résultat : une icône minuscule perdue dans un coin, ou floue après recadrage à la main.
Le réglage 32 bpp n’est pas non plus une coquetterie. GIMP propose par défaut du 24 bpp avec 1-bit alpha, c’est-à-dire une transparence en tout ou rien, qui donne des bords en escalier dès 32 pixels.
Si la ligne de commande vous va mieux, ImageMagick fait le même travail en une instruction :
magick logo.png -define icon:auto-resize=256,48,32,16 favicon.ico
Attention au -define : sans lui, la sortie par défaut plafonne à 128 pixels au lieu de 256, et vous repartez avec un fichier incomplet sans le savoir.
Une remarque en passant sur le poids. Un ico est lourd pour ce qu’il montre, parce que le format stocke des bitmaps non compressés. Un JPEG de 107 Ko peut ressortir à 550 Ko une fois converti, soit cinq fois plus.
Ce n’est pas grave pour une icône de bureau. Ça l’est un peu plus pour un favicon servi à chaque visite, raison de plus pour se limiter à quatre tailles.
Étape 3 : appliquer l’icône à un raccourci ou à un dossier
La manipulation elle-même prend dix secondes. Sur un raccourci : clic droit, Propriétés, onglet Raccourci, bouton « Changer d’icône », Parcourir, et vous pointez votre .ico. Sur un dossier : clic droit, Propriétés, onglet Personnaliser, « Changer d’icône ».
Ce qui coince vient après, et toujours pour la même raison. Windows n’incorpore pas votre icône, il mémorise le chemin du fichier. Déplacez le .ico, renommez-le, videz le dossier Téléchargements, et l’élément revient à son apparence d’origine, parfois des semaines plus tard.
D’où la seule organisation qui tienne : un dossier unique, créé à la racine de C:, dans lequel tous vos .ico atterrissent, et qu’on ne touche plus jamais. Trois pièges connus complètent le tableau.
- Un
.icorangé sur un partage réseau (chemin UNC) donne un raccourci à icône vide. Recopiez le fichier en local. - Un nom de fichier en caractères non latins fait échouer l’application de l’icône, sans le moindre message d’erreur.
- Un ico en 24 bits s’applique très bien à un raccourci et échoue silencieusement sur un dossier. Le même visuel réexporté en 32 bits avec canal alpha passe sans broncher. Ici, c’est la profondeur de couleur qui bloque, pas la taille.
Et si l’icône refuse de se rafraîchir alors que tout est correct, le coupable est le cache d’icônes de Windows. Une commande le reconstruit : ie4uinit.exe -show. La vignette se met à jour dans la foulée.
Faut-il encore un favicon.ico en 2026 ?
Oui, mais plus du tout au même titre. Le favicon d’un site ne repose plus sur un fichier unique posé à la racine : il repose sur un petit jeu d’icônes déclaré en HTML, où chaque navigateur prend ce qu’il sait lire. Trois lignes suffisent dans le <head> :
<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
Le SVG est devenu la pièce principale. Il pèse souvent moins d’un Ko, reste net sur tous les écrans, et peut même changer de couleur en thème sombre grâce à une requête média glissée dans le fichier. Son support navigateur atteint environ 90 % aujourd’hui, ce qui laisse une minorité bien réelle : Safari sur iOS, Internet Explorer, Opera Mini.
C’est précisément à quoi sert encore l’ico. Il ne s’affiche plus chez la majorité des visiteurs, il rattrape les 10 % restants. Le PNG de 180 × 180 en apple-touch-icon, lui, sert quand quelqu’un ajoute votre site à l’écran d’accueil de son iPhone.
Reste l’attribut qui décide de tout et que personne ne mentionne : le sizes="32x32" sur la ligne de l’ico. Il n’est pas là pour faire joli. Sans lui, Chrome a tendance à préférer l’ico au SVG, et vous servez une icône pixellisée à des navigateurs parfaitement capables d’afficher du vectoriel. Une paire de guillemets, et le comportement change.
Deux habitudes sont à abandonner au passage. La première : écrire rel="shortcut icon", formule héritée des tutoriels des années 2000, qui n’a jamais été une relation valide.
La seconde : déplacer le favicon.ico dans un sous-dossier d’assets avec un identifiant de version. Certains agrégateurs et lecteurs RSS demandent bêtement /favicon.ico à la racine, et ne cherchent nulle part ailleurs.
Google, de son côté, veut une image carrée déclarée sur la page d’accueil, avec une taille multiple de 48 pixels pour un rendu propre dans les résultats de recherche.
Cette logique de repli vaut d’ailleurs bien au-delà des icônes. C’est exactement le raisonnement appliqué aux images du site, où le format AVIF s’accompagne d’une solution de secours selon la compatibilité du navigateur. Un format moderne devant, un format ancien derrière, et personne ne voit de case vide.
Questions fréquentes
Comment ouvrir et modifier un fichier ico sans rien acheter ?
GIMP l’ouvre nativement et affiche chaque taille embarquée comme un calque séparé, ce qui permet de voir en un coup d’œil si le fichier contient vraiment quatre images ou une seule. IrfanView le lit aussi. Plus simple encore pour un contrôle rapide : glissez le .ico dans une fenêtre de navigateur, Chrome et Firefox l’affichent directement.
Le nouveau favicon ne s’affiche toujours pas, que faire ?
Les navigateurs gardent les favicons dans un cache séparé qui survit à un rechargement normal. Forcez le rafraîchissement avec Ctrl + Maj + R, ou ouvrez directement l’adresse du fichier, par exemple votresite.fr/favicon.ico. Si la nouvelle icône apparaît à cette adresse mais pas dans l’onglet, le fichier est bon et seul le cache traîne.
Fabriquer une icône propre prend un quart d’heure la première fois, cinq minutes ensuite. Le vrai gain n’est pas esthétique : c’est de ne plus jamais se demander pourquoi le logo est net sur le bureau et illisible dans l’onglet. Un fichier, quatre tailles dedans, un chemin qui ne bouge plus, et l’affaire est réglée pour des années.
