La principal razón por la que getfavicon.org no puede encontrar el favicon de una página, es que la página genera el código HTML que nos dice dónde está de manera dinámica, por medio de javascript. Esto sucede con www.philips.com, por ejemplo. De momento, no tenemos planeado buscar solución a este problema en un futuro cercano.

Este problema se suele presentar con páginas que tiene una imagen BMP como favicon. El soporte que proporciona getfavicon.org para bmp no es completo y no es capaz de leer bmp de 32 y 16 bpps. Estamos trabajando para solucionar este problema próximamente. Si el problema que presenta el icono es que se ven partes de la imagen en negro, ver la pregunta ¿Por que se me muestra el favicon con el fondo negro?

El uso del favicon en las páginas web no está estandarizado, ya que cada explorador ha ido implementando su forma de leer faviconos según lo necesitaba. Esto ha hecho que haya varías formas de colocar un favicon dentro del código de una página, por lo que muchos desarrolladores web utilizan todas estas formas a la vez para asegurarse de que su favicon se muestre en todos los exploradores. Para más información, ver la pregunta ¿Cómo hago para usar una imagen como icono de mi página?.

Hay varios métodos para decirle al navegador dónde hemos colocado el favicon de nuestro sitio y getfavicon.org los comprueba cuando busca favicons. Estos pueden ser:

• apple: El favicon es declarado en el código de la página por una etiqueta link, la cual tiene un atributo rel="apple-touch-icon"
• icon: El favicon es declarado en el código de la página por una etiqueta link, la cual tiene un atributo rel="icon"
• favicon.ico: El favicon es un archivo llamado "favicon.ico" en la carpeta raíz del sitio
• shortcut icon: El favicon es declarado en el código de la página por una etiqueta link, la cual tiene un atributo rel="shortcut icon"

This are the usual methods to declare a favicon, for further information see ¿How can i put an image as favicon in my page?

Cuando se elige la opción "mostrar favicon" y getfavicon.org no puede encontrar un favicon en esa página, en vez de mostrar un error, nos enseña una imagen por defecto. En nuestro caso, esa imagen es la bola del mundo en gris y verde.

Imagen que se muestra en el caso de no encontrar un favicon

Para tener más posibilidades de encontrar el favicon, intenta buscar la imagen de una dirección corta, si puede ser sólo del dominio. Por ejemplo, intenta buscar:

http://favicon/?url=http://www.clickfire.com/favicon.png

en vez de:

http://favicon/?url=http://www.clickfire.com/favicon-tutorial/comment-page-1/#comment-3340/favicon.png

Muchos faviconos son imágenes que contienen transparencias, pero hay tipos de imágenes que no soportan los colores transparentes, estos son JPEG y BMP, por lo que si intentamos transformar estos iconos a estos tipos de archivos, obtendremos que las transparencias la veremos en color negro. Para que no suceda esto, guarda estos faviconos como archivos PNG, GIF o ICO.

Icono de getfavicon.org en formato jpg

getfavicon.org puede ser utilizado directamente, sin tener que visitar el sitio web para que nos proporcione los iconos. Esto es de utilidad por ejemplo, cuando se quiere mostrar el favicon de un sitio web desde una página externa, o para añadir imagenes a nuestros feeds rss.

La manera de acceder al favicon de cualquier página es mediante una url de este tipo:

http://www.getfavicon.org/?url=[dominio]/[nombre].[extension]

Sustituyendo [dominio] por la url del sitio web del que queremos el favicon. Por ejemplo, www.getfavicon.org
Hay que sustituir [nombre] por el nombre que queramos para el archivo de la imagen. En nuestro caso la vamos a llamar favicon.
Y por último cambiamos [extension] por la extension del tipo de imagen que queremos. Podemos elegir entre png, gif, jpg o ico. Para nuestro ejemplo elegiremos png.

Así para acceder a nuestro favicon directamente lo hacemos mediante la url:

http://www.getfavicon.org/?url=www.getfavicon.org/favicon.png

También tenemos la opción de cambiar el tamaño de la imagen que nos dará getfavicon.org, modificando un poco la dirección anterior de la siguiente manera:

http://www.getfavicon.org/?url=www.getfavicon.org/favicon.[tamaño].png

Así es la forma por la que se muestran las imagenes siguientes con distinto tamaño:

