¿Tiene que incluir <link rel = “icon” href = “favicon.ico” type = “image / x-icon” />?

205

No incluí la siguiente línea de código en mi etiqueta principal, sin embargo, mi favicon todavía aparece en mi navegador:

<link rel="icon" href="favicon.ico" type="image/x-icon" />

¿Cuál es el propósito de incluirlo?

html favicon

— usuario784637
fuente

174

Si no llama al favicon, favicon.icopuede usar esa etiqueta para especificar la ruta real (en caso de que la tenga en un images/directorio). El navegador / página web busca favicon.icoen el directorio raíz de forma predeterminada.

— Brian Graham
fuente

3

o si no tiene el favicon.ico en la carpeta raíz pero, por ejemplo, en una carpeta de activos

— Voto a favor del

122

De hecho, debe hacer ambas cosas, para que todos los navegadores encuentren el icono.

Nombrar el archivo "favicon.ico" y ponerlo en la raíz de su sitio web es el método "desalentado" por W3C:

Método 2 (desalentado): poner el favicon en un URI predefinido
Un segundo método para especificar un favicon se basa en usar un URI predefinido para identificar la imagen: "/ favicon", que es relativa a la raíz del servidor. Este método funciona porque algunos navegadores han sido programados para buscar favicons usando ese URI.
W3C - Cómo agregar un favicon a su sitio

Entonces, para cubrir todas las situaciones, siempre hago eso además del método recomendado de agregar un atributo "rel" y señalarlo al mismo archivo .ico.

— siburb
fuente

8

Sí, esta es una respuesta más correcta. No hay estándares relacionados con simplemente poner un favicon.icoen la raíz, pero la mayoría de los navegadores solicitarán dicho archivo automáticamente por razones históricas.

— Fabrício Matté

10

La razón adecuada para hacer esto no es porque funcione en algunas situaciones , sino porque el mejor método no funciona en algunas situaciones

— Jasper

2

Curiosamente, realFaviconGenerator recomienda no declarar el favicon en el encabezado HTML.

— Dan Dascalescu

77

Internet Explorer inventó el favicon y lo buscó en la raíz. AFAIK, todos los navegadores hacen esto. Es por eso que recomiendo poner un favicon.ico en la raíz, porque de lo contrario devolverá 404 y la mayoría de los sistemas no almacenan en caché eso ... así que sigue solicitándolo. Coloque un icono allí y se almacenará en caché correctamente.

— Stijn de Witt

50

Lo uso por dos razones:

Puedo forzar una actualización del icono agregando un parámetro de consulta, por ejemplo ?v=2. Me gusta esto: <link rel="icon" href="https://stackoverflow.com/favicon.ico?v=2" type="image/x-icon" />
En caso de que necesite especificar la ruta.

— nilsi
fuente

¡Impresionante, finalmente descubrí por qué no se mostraba!

— whamsicore

Estoy seguro de que esto fue solo un error tipográfico, pero tiene un href relativo allí, lo que significa que no funcionará a menos que todas sus páginas estén en el nivel superior o tenga un archivo favicon.ico en cada subdirectorio.

— Chris Cogdon

Para su información para los lectores posteriores, el comentario de Chris Cogdon se corrigió en la edición "9 de septiembre de 16 a las 5:05", por lo que ya no es un problema

— Daryn

13

Simplemente agregarlo a la carpeta raíz funciona de una manera, pero descubrí que si necesito cambiar el favicon, puede llevar días actualizarlo ... incluso una actualización de caché no funciona.

— Nicole
fuente

No olvides Ctrl-C y Reconstruir.

— Jason Glass

9

Muchas personas configuran su ruta de cookies a /. Eso hará que cada solicitud de favicon envíe una copia de las cookies de los sitios, al menos en cromo. Dirigir su favicon a su dominio sin cookies debería corregir esto.

<link rel="icon" href="https://cookieless.MySite.com/favicon.ico" type="image/x-icon" />

Dependiendo de cuánto tráfico obtenga, esta puede ser la razón más práctica para agregar el enlace.

Información sobre cómo configurar un dominio sin cookies:

http://www.ravelrumba.com/blog/static-cookieless-domain/

— usuario3907900
fuente