OCULTAR MENU LATERAL >>

Cambiar el favicon de la web

Para todos aquellos que no sepan que es un favicon, decir que es ese icono chiquitito que aparece en la barra de direcciones del navegador junto a la URL de la web.

Como Blogger me impuso uno con su logo y no me gustaba me dediqué a fabricarme mi propio favicon e insertarlo en el blog.

Para hacerlo es muy simple. Básicamente seguí 3 pasos:

1.- Crear (o buscar) la imagen (o animación) que queremos usar.

Se debe tener en cuenta que la imagen a usar se mostrará siempre en 16x16 pixels, por lo que utilizar una de un tamaño mayor sólo servirá para ralentizar la carga. Además es de importancia escoger una imagen simple, ya que con ese reducido tamaño es difícil conseguir nítidez.
También se debe atender a la extensión del fichero, ya que, aunque los navegadores van añadiendo soporte para nuevos tipos (en el momento que escribo este artículo ya hay soporte para .gif y .png), de momento el más estandarizado es el fichero de extensión .ico.
Cuando creamos nuestra imagen es difícil trabajar a ese reducido tamaño, por lo que la opción más habitual es tomar una imagen mayor y adaptarla. Para no complicarnos excesivamente hay diversas web que se ocupan de "fabricar" nuestro favicon a partir de una imagen dada. Algunos ejemplos son: http://tools.dynamicdrive.com/favicon/ o http://www.genfavicon.com/es/, donde se introduce la ruta de la imagen original (situada en nuestra máquina o en internet) y nos devuelve el icono, permitiendo descargarlo a nuestro ordenador.

2.- Colocar el favicon en un lugar accesible para nuestra web.

En muchas ocasiones nos encontramos con que no podemos subir el "iconito" a nuestra web (Blogger, por ejemplo, no permite subir archivos .ico); y lógicamente desde nuestro ordenador no está accesible. Si no tenemos este problema tomaremos la dirección URL de la imagen (o animación) que queremos usar y pasamos al punto siguiente.
En caso de que necesitemos subir nuestro icono a un lugar accesible podemos hacer uso de otra web que nos brinda el servicio gratuitamente (sólo para ficheros .ico). Esa web es http://www.iconj.com/, donde tenemos todo lo que necesitamos. Primero debemos registrarnos (fácil, gratis y rápido). Tras hacerlo recibiremos un correo, hacemos click en el enlace que nos ponen en el mail y ya está. Ahora basta con subir nuestro favicon desde la pestaña My account. Una vez subido le pondremos nombre y lo dejaremos marcado para que se añada a tu lista de favoritos y que se establezca como favicon.

3.- Añadir el favicon a nuestra web.

Por último sólo queda añadir el favicon a nuestro blog. Para ello nos vamos a Personalizar y luego Diseño-->Edicion de HTML. En el código buscamos la siguiente línea:
< title> < data:blog.pageTitle/> </title>
Y justo antes insertamos ésta:
< href="'URL_DE_TU_FAVICON'" rel="'shortcut'" type="'image/x-icon'/"> 
Donde deberás sustituir URL_DE_TU_FAVICON por la dirección de tu propio favicon.
Podemos probarlo antes de guardar mediante Vista Previa y, si nos gusta el resultado guardaremos los cambios. Ya tenemos nuestro favicon personalizado.


Salu2,
elSant0

ALGUNOS ARTICULOS RELACIONADOS

1comentarios:

Anónimo dijo...

Hola querido amigo de Blogtecnia, desde hace un día estoy teniendo problemas en mi blog. Mi favicon aparece cambiado, aparece la imagen de dos hombres posando para la foto cuando yo tenía una mirilla. Cuando entro a mi cuenta de Blogger aparece el favicon normal, lo he cambiado pero sigue estando el mismo (los 2 hombres). Tengo miedo estar siendo atacado por un hacker, aunque me parece un poco estúpido que hackeen mi cuenta en donde no hay mucho que hackear. Si puedes responderme con prisa te agradecería, pues he dejado de entrar a la cuenta por las dudas. Muchas Gracias.

Publicar un comentario

Escribe aquí tus valoraciones, dudas, sugerencias,... Son sólo unos instantes y ayuda a mejorar el blog.