BOLETIN No. 15 -- Cómo hacer un FAVICON.ICO para tu web

¿Qué es el FAVICON.ICO?

Por su composición en inglés, FAVICON significa Favorites icon, y no es más
que el gráfico diminuto que aparece en la parte superior izquierda al lado de la
URL de tu barra de direcciones. Esa imagen quedará igualmente almacenada en la
memoria caché de la máquina cliente para identificar tu sitio en, por ejemplo,
los favoritos de tu navegador.

Aunque tanto IExplorer como Firefox tienen comportamientos muy similares, en lo que respecta al favicon pueden actuar de manera diferente. Igualmente, uno de lo problemas principales al mostrar apropiadamente el favicon son las versiones de los navegadores.

El hecho que aparezca el logo de tu sitio, o un identificador del mismo, le da
una pizca mayor de profesionalismo a tu página web y de manera constante ayuda
a tu visitante a identificar con facilidad tu sitio. He allí su importancia.

¿Cómo hago un FAVICON.ICO?

De manera general, el gráfico favicon es un cuadrado de 16 × 16 pixeles.

Es recomendable utilizar estas medidas para tener la certeza de que se ve apropidamente
en los navegadores más populares.

En este boletín te mencionaremos dos de las muchas formas de obtener una imagen favicon.

En la primera forma asumimos que tienes Photoshop en tu máquina.

1. Descarga el plugin de Photoshop que te permitirá crear
imagenes con extensión ICO de la siguiente liga:

DESCARGAR PLUGIN DE PHOTOSHOP

2. Desempaca el archivo ZIP.

3. Coloca el archivo ICOFormat.8bi dentro de la carpeta de:

C:\Archivos de programa\Adobe\Photoshop\Plugins\Formatos de archivos

(o la ruta donde tengas instalado Photoshop en tu máquina)

4. Abre Photoshop y al tratar de guardar en los tipos de archivos aparecerá la opción de guardar con
la extensión ICO. Esa es la que te permite guardar el archivo favicon.ico

La segunda forma es aún más simple, aunque tienes menos control sobre el resultado.

Utiliza la herramienta en línea de fabricación de favicons que se encuentra en

GENERADOR DE FAVICONS

El resultado que se obtiene es bastante decente y extremadamente fácil de usar. Esta sin duda puede ser tu opción.

Cómo coloco mi FAVICON.ICO en mi web?

Sigue las siguientes indicaciones para colocar apropiadamente tu gráfico ICO en la web.

1. Coloca la imagen favicon.ico en el directorio raíz de tu web.

2. Dentro del HEAD de la página principal copia el siguiente código:

<link rel=“icon” href=“http://tusitio.com/favicon.ico” type=“image/x-icon”>

<link rel=“shortcut icon” href=“http://tusitio.com/favicon.ico” type=“image/x-icon”>

Aunque en teoría ambas líneas hacen lo mismo, hemos notado que algunos navegadores reponden
mejor a una que a otra. No ocasiona ningún daño tener ambas y tu favicon se mostrará con mayor
seguridad en más navegadores.

3. Sólo colócalo en el HEAD de la página principal. No es necesario que lo coloques en ningún
otro lugar en tu página. Automáticamente debe aparecer para tus otras páginas.

4. Es altamente probable que tan pronto lo coloques no aparezca en tu página. Si estás usando IExplorer
ciérralo y utiliza Firefox o cualquier otro navegador. Es recomendable que limpies la memoria caché de
tu máquina en ambos navegadores, o los que tengas, y sólo entonces verás tu favicon adornando
e identificando tu página web.

Para información sobre como limpiar la memoria caché, consulta el boletín sobre el tema en
www.cafetero100.info

Distribuidores autorizados.
Soporte técnico en español

- Detección y prevención