Favicon para Google: requisitos actuales, tamaños y etiquetas HTML

Lo que exige Google, según su documentación actual

La página de Google sobre favicons en Búsqueda (última actualización: 28 de agosto de 2026) fija estas condiciones para que tu favicon pueda aparecer en los resultados:

• Formato: BMP, GIF, ICO, PNG, JPEG, PPM o TIFF. SVG no figura en esa lista, de modo que, aunque los navegadores admitan un favicon en SVG, para Google conviene tener también un ICO o un PNG.
• Forma y tamaño: cuadrado (proporción 1:1) y de al menos 8 × 8 píxeles. Google recomienda usar uno mayor de 48 × 48 para que se vea bien en distintos lugares.
• Un solo favicon por sitio, y el sitio es el nombre de host: https://www.ejemplo.com/ y https://blog.ejemplo.com/ son dos sitios y pueden tener favicons distintos, pero https://www.ejemplo.com/tienda, un subdirectorio, no puede tener el suyo: usa el de la raíz.
• Debe poder rastrearse: Googlebot-Image tiene que poder descargar el archivo del favicon y Googlebot debe poder rastrear la página de inicio. Si bloqueas alguno de los dos en robots.txt, no aparecerá.
• URL estable: no cambies la dirección del archivo con frecuencia.
• Contenido apropiado y representativo de la marca. Google sustituye por un icono genérico los que considere inapropiados.

Y una advertencia que Google repite: cumplir todas las condiciones no garantiza que aparezca. Además, el cambio no es inmediato: según Google, el rastreo puede tardar de varios días a varias semanas. Si cambias el favicon, puedes pedir la reindexación de la página de inicio desde la herramienta de inspección de URL de Search Console.

Las etiquetas que Google lee

Google extrae el favicon de la etiqueta <link> de la página de inicio. Acepta rel="icon" (y, por razones históricas, rel="shortcut icon"), rel="apple-touch-icon" y rel="apple-touch-icon-precomposed". El href puede ser una ruta relativa o una dirección completa, e incluso alojarse en una red de distribución de contenidos, no necesariamente en tu dominio.

Los otros tamaños que importan: móvil y apps instalables

Google no es el único que lee el favicon. Tres usos más, con su tamaño:

• iPhone y iPad (icono de pantalla de inicio): la documentación de Apple muestra iconos de 180 × 180 para iPhone con pantalla retina (y 152 × 152 y 167 × 167 para iPad). Si no declaras ninguno, Safari busca en la raíz de tu sitio un archivo cuyo nombre empiece por apple-touch-icon; lo más simple es tener uno de 180 × 180 y enlazarlo.
• Aplicación web instalable (PWA): para que Chrome ofrezca instalar tu sitio, el manifiesto debe incluir un icono de 192 px y otro de 512 px, según los criterios de instalación publicados en web.dev.
• Pestañas y marcadores del navegador: usan versiones pequeñas (16 y 32 píxeles, y hasta 48 en algunos casos), sacadas del ICO, el SVG o los PNG que declares.

Un conjunto razonable de archivos

Esto es lo que usa UtilsDock en su propio <head>, y es un conjunto mínimo que cubre navegadores, Google, iPhone y apps instalables:

<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="manifest" href="/site.webmanifest">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">

• favicon.ico: el formato que Google sí admite y el que usan los navegadores antiguos. Un ICO puede contener varios tamaños a la vez.
• favicon.svg: escala sin pérdida a cualquier tamaño y permite adaptarse al modo oscuro. Los navegadores modernos lo prefieren, pero no es el que lee Google.
• apple-touch-icon.png: 180 × 180 píxeles.
• Los iconos de 192 y 512 píxeles van dentro del manifiesto (site.webmanifest).

Cómo diseñar un favicon que se vea

A 16 píxeles, el texto pequeño y los detalles finos se convierten en una mancha. Funciona mejor una forma simple y contundente, con la parte importante centrada y un buen contraste. Un icono negro con fondo transparente puede desaparecer en una pestaña oscura: comprueba cómo se ve sobre fondo claro y oscuro antes de publicarlo.

Generarlo y comprobarlo

El generador de favicon toma un logo cuadrado y devuelve el conjunto completo: un favicon.ico con varios tamaños, PNG de 16 y 32 píxeles, un icono para Apple de 180 × 180, PNG de 192 y 512 para Android y apps instalables, y las etiquetas HTML para pegar en el <head>. Una vez hecho, el comprobador de favicon revisa tu archivo (formato, peso, forma y transparencia) y te lo muestra a los tamaños reales sobre fondo claro y oscuro. Si necesitas redimensionar el logo antes, puedes hacerlo con el redimensionador de imágenes. Todo se procesa en tu navegador, sin subir el logo a ningún servidor.

El favicon es solo una parte de lo que ve Google de tu web: robots.txt y sitemap.xml explica qué rastrea y qué no, y la longitud del título y la meta descripción cómo se muestran junto al favicon.

Fuentes y más información

• Google Search Central: definir un favicon para mostrar en los resultados de búsqueda (actualizado el 28 de agosto de 2026)
• web.dev: criterios de instalación de una PWA (iconos de 192 y 512 px)
• Apple: Configuring Web Applications (apple-touch-icon y tamaños)

Datos comprobados el 3 de octubre de 2026.