El favicon es un icono que aparece en los navegadores junto a la dirección de la página a la que estás accediendo. Sin embargo, como tantas otras cosas en la web, el funcionamiento de estos iconos en los distintos navegadores no es demasiado consistente (como con los CSSs, que cada navegador los interpreta como le viene en gana, ¿te suena?).
El porqué del favicon se debe a una cuestión de imagen, como un logotipo de empresa, es algo representativo de una web, o un conjunto de webs para que los usuarios las identifiquen visualmente.
Es por ello que la creación de este icono debe ser considerada como uno de los primeros pasos a la hora de empezar a desarrollar una web y aquí te cuento cómo.
Si te interesa crear tu propio favicon y saber cómo debes “configurar” la web para que éste sea visible, sigue los siguientes pasos:
- Genera tu favicon con un editor de imágenes con soporte para formato .ico, no vale una imagen con otro formato y cambiarle la extensión. Como siempre te recomiendo Gimp.
- El icono deberá tener las siguientes características: 16 x 16 píxeles, 16 colores (4 bits) y formato .ico. Probablemente muchos navegadores soporten iconos de mayor tamaño e incluso otros formatos, pero estas son las características que funcionan en todos.
- Si optas por Gimp, abre el programa, indica que deseas crear un nuevo archivo (Archivo -> Nuevo) de 16 x 16 píxeles, realiza tu icono y una vez que lo tengas listo, Archivo -> Guardar una copia de la imagen y llámala favicon.ico.
- Modifica en todas aquellas páginas web en las que desees que el navegador muestre el favicon el siguiente elemento
LINKentre las etiquetas<HEAD>y</HEAD>:<link rel="shortcut icon" xhref="http://www.dominio.com/ubicacion/favicon.ico">Nota:Si el icono se llama favicon.ico y está en el raíz de la web, ni siquiera es necesario incluir esto, el navegador lo buscará por defecto. Si por el contrario, o bien el nombre, o bien la ubiciación no son las habituales, sí será necesario incluir la línea mostrada.
- Hecho esto, sube los cambios a la máquina en la que esté alojada tu web y el icono a la ubicación que hayas decidido (la de por defecto, o bien la que hayas indicado en la etiqueta
LINK.
¡Y listo!, a partir de ahora, cuando accedan a tu web verán tu favicon escoltando a la dirección de tu web en la barra del navegador y será un elemento identificativo de tu web. Si no eres capaz de verlo, paciencia, borra las caches, refresca varias veces, abre y cierra el navegador… que seguro que si has seguido los pasos tu favicon aparecerá de un momento a otro.
La forma de hacerlo es la que te he contado, pero la elección y el diseño del icono ya es cosa tuya.
10 Comentarios ↓
cayo el 17 de Enero de 2007 a las 4:34
a mi no me funciona en el explorer 7 por qué será
Jaluro el 17 de Enero de 2007 a las 22:57
Lo cierto es que no sé si IE7 tiene un tratamiento del favicon distinto al del resto de exploradores.
Pero me extraña que siguiendo lo indicado en el post tengas problemas.
En lugar de confiar en que funcione por defecto, no dudes en poner de forma explícita en todas las páginas la etiqueta de link por si ese es el problema.
Suerte!
Ignacio el 15 de Marzo de 2007 a las 18:45
Es verdad, no funciona en IE7. ¿Alguien sabe por qué es?
Jaluro el 16 de Marzo de 2007 a las 23:34
Me temo que no puedo dar respuesta, si alguien nos puede echar una mano al respecto, estaré muy agradecido.
En cualquier caso, siempre que se ponga de forma explícita la etiqueta link, deberá funcionar.
Siento de verás no poder dar una explicación.
Ciao
Jaluro el 16 de Marzo de 2007 a las 23:52
Hola otra vez, acabo de leer en esta página que el problema del favicon en IE7 puede deberse a la cache del navegador.
La solución que indican es, por supuesto seguir los pasos indicados en el presente artículo para crear el favicon y tras esto limpiar la información de cache almacenada en nuestro navegador, ya que éste al acceder a una web guarda su favicon en cache y éste podría ser el problema de que no se visualizase nuestro favicon.
Creo que eso puede ser una solución, ya me contaréis cayo e Ignacio.
Ciao
Ingrid el 13 de Junio de 2007 a las 12:34
Jaluro tiene razon. No podia ver mi icono en mi pagina web. Borre todas las direcciones que tenia en la barra de direcciones. Y fue entonces que pude ver mi icono despuès de haberlo intentado todo. El cache es la solución.
marcos-saito el 15 de Septiembre de 2008 a las 20:29
A mi no me va ni con mozilla firefox , es que no se lo que tengo que modificar de el codigo.
¿podrias decirme que tengo que hacer?
Jaluro el 15 de Septiembre de 2008 a las 23:34
Hola marcos-sahito, sigue los pasos indicados en el artículo y también los consejos que se dan en los anteriores comentarios.
Inténtalo una vez más tratando de ser riguroso en el cumplimiento de todo lo indicado y si sigues teniendo problemas, vuelve a escribir.
¡Suerte!
marcos-saito el 16 de Septiembre de 2008 a las 14:35
No se donde subir la imagen ni como, asi que no sale, pero el resto lo he entendido al leerlo por segunda vez (mi foro ha sido creado con el programa de mi@ por si eso cambia algo)
Jaluro el 16 de Septiembre de 2008 a las 15:36
Me temo, marcos-saito, que muy probablemente no puedas cambiar el favicon, pues será uno que impongan desde el programa con el que has creado tu foro.
En cualquier caso, trata de trasladar tu pregunta hacia los desarrolladores del programa por si te pudiesen echar una mano.
Ciao
Deja tu comentario
Por favor, no uses un lenguaje inapropiado, spam o cualquier otro tipo de conducta inadecuada. De lo contrario me reservo el derecho de eliminar y/o modificar aquellos comentarios que contengan algo de lo citado anteriormente.