sábado, 24 de diciembre de 2011

¿Qué es un favicon y cómo usarlo ?

Hola de nuevo,

debido a la ausencia de capturas en mis salidas no puedo reportaros ninguna novedad al respecto, pero esta tarde espero parar la mala racha.

Al tema, ¿qué es un favicon y cómo usarlo? como bien dicen, una imagen vale más que mil palabras así que:

                                            Imagen


El favicon es la imagen que aparece a lado de la URL en el navegador, en la pestaña, en favoritos o marcadores. Sirve para personalizar aún más nuestro espacio y facilitar a la vista la localización de nuestro blog.


Pasos a seguir en Blogger (esta fue mi forma de hacerlo, hay infinitas):

Creamos o abrimos la imagen que queramos poner como favicon con el paint, la imagen tiene que ser cuadrada para que no quede deforme. Primeramente puedes crearla del tamaño que quieras o con el programa que quieras y luego hacer el paso 2, pero que sea cuadrada.

Hay que darle el tamaño adecuado, para ello vamos a Imagen>Atributos. Aquí seleccionamos como unidad píxeles y ponemos en ancho 32 y largo 32.

Guardamos el archivo y lo convertimos a .ico a través de esta web: http://favicon.htmlkit.com/favicon/

 Descargamos el archivo y lo descomprimimos ya que viene en .zip. Nos quedamos con el archivo .ico.

Nos dirigimos a la opción de diseño de blogger y en la parte superior izquierda nos tiene que aparecer Favicon>Editar. Pinchamos, subimos el archivo y guardamos.

------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

En ocasiones la plantilla no es compatible con favicon y no podemos modificarlo a través de la página de diseño, si este es nuestro caso podemos hacerlo de esta manera:

Alojamos la imagen .ico en un servidor web

Vamos a Plantilla>Edición HTML y buscamos la línea <title><data:blog.pageTitle/></title> (podemos utilizar control + F y pegar el texto para encontrarla antes)


Pegamos estas líneas justo encima de la línea anterior:

<link href='URL del favicon.ico' rel='shortcut icon' type='image/x-icon'/>

<br /><link href='URL del favicon.ico' rel='icon' type='image/x-icon'/>

Reemplazaremos la parte que dice URL del favicon.ico por la URL de nuestro favicon.


Guardamos la plantilla y listo!

Nota: Tarda como máximo 5 minutos en actualizarse y en caso de no aparecer comprobar que realmente está en formato .ico y cumple las medidas.

Espero que a alguien le interese por lo menos y se anime a realizarlo. Tardas 10 minutos a lo sumo.

Un saludo para todos y suerte en las capturas!

4 comentarios:

  1. Muchísimas Gracias Jorge.
    A mí me viene de maravilla esta información.

    No es que sea muy bueno con esto de la informática. Cuando uno llega a cierta edad se tarda en pillar las cosas y con este mundo para cuando aprendo ya cambio a algo más nuevo.

    Un Saludo. ¡Mi primer regalo ya lo tengo!

    Frank

    ResponderEliminar
  2. Me alegro que te sirva Frank, ese era el propósito.

    Yo tuve la suerte de ver nacer esta generación de la información e internet y aprender un poquillo.

    Un saludo y gracias por tu comentario como siempre.

    Jorge

    ResponderEliminar
  3. Parece interesante, cuando tenga un rato lo voy a probar. Gracias por la aportación.
    Un saludo Jorge!

    ResponderEliminar
  4. Está muy bien el tema, pues ayuda a personalizar un poco más nuestro espacio.
    Saludos y Felices Fiestas.

    ResponderEliminar