FavIcon

El FavIcon o Favorite Icon es un pequeño dibujo (un icono) que aparece en la barra de dirección del navegador y en la pestaña del mismo y sirve para personalizar la página. El que tengo en mi blog es un pequeño pastel. Ojo, con el código que he utilizado el favicon sólo puede verse con el navegador de Firefox.

Si disponemos de alguna imagen que nos gustaría utilizar como favicon, antes de incluirlo en el blog lo que tendremos que hacer será crear la imagen específica, para ello entraremos en FavIcon from Pics, haremos click en examinar para seleccionarla y a continuación haremos click en "generate FavIcon". El motivo de que haya que crear una nueva imagen a partir de la que tenemos es que el tamaño del favicon debe ser de 16x16; además, el formato también cambia (.png o .ico). En esa página, además, podemos obtener el icono animado, es decir, en movimiento (cuando se abre la página el icono se desplaza una vez hacia arriba), incluso se puede añadir texto, también en movimiento ("Scrolling text"). Podéis probar todos los que queráis y descargároslo a vuestro ordenador. FavIcon from Pics lo genera comprimido; no hay más que descomprimir el archivo una vez descargado, y subir a Blogger o a vuestro hosting de fotos habitual el favicon que queréis.

Para subir el favicon a blogger no hay más que descargar la imagen en una nueva entrada del blog y guardarla como borrador. En la pestaña "Edicion de HTML" de la entrada os aparecerá la dirección de la imagen (img src="XXX"), que es la que nos hará falta para el siguiente paso.


Aviso: si la imagen que queremos utilizar es muy grande, FavIcon from Pics no será capaz de transformarla, tendremos que reducir su tamaño antes (puede hacerse fácilmente editando la imagen en el Paint: Imagen - Expandir/Contraer).

Una vez tengamos la dirección de la imagen, iremos a la plantilla de nuestro blog, Edicion HTML, y buscaremos el siguiente código en la cabecera (head) de nuestro blog:

<title><data:blog.pageTitle/></title>

ahí pegaremos el siguiente código:

<link href='URL DE TU IMAGEN' rel='shortcut icon' type='image/x-icon'/>



<link href='URL DE TU IMAGEN' rel='icon' type='image/png'/>


cambiando el texto url de tu imagen por la dirección de la imagen que quieras tener como favicon.

Una vez hecho esto, hacemos click en guardar cambios y ¡listo!

Este código lo pude utilizar gracias a la entrada Favicón para Blogger Beta de Gemablog
, pero se ha escrito sobre ello en más blogs, por ejemplo: Favicon en el "Nuevo Blogger" o Favicon, Qué es y como se hace de Bloggea2 o Favicon en web o blog

.

Existen otras webs que nos permiten crear nuestro favicon: Dynamic Drive- FavIcon. En MpP Favicon Gallery podemos encontrar favicones ya hechos, según nos informa Bloggea2, que nos explica aquí cómo hacerlo. Y en Favicon.cc podemos crearlo manualmente, según se explica en Crea tu favicon en línea

.

Espero que se entienda y os sea de ayuda.