ExeBlog, desarrollo de videojuegos y más

Blog de Exelweiss dedicado al desarrollo de videojuegos, industria del videojuego, advergaming, juegos online, etc

PNG de 8 bits con canal alfa (la alternativa en IE6)

30 octubre 2007

Internet Explorer 6 no acepta PNG’s de 32 bits con transparencia. Es un fastidio para miles de diseñadores web. Además, el filtro de Microsoft AlphaImageLoader y otras soluciones que hacen uso de él son contraproducentes.

El formato mágico

Pero, por casualidad encontré una alternativa para IE6 que podría ser útil en ciertos casos y con la que tendríamos transparencias reales en los navegadores modernos, y transparencia binaria en IE6 (como la del GIF).

Se trata de utilizar un formato especial de PNG, en el que tendríamos una imagen indexada de 8 bits con un valor alfa especifico por cada uno de los colores de la paleta (Más información en la especificación PNG).

Imagen 32 bits optimizada con PNGOUT (3,36 KB)
Imagen de 32 bits optimizada con PNGOUT (3,36 KB)

Imagen 8 bits con canal alfa (2,42 KB)
Imagen de 8 bits con canal alfa optimizada con PNGOUT (2,42 KB).

Los navegadores modernos muestran correctamente este formato, pero IE6 no aplica bien el alfa y elimina todas la zonas semitransparentes, dejando sólo las zonas opacas. Esta opción puede ser válida para pequeños iconos o similares.

Ejemplo como queda en IE
Ejemplo de como quedaría en IE6

Para utilizar esta triquiñuela, sólo tenemos que reducir el número de colores de la imagen y del canal alfa, y después optimizarla con PNGOUT. ¡Ojo! Photoshop no carga bien este tipo de imágenes.

También podemos utilizar Fireworks, de los pocos programas capaces de trabajar con imagenes de 8 bits con alfa.

Los comentarios están cerrados.


  • icono rss RSS