Preguntas frecuentes sobre favicons

¿Un favicon es un archivo PNG o JPEG?

Un favicon puede utilizar varios formatos de imagen. PNG suele ser una mejor opción de trama que JPEG, mientras que ICO sigue siendo una alternativa de compatibilidad útil.

PNG suele ser la mejor opción

Un favicon puede ser PNG o JPEG cuando el navegador admite el tipo de imagen declarado. Para la mayoría de las ilustraciones de favicon, elija PNG. Conserva fondos transparentes y bordes nítidos sin los artefactos de compresión que JPEG puede agregar alrededor de letras y formas simples.

FormatoÚtil paraLimitación principal
PNGIconos rasterizados transparentes y nítidosNecesita tamaños explícitos para obtener el resultado más nítido.
JPEGObra fotográfica con fondo sólido.Sin transparencia y puede difuminar los bordes duros.
ICORespaldo de compatibilidad y múltiples tamaños en un solo archivoRequiere un editor o convertidor compatible con ICO

¿Qué deberías publicar?

Una base práctica es un modelo de varios tamaños. favicon.ico además de archivos PNG de 16x16 y 32x32. Agregue un ícono táctil de Apple y íconos de manifiesto de aplicación web cuando desee pantalla de inicio e instale cobertura.

<link rel="icon" href="/favicon.ico" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png" />

El estándar HTML muestra declaraciones de iconos PNG, ICO y SVG y permite a los navegadores seleccionar un icono por su tipo y tamaño. Ver el Definición del enlace del icono WHATWG para las reglas de la plataforma.

¿Cuándo es aceptable JPEG?

JPEG puede funcionar cuando el favicon es una fotografía sobre un fondo opaco. Sigue siendo un valor predeterminado débil para la mayoría de los logotipos porque las ilustraciones de favicon generalmente dependen de la transparencia, los bloques de color limpios y los bordes nítidos.

Si su fuente es JPEG, no es necesario que la rediseñe primero. Súbelo al Generador de favicon y exporte los archivos favicon listos para el sitio desde esa fuente.

¿Listo para crear tu favicon?

Genere los archivos comunes y un fragmento HTML listo para pegar.

Abrir generador