header image
 

Favicon y Iconos con png2ico

Favicon (abreviatura del inglés ‘favorites icon’), también conocido como icono de página, es un icono asociado con un sitio web o página web en particular. Un diseñador web puede crear este icono, y muchos navegadores gráficos puede hacer uso de él. Veamos como hacer en Linux (o Mac gracias a fink) uno para nuestra web fácilmente.Siguiendo las sugerencias del howto favicon de W3C:

… the format for the image you have chosen must be 16×16 pixels or 32×32 pixels, using either 8-bit or 24-bit colors. The format of the image must be one of PNG (a W3C standard), GIF, or ICO.

1. Crear una imagen en formato PNG de 32×32 píxeles. Si somos capaces de hacerlo con nuestro GIMP continuar leyendo el paso 6.

2. En el caso que el diseño no sea lo nuestro, siempre podemos buscar en internet alguna imagen que nos plazca, así en images.google.com podemos buscar por ejemplo:

tux filetype:png

3. Una vez tengamos la imagen, pasamos a tratarlo con el comando ‘convert’ de Imagemagick, para instarlo:

apt-get install imagemagick

4. Si la imagen se presta a un marco, podemos añadirselo con el siguiente comando (en este caso de 2px):

convert imagen.png -border 2 imagen2.png

5. Ejecutando el siguiente comando redimensionamos la imagen a 32×32:

convert imagen.png -resize 32x32! imagen32x32.png

la exclamación después del tamaño, es porque por defecto ‘convert’ tomaría el 32 como el valor máximo del ancho y alto, con ‘!’ obligamos a que la imagen sea cuadrada.

6. Ya sólo nos falta subirlo a nuestro servidor y siguiendo el howto de W3C:


<head profile="http://www.w3.org/2005/10/profile">
<link rel="icon"
      type="image/png"
      href="/somewhere/myicon.png" />
[…]
</head>

7. Tal como marca el W3C no hace falta que el fichero sea .ico, sino que .png es valido, pero una vez llegamos a este punto es posible crear iconos de sistema para utilizarlo como icono de cualquier aplicación o por si nuestro servidor solo acepta el famoso favicon.ico. Para ello necesitamos ejecutar png2ico, que para descargarlo como siempre:

apt-get install png2ico

el cual ejecutamos con una sencilla instrucción:

png2ico favicon.ico --colors 256 imagen32x32.png

o para utilizarlo en nuestro sistema, (donde podemos un tamaño mas grande):

png2ico Icono.ico --colors 256 imagen100x100.png

Nota: en Mac están disponibles png2ico e imagemagick (usando el apt-get de fink), pero para las funciones de este último podemos utilizar el comando ’sips’ integrado en el unix Darwin de Apple.

~ por paco en Enero 2, 2008.

Escribe un comentario