# 122: L'état de Favicons - Astuces CSS

Anonim

Pour toujours, nous avons tous créé des graphiques 16 × 16 et les avons mis au format .ico. J'ai probablement utilisé cet outil de conversion un million de fois. Quelque part sur la ligne, cela a commencé à devenir plus déroutant. Les navigateurs peuvent également prendre en charge les favicons .png.webp. Et maintenant, il y a des écrans Retina, et rien ne semble pire sur la rétine que de petits graphiques minuscules mis à l'échelle. Les navigateurs commencent maintenant à prendre en charge les favicons 32 × 32 maintenant. Que devons-nous faire?

La situation est que si vous fournissez les deux, de nombreux navigateurs ignorent le .png.webp et utilisent le .ico. Jonathan Neal a toute l'histoire. Alors, utilisons simplement ce .ico pour les deux. C'est un format unique qui est conçu pour gérer cela de toute façon.

  • Créez les versions 16 × 16 et 32 ​​× 32, en utilisant vos meilleures compétences en création de pixels pour perfectionner les deux
  • Enregistrez-les en tant que PNG de qualité complète
  • Créer un nouveau projet dans Icon Slate (via)
  • Faites glisser les versions dans les «puits» respectifs
  • «Build» pour créer le .ico
  • Liez ce .ico comme d'habitude: