Crear un Favicon no tiene por qué ser un proceso tedioso.

 

Previamente tenemos que editar la imagen, y editarla bien. Después al crear el favicon, hemos de elegir las proporciones adecuadas ( 16×16 pixeles, 32×32, 64×64 o 128×128) y grabarlo con el formato adecuado(.ico)

 
Un archivo .ico no es simplemente un archivo de imagen .jpeg o .png al que le cambiamos la extensión (Así que no puede crearse con programas de edición de imágen, como por ejemplo Photoshop).

 

Pero en la red tenemos varias alternativas agradables para crear favicons y además , muy fáciles de usar.

Podeis usar estas dos buenas opciones:

 
 

Generate favicon

 

En HTML-Kit Tools, hemos de ir a la pestaña Home, y desplegar la opcion Favicon from Pics

  • Genfavicon
       

Crear Favicon con Genfavicon
En Genfavicon lo podremos realizar en el home del sitio web.

 

Ahora hemos de editar el código de nuestra web e insertar el código en el lugar adecuado. Hemos de hacerlo en la cabecera o header de nuestra plantilla o tema.

 

Hemos de agregar  nuestro código dentro del head, es decir entre <head> y </head>
El código que debemos introducir es el siguiente:

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

Si estáis utilizando algun plugin optimizador de la caché , debéis borrar la caché y activarlo de nuevo. Si seguís sin verlo, es posible que se deba a la caché del navegador. 
Se puede hacer una prueba de navegación privada o probar con otro navegador que tenga limpia la caché. Es interesante disponer de varios navegadores instalados en un equipo de desarrollo para este tipo de pruebas.

Y ya podemos ver el favicon de nuestro sitio web.
 


Etiquetas del articulo:


Suscríbete para acceder a la zona privada

Suscribiéndote a la lista de correo de El Taller del Bit conseguirás entrar a la zona privada de descargas con materiales exclusivos (ebooks, artículos privados, plugins, descargas de exámenes resueltos ...)

Gracias. Te has suscrito con éxito!