A una resolución de 30x30 pxs, http://www.getfavicon.org/?url=www.getfavicon.org/favicon.30.png
A 72x72 pxs, http://www.getfavicon.org/?url=www.getfavicon.org/favicon.72.png

Hay que aclarar que si el favicon de una página no tiene una buena resolución, el aumentar mucho el tamaño de la imagen hará que esta se vea un poco distorsionada.

Si no se especifica un tamaño la imagen se muestra a una resolución de 16x16 píxeles y el tamaño máximo permitido es 128x128.

Por supuesto que puedes, el método para hacerlo se explica en la respuesta a la pregunta ¿Puedo utilizar getfavicon de manera automática?

Lamentablemente, todavía no hay ningun sitio web que te permita crear un icono con varias imagenes en su interior, por lo que hay que acudir a la descarga de algún programa para hacerlos. Desde getfavicon.org recomendamos los programas que aparecen en nuestra guía, que te dan opción de guardar tu imagen como icono en varias resoluciones y profundidades de color fácilmente.

Como recomendación, podeis echarle un vistazo a la guía ¿Cómo crear un buen favicon? para que tengais una idea de que imágenes debeis meter dentro del icono.

Hoy en día, casi cualquier tipo de imagen y tamaño sirve para ser usado como favicon, aunque, por compatibilidad, es recomendable que ésta sea un archivo de icono de windows. Os recomendamos que leais la guía ¿Cómo crear un buen favicon? para que le saqueis el máximo provecho a vuestro favicon y después le echeis un vistazo a ¿Cómo puedo crear un favicon con varias imágenes? y ¿Cómo hago para usar una imagen como icono de mi página?.

Malas noticias, no hay un método estandar para incluir una imagen como favicon de una página. Es por ello que muchos desarrolladores web optan por incluir el favicon de más de una forma en cada página, siendo los mas usados:

Etiqueta meta <link rel="icon" type="image/png" href="http://example.com/myicon.png"> en la cabecera de la página. Es la recomendada por la w3c, aunque es la menos extendida de todas.

Etiqueta meta <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" /> en la cabecera de la página. Es la forma más usada en la web, y la reconocida por la mayoría de navegadores.

Colocar la imagen favicon.ico en la raiz del sitio web. Es la forma que utilizaba IE para utilizar el icono de favoritos. Los navegadores actuales la siguen utilizando por tema de compatibilidad, aunque no es recomendable por poco flexible ya que te obliga a que el icono este en un sitio determinado, con un nombre determinado.

Si os estais preguntando que teneis que escribir en el atributo type, aqui teneis los tipos MIME más frecuentes:

• ICO: "image/x-icon"
• GIF: "image/gif"
• JPG: "image/jpeg"
• BMP: "image/bmp"
• PNG: "image/png"

Es una forma de indicar la cantidad de colores que puede tener una imagen, cuanto mayor sea, más colores podrá tener la imágen, pero su tamaño también aumentará. Como no conviene tener una imagen demasiado pesada como favicon, hay que procurar encontrar un equilibrio entre bpps y tamaño.

Un píxel es simplemente un punto de la imagen. Si consideramos la imagen como un conjunto de puntos de colores, la parte más pequeña en la que se puede dividir una imagen.

Si consideramos la imagen como un conjunto de píxeles, la resolución de la imagen se puede interpretar como el número de píxeles que contiene. Normalmente, la resolución se descompone en resolución horizontal y vertical, por lo que si se dice que una imagen tiene 16x32 píxeles de resolución, entenderemos que tiene 16 píxeles de ancho por 32 de alto.

Se puede interpretar también como el tamaño de la imagen. Vistas en el mismo monitor, una imagen de 32x32 es más grande que una 16x16. Si hacemos que estas 2 imágenes ocupen el mismo espacio (imprimiendolas en un papel del mismo tamaño, por ejemplo), la primera se verá mejor al contener más píxeles (más información) y éstos serán más pequeños, por lo que tendrá más resolución.

Los archivos de iconos de windows pueden contener más de una imagen en su interior. Esto es una ventaja, ya que se puede usar las imagen que más convenga para cada proposito específico. Por esto es bueno que el favicon sea un archivo de icono de windows con varias imágenes dentro. Para más información, consulta nuestra guía ¿Cómo crear un buen favicon?.