Colocar un "favicon" en mi blog

En su mayoría, las versiones más recientes de navegadores tienen la propiedad de mostrar en la barra de direcciones del navegador, a la izquierda de la URL, un í­cono que identifica a cada sitio. A este ícono se lo conoce como "Favicon".

Cuando usaba internet explorer este favicon aparecía solo si agregabas una página como favoritos (de ahi su nombre "fav-icon" - icono favorito), sin embargo en firefox, este favicon aparece en todas las páginas (una ventaja más de firefox sobre internet explorer), luego pensé ¿por qué no poner un favicon en mi blog?, es más ¿por qué no hacer un tutorial? y bueno aquí estamos.

* Lo primero que debemos hacer es crear nuestro icono, para eso utilizamos un editor gráfico que nos permita dar formato ".ico" a las imágenes. El tamaño del ícono debe ser de 16 x 16 píxeles y tener una paleta de 16 colores (4 bit).
* Para los flojos aquí les dejo una web que les ayuda a crear su favicon FavIcon from Pics, lo único que tienes que hacer en esta web es buscar tu imagen (examinar...) y luego un simple click en "generate FavIcon.ico" y si les gusta su nuevo favicon (lo pueden ver en la vista previa) lo guardan; ok el nuevo archivo es un *.zip dentro del zip hay 1 carpeta (readme.txt y preview_16x16.png) y otro archivo (el más importante); nuestro "favicon.ico"
* Luego debemos tener nuestro "favicon.ico" subido a la red, yo aconsejo subirlo a nuestro propio servidor (ej: http://www.ludablog.com/images/favicon.ico) o en cualquier hosting de imagenes que soporten archivos *.ico.
* Por último agregaremos éste código entre los tags
<header></header>
de nuestro código HTML:

<link rel="shortcut icon"
href="http://www.ludablog.com/images/favicon.ico" />


Guardar los cambios y refrescar la página, hasta acá ya deberías tener tu favicon en la barra de direcciones, si no aparece revisa el procedimiento o borra tus cookies y vuelve a intentarlo. No deberia fallar, solo si usas internet explorer va a ser necesario que agregues tu web como favoritos.

Publicar un comentario

2 Comentarios

  1. gracias por tu ayuda, la explcacion fue muy buena. Tu blog tambien muy buano. Saludos.
    http://webmuyinteresante.blogspot.com/

    ResponderEliminar