Crear un favicon para tu web

Un favicon es el icono que lleva cada web y que los navegadores utilizar para diferenciarlas del resto. Si tu navegador está actualizado a las últimas versiones seguro que te aparece el favicon de los sitios web que visites en la parte superior, junto al nombre de la web. Hoy veremos cómo hacer un favicon con Photoshop para poder añadirlo a tu web.

Guía para crear un favicon con Photoshop

favicon

La medida estándar de un favicon es de 16 píxeles por 16 píxeles, por tanto lo primero que tenemos que hacer es abrir un nuevo documento que tenga esas medidas. Además lo vamos a abrir en un color transparente, sin ningún fondo.

Hecho esto podemos abrir el logo de nuestra web. Lo seleccionamos todo, lo copiamos y lo pegamos en el nuevo documento que hemos  creado de 16 píxeles. Quedará muy grande y sólo se verá una parte, por eso lo tenemos que hacer más pequeño.

Para reducir el tamaño de nuestro logo y que quepa en el cuadrado de 16 por 16 píxeles, nos vamos hasta Edición – > Transformación libre. Importante pulsar en la tecla Mayús cuando estemos reduciendo el logo para que no se pixele o quede raro. De esta forma se guardan las proporciones.

Cambiar el nombre del favicon para publicarlo en la web

Una vez realizado el favicon tendremos que guardarlo en formato .png y con el nombre favicon. Cuando esté en nuestro escritorio y para que sea visible en la web tenemos que cambiarle la extensión. De .png tiene que pasar a .ico.