Créer un favicon.ico à partir d’un logo PNG
Le favicon est la petite icône affichée dans les onglets du navigateur, les favoris et les résultats de recherche, à côté du nom de votre site. Sans favicon, les navigateurs affichent une icône générique de page blanche, ce qui donne au site un air inachevé.
Ce guide explique comment transformer un logo PNG ou JPG en un vrai fichier favicon.ico et l’ajouter à n’importe quel site web.
Quelles tailles faut-il pour un favicon ?
Les navigateurs affichent les favicons à différentes tailles : 16×16 pixels dans les onglets, 32×32 sur les écrans haute résolution et dans certains favoris, 48×48 sous Windows, et des tailles plus grandes pour les raccourcis.
Un fichier ICO peut contenir plusieurs tailles, et le navigateur choisit la plus adaptée. PixShift crée automatiquement des fichiers ICO contenant des versions de 16, 32, 48 et 256 pixels.
Préparer votre image
- Utilisez une image carrée. Si votre logo n’est pas carré, il sera centré avec un espace transparent autour.
- Partez d’au moins 256×256 pixels pour que les grandes tailles restent nettes.
- Restez simple. Le texte fin et les traits minces disparaissent à 16 pixels : une seule lettre ou un symbole fonctionne souvent le mieux.
- Utilisez un PNG à fond transparent si vous voulez que l’icône se fonde aussi bien dans les onglets clairs que sombres.
Convertir le PNG en ICO
- Ouvrez le convertisseur PNG en ICO de PixShift.
- Déposez votre logo dans la zone. Le fichier ICO est créé instantanément dans votre navigateur.
- Téléchargez le fichier et renommez-le en favicon.ico.
Ajouter le favicon à votre site
- Envoyez favicon.ico dans le dossier racine de votre site, pour qu’il soit accessible à l’adresse https://votre-site.com/favicon.ico.
- Ajoutez la ligne ci-dessous dans la section <head> de vos pages.
- Rechargez votre site. Si l’ancienne icône apparaît encore, videz le cache du navigateur ou ouvrez le site dans une fenêtre de navigation privée ; les navigateurs gardent les favicons en cache de façon tenace.
<link rel="icon" href="/favicon.ico" sizes="any">L’ICO est-il encore utile avec les navigateurs modernes ?
Les navigateurs modernes acceptent aussi les favicons PNG et SVG. Néanmoins, un favicon.ico à la racine du site reste l’option la plus compatible : certains outils, lecteurs de flux et anciens navigateurs recherchent précisément ce fichier. De nombreux sites proposent à la fois une version ICO et une version SVG ou PNG.