Si utilizas alguno de estos navegadores: Konqueror, IE,
Galeon i/o Mozilla/Netscape, estaras viendo ahora mismo,
en la barra de navegación o en favoritos, un pequeño icono
(con la cabeza de un pingüino), que se denomina
favicon. ¿Quieres aprender a crear y mostrar este icono en tu web
con linux? …
Una de las formas más sencillas de crear estas imagenes que tienen formato
.ico (que NO son simplementes bmp’s pequeños como
piensa mucha gente), es convertir las imagenes desde otros formatos,
normalmente ppm (raw), xpm o png.
Podemos crear u obtener nuestro icono utilizando algún programa
de dibujo, por ejemplo, vamos a ver como hacerlo con Babygimp
(Babygimp is an icon editor in Perl/TK with some unusual features).
El primer paso será crear la imagen utilizando la cuadricula (de 32×32
o 16×16), una vez creado y retocado el icono, lo guardaremos como .xpm,
luego solo nos quedará usar el programa xpm2wico,
para convertirlo en favicon.ico, que ya podremos usar en nuestra web 😉
xpm2wico image.xpm favicon.ico
Evidentemente podemos crear el icono utilizando Gimp, en este caso lo
ideal es aumentar la imagen con el Zoom para poder retocarlo de forma
precisa. Cada cual que utilice la herramienta de dibujo que mejor domine 😉
Otra opción es convertir en un primer momento la imagen a formato ppm
(raw), para luego convertirla en .ico usando ppmtowinicon que
está incluido en netpbm.
ppmtowinicon -output favicon.ico image.ppm
Si tenemos las imagenes en formato gif, jpeg, bmp
o png tendremos que
convertirlos previamente a ppm, para posteriormente convertirlos en los
.ico que realmente necesitamos:
giftopnm image.gif | ppmtowinicon -output favicon.ico
jpegtopnm image.jpeg | ppmtowinicon -output favicon.ico
bmptoppm image.bmp | ppmtowinicon -output favicon.ico
pngtopnm image.png | ppmtowinicon -output favicon.ico
Todas estas conversiones de formatos es una forma de crear los iconos,
pero es muy poco potente, puesto que en un mismo .ico podemos
almacenar varias imagenes (con distintas paletas y tamaños) que se mostraran
dependiendo de la resolución con la que estemos trabajando, y con los
2 metodos mostrados hasta ahora solo tenemos una única imagen.
Si queremos que en mismo .ico esten incluidas varias imagenes que se
mostraran dependiendo de la resolución, tendremos que recurrir, por ejemplo,
al plugin del Gimp:
gimp-winicon-plugin-1.0.0
, que nos permitirá manipular los .ico, de forma que usando las capas (layers) podemos
tener en cada capa la imagen que se mostrara dependiendo de la resolución y
número de colores utilizados.
Una vez descargado gimp-winicon-plugin-1.0.0, lo compilaremos y instalaremos
de la forma habitual (./configure; make; make install). Ahora al arrancar el
Gimp, se cargará junto a los otros plugins, winicon, lo podemos
comprobar en Exts | Detalles sobre Añadidos, Buscar ico;
apareceran file_ico_load (Loads files of Windows ICO file format)
y file_ico_save (Saves files in Windows ICO file format).
Tal y como podemos ver para Abrir y/o Guardar los iconos, tendremos que
seleccionar la extensión ICO, no confundir con GIcon.
Aquí podemos ver las tres capas que hemos utilizado para crear el
favicon.ico
que utilizamos en Bulma.
Una vez creado nuestro icono (favicon.ico), y comprobado que se ve
correctamente, por ejemplo con el comando display del
ImageMagick:
display favicon.ico
Lo único que tendremos que hacer es indicarlo en todas las páginas web donde queramos que
aparezca, esto será tan sencillo como añadir esta sentencia html, dentro de
las etiquetas <head> y </head> de la página web en cuestión:
<link rel=”shortcut icon” href=”favicon.ico”>
Otro programa que también nos permite meter varias resoluciones en un mismo
icono es png2ico que como su nombre indica se encargará de convertir
nuestros png’s a iconos. El programa es muy facil de utilizar,
directamente desde la línea de comandos, teclearemos algo como esto:
png2ico favicon.ico logo16x16.png logo32x32.png
En este caso nos creará el favicon.ico utilizando ambas imagenes
especificadas: logo16x16.png y logo32x32.png.
Enlaces relacionados:
- BabyGimp
http://babygimp.sourceforge.net/ - Gimp
http://www.gimp.org -
xpm2wico
http://sapi.vlsm.org/gnu/halifax/tools/xpm2wico-0.2.3.1.tar.gz
http://ftp.debian.org/debian/pool/main/x/xpm2wico/xpm2wico_0.2.3.1.orig.tar.gz - Netpbm
http://netpbm.sourceforge.net - Plugin winicon para el Gimp
http://registry.gimp.org/file/gimp-winicon-plugin-1.0.0.tar.gz?action=download&id=2228 - png2ico
http://www.winterdrache.de/freeware/png2ico/index.html
- How to create favicon-icons on Unix machines
http://www.mavetju.org/unix/favicon.php - favicon.ico (FreeBSD Diary)
http://www.freebsddiary.org/favicon.php - png2ico – PNG to icon converter (Linux, Unix, GNU, Windows, …)
http://www.winterdrache.de/freeware/png2ico/favicon.html - What’s the favicon.ico file I see in my error logs?
How can I set up a custom favorites icon for my website?
http://www.hostingforhumans.com/faviconfaq.html - favicon.com
http://www.favicon.com/
—
$ alias carcoco=”echo Carlos Cortes”
http://bulma.net/todos.phtml?id_autor=132
Este post ha sido traido de forma automatica desde https://web.archive.org/web/20140625063149/http:/bulma.net/body.phtml?nIdNoticia=1464 por un robot nigromante, si crees que puede mejorarse, por favor, contactanos.