# 122: El estado de los favicons - Trucos CSS

Anonim

Siempre hicimos gráficos de 16 × 16 y los pusimos en formato .ico de alguna manera. Probablemente utilicé esta herramienta de conversión un millón de veces. En algún punto de la línea comenzó a ser más confuso. Los navegadores también admiten favicons .png.webp. Y ahora hay pantallas de retina, y nada se ve peor en la retina que pequeños gráficos pequeños ampliados. Los navegadores también están comenzando a admitir favicons de 32 × 32. Qué vamos a hacer?

La situación es que si proporciona ambos, muchos navegadores ignoran el .png.webp y usan el .ico. Jonathan Neal tiene toda la historia. Entonces, usemos ese .ico para ambos. Es un formato único que está diseñado para manejar eso de todos modos.

  • Haga las versiones 16 × 16 y 32 × 32, utilizando sus mejores habilidades de creación de píxeles para perfeccionar ambas
  • Guárdelos como archivos PNG de calidad completa
  • Hacer un nuevo proyecto en Icon Slate (vía)
  • Arrastre las versiones a los respectivos "pozos"
  • "Construir" para crear el .ico
  • Vincula ese .ico como de costumbre: