Un package favicon est facile à sous-estimer. Beaucoup de gens le considèrent comme une petite image dans un onglet de navigateur, mais un site moderne a généralement besoin d'un petit ensemble d'actifs associés. L'icône de l'onglet du navigateur n'est qu'une surface. Les raccourcis mobiles, les icônes Android, les icônes tactiles Apple et les références de manifeste peuvent tous nécessiter leurs propres fichiers.
L’objectif pratique n’est pas de collecter toutes les variantes d’icônes possibles. L’objectif est de fournir un package ciblé qui couvre les navigateurs courants et les surfaces de type application sans transformer la préparation du lancement en travail d’exportation manuel. Le Favicon / App Icon Generator dans Converty est construit autour de ce travail : commencez à partir d'une image carrée et téléchargez un ensemble avec les fichiers communs ensemble.
Le fichier principal est toujours favicon.ico
favicon.ico reste le fichier favicon le plus connu. C'est l'actif que les gens s'attendent à voir associé aux onglets du navigateur, aux signets et aux anciennes conventions de favicon.
Même lorsqu'un site comprend également des icônes PNG et un manifeste Web, favicon.ico reste utile car il couvre un chemin traditionnel compris par de nombreux navigateurs et outils. Pour un site simple, c'est souvent le premier fichier que quelqu'un vérifie lorsque l'icône de l'onglet ne semble pas correcte.
Les icônes PNG couvrent les surfaces modernes
Les packages d'icônes modernes incluent généralement des fichiers PNG de plusieurs tailles. Différents navigateurs, raccourcis et contextes d'affichage peuvent utiliser différentes dimensions. L'exportation d'une seule taille peut laisser le navigateur ou l'appareil redimensionner l'image, ce qui peut donner un aspect flou ou encombré aux petites icônes.
C’est pourquoi les illustrations sources sont importantes. Une image carrée, simple et lisible produit de meilleurs résultats sur l’ensemble de l’emballage qu’un graphique détaillé compressé en plusieurs tailles. Converty ne peut pas transformer un logo complexe en une petite marque parfaite, mais il peut supprimer le travail d'exportation répétitif une fois que vous disposez d'une source appropriée.
Les icônes tactiles Apple et les icônes Android servent différentes surfaces
Les icônes tactiles Apple sont utilisées pour les surfaces de raccourci des appareils Apple. Les icônes prêtes pour Android prennent en charge les cas d'utilisation d'installation et de raccourci associés sur les surfaces orientées Android.
Ces fichiers sont faciles à oublier car ils ne sont pas toujours visibles lors d’une vérification normale du navigateur de bureau. Le site peut s'afficher correctement dans un onglet tout en manquant des éléments importants après que quelqu'un l'a enregistré sur l'écran d'accueil d'un appareil. Un package complet rend cela moins probable.
Si vous décidez si une icône Apple Touch est distincte d'un favicon, lisez Apple Touch Icon vs Favicon : que devrait inclure un site moderne ?.
Le manifeste relie les surfaces de type application entre elles
Un starter site.webmanifest donne à une application Web ou à un site un emplacement pour décrire les icônes et les métadonnées d'affichage associées. Cela ne remplace pas les fichiers d'icônes eux-mêmes. Il les indique afin que les surfaces compatibles puissent comprendre quels actifs sont disponibles.
C'est pourquoi Converty inclut un manifeste de démarrage dans le package. Le fichier généré vous donne un point de départ pratique, mais vous devez toujours placer les ressources dans votre projet et les référencer à partir de la configuration de votre site.
Une liste de contrôle pratique du package favicon
Un package de favicon ciblé doit généralement inclure :
favicon.ico- plusieurs tailles d'icônes PNG
- Sortie de l'icône Apple Touch
- Sortie d'icône prête pour Android
- une entrée
site.webmanifest
C'est suffisant pour de nombreux petits sites, lancements SaaS, pages marketing et projets de documentation. Des configurations plus spécialisées peuvent nécessiter des ressources supplémentaires spécifiques à la plate-forme, mais le package commun élimine le travail de routine.
Ouvrez le Favicon / App Icon Generator lorsque vous disposez d'une image source carrée et que vous avez besoin des fichiers du package favicon commun regroupés dans une seule exportation. Pour un flux de travail plus large, lisez Comment générer un package Favicon complet à partir d'une image.
