El Diario Mural de Huevox Inc

Sabe estimado lector, muchas cosas pasan en la actualidad de un chileno. Pero, como que en este mes no me siento inspirado de escribir sobre actualidad y/o dar mi opinión (y creo que esto durará durante un largo tiempo).
¿Será acaso por que ocurre lo mismo todos los dias, solo que cambian los protagonistas?, ¿será por que ando ocupado?, ¿será que necesito "desfragmentar" mi mente?

Seguro que lo estoy aburriendo hablando de mi. En fin, pasemos a algunas cosas más importantes: ¡AL FÍN!, acabo de hacer mi "obra maestra". El nuevo diseño del Diario Mural, el cual está muy bueno, además de combinar con el nombre del sitio. Se que le faltan algunos retoques, pero lo estoy haciendo en un código que aun no entiendo muy bien (Estupido Blogger).

Algo de inspiración (guau) para escribir lo que viene: Los Desafíos de Diseño, ya que cada persona que diseña páginas web se enfrenta a problemas que vienen por parte de los navegadores o por parte de los códigos que implementa o le mandaron a implementar (llamense PHP, ASP, JSP, RoR, Javascript Asíncrono, Coldfusion, etc, etc, etc).

En esta primera entrega de los desafios de diseño, voy a hablar acerca (de un tema tan tocado que se prostituyo) del formato de imágenes PNG (pronunciese "ping") y su (mala) compatibilidad con Internet Explorer 6.

(Si desea saber que es PNG, consulte en otro lado, no estoy escribiendo para un artículo enciclopédico)

¿Por qué los diseñadores deberían usar el formato de imágenes PNG (pronunciese "ping")?

Por lo siguiente:


Como se pueden dar cuenta en la imagen de muestra (vista en Mozilla Firefox), el formato PNG soporta muchos niveles de transparencia. Mientras que el formato GIF, solo soporta un nivel de transparencia (el de "transparencia total").
Algo que me sorprendió al hacer esta demostración, fue que la imagen de la izquierda es de mayor tamaño que la imagen derecha. Siendo que la primera maneja como máximo 256 colores y la segunda puede manejar más de 16 millones de colores (y no se cuentan los niveles de transparencia).

Si, el PNG es un formato que permite una mayor flexibilidad al usarse para diseño Web (salvo si se quieren hacer imágenes animadas, en lo cual se prefiere el GIF o (hoy en dia) Flash). Lamentablemente hay un problema que obstruye el uso de este formato.

Sin duda es ESTO:

Esta es el mismo sitio web usado para realizar la primera imagen, visto con Internet Explorer 6 (tambien se puede ver en versiones anteriores a esta, pero comúnmente se hace hincapié en esta versión por ser la mas usada por los visitantes de sitios web). Las imágenes PNG que soportan 16 millones de colores (color verdadero) no muestran transparencia. Y la cambian por un feo color gris (o blanco en algunas ocasiones), lo cual le da más de algún dolor de cabeza a los diseñadores.

Hay varias soluciones para evitar esto:

• Las radicales, como restringir el acceso a los navegadores IE6.
• Las del "trabajo pesado", como cambiar todos los formatos de imágenes (de PNG a GIF-JPG)
• entre otras

Como hago uso de imágenes PNG en este sitio (por qué me cansé de usar GIFs). Decidí por una solución que encontré gracias a mi amigo Google (buscando por: Transparent PNGs on Internet Explorer 6).

Eso resuelve el problema de las imágenes sueltas (como el Logotipo o el Pie de Página en el Diario Mural). Pero, ¿qué ocurre con las imágenes de fondo? La solución anterior no nos sirve para esta aplicación de las imágenes PNG.

También basureando con elir tio G. Encontré otra solución que sirve para estos casos (obviamente yo lo modifique para mis propósitos). El único problema es este:

Este es una imagen del Diario Mural en tiempo real siendo navegado a través de Internet Explorer 7 (la última versión). ¿Nota alguna diferencia señor usuario? Los bordes del Diario Mural. En la imagen contenida a la derecha de la imagen se puede ver como deberían ser los bordes del Diario Mural. En cambio, en los bordes de la imágen (¡no de la subimagen!) se puede ver que los bordes están "alargados". La mayor de las limitaciones de la segunda solución. (Si está visitando el sitio con Internet Explorer 6, lo podrá ver)


En conclusión, no hay una solución definitiva para los pobres diseñadores (como yo, reitero) para que las imágenes PNG se vean "dignamente" en Internet Explorer 6 y no "arrui"...
perdon, si la hay, convencer a los usuarios que cambién a ese indeseado IE6 por Internet Explorer 7 (que si soporta PNGs transparentes) o por un mejor navegador como Firefox u Opera.