Saltar al contenido
SilktideAyuda

Favicon

Silktide comprueba que cada página de tu sitio web tenga un favicon, el pequeño icono que los navegadores muestran para tu sitio en las pestañas, los marcadores y en las pantallas de inicio de los teléfonos.

Un se declara normalmente con una etiqueta <link> en el de cada página:

<!-- En el <head> de la página -->
<link rel="icon" type="image\/png" href="\/icons\/favicon.png">

Cuando no hay etiqueta, los navegadores también recurren a un archivo favicon.ico en la raíz del sitio, por lo que cualquiera de los dos métodos satisface esta comprobación.

Por qué es importante

Sin un favicon, tu sitio aparece con un icono en blanco o genérico en las pestañas del navegador y en los marcadores, lo que dificulta que los visitantes te encuentren entre sus pestañas abiertas y hace que pase desapercibido en las listas de marcadores. La ausencia de favicon también da sensación de sitio sin terminar, y los navegadores solicitan \/favicon.ico de todos modos, llenando los registros de tu servidor con errores evitables.

Dado que los favicons suelen configurarse a nivel de sitio en una plantilla, que falte a menudo indica páginas creadas fuera de tu plantilla principal, lo cual ya es algo que conviene saber.

Cómo solucionarlo

  1. Crea tu icono. Un PNG de 32x32 píxeles es un buen mínimo; proporcionar un SVG o varios tamaños de PNG permite que cada dispositivo elija el ajuste más nítido.
  2. Añade una etiqueta <link rel="icon"> a la plantilla de tu sitio para que aparezca en todas las páginas. La mayoría de las plataformas de tienen un ajuste de favicon o "icono del sitio" que hace esto por ti.
  3. Como alternativa (o además), sube el icono como favicon.ico en el directorio raíz de tu sitio web para que se sirva en https:\/\/yoursite.com\/favicon.ico.

Cómo lo comprueba Silktide

  1. En cada página HTML, busca etiquetas <link> en la cabecera de la página cuyo atributo rel incluya icon y que apunten a una imagen descargable.
  2. Si no se encuentra ninguna, prueba la ubicación convencional \/favicon.ico en la raíz del sitio y comprueba que devuelve una imagen válida.
  3. Informa de cada página en la que ninguna de las dos opciones proporcione un favicon y realiza un seguimiento del porcentaje de tus páginas que tienen uno con el tiempo.

Solución de problemas

Mi sitio tiene un favicon, pero algunas páginas aparecen marcadas

La etiqueta <link> del favicon debe estar presente en cada página. Las páginas generadas fuera de tu plantilla principal —páginas de error, páginas de destino, aplicaciones incrustadas— a menudo carecen de ella. Un archivo favicon.ico en la raíz del sitio cubre todas las páginas a la vez, así que añadirlo es la solución global más rápida.

La etiqueta está ahí, pero la comprobación sigue fallando

Comprueba que la dirección del icono realmente devuelve una imagen: una etiqueta de favicon que apunta a un archivo movido o eliminado falla la comprobación igual que una etiqueta ausente.

Más información

Última actualización

¿Le ha resultado útil esta página?

Favicon | Ayuda de Silktide