[RECURSOS] [Tutorial] Increíble! Tutorial para habilitar canal alfa del PNG en IE!

.





Bueno, antes que nada comento brevemente (muy breve para no aburrir) para los que no conocen la frustración de no poder usar el formato PNG en IE (Internet Explorer) lo que esto significa.
El formato PNG permite usar 256 niveles de transparencia y como el IE no lo toma siempre hay que recurrir a los malabarismos con el formato GIF para lograr cosas que serían muy sencillas de hacer si no fuera por este popular producto de Microsoft.

Bueno, ahora para los que saben de lo que hablo, yo había encontrado este tutorial hace como dos años mas o menos, pero nunca lo podía hacer andar no se por qué. La cosa es que ahora a raíz de un tema que escribió SAGA me puse a buscar información sobre ese tema y volví a encontrar este mismo tutorial, pero ahora con una actualización que si me funcionó!!
Es impresionante como se facilita el armado de páginas con imágenes del tipo PNG. Además creo que este formato por sus características de cómo tratar los colores y cómo comprimir imágenes va a reemplazar sin duda a los precarios GIF y JPEG de una!!

Bueno, algunas aclaraciones para que no haya problemas. El archivo blank.gif que pone ahí como variable al principio es un GIF transparente de 1x1 pixels y hay que poner ahí mismo la ruta donde lo tengan ustedes en caso de que se encuentre en alguna subcarpeta.
Otra cosa para tener en cuenta es que a mi no me funcionó con PNG de 8 bits no se por qué y con el de 24 bits nunca pude hacer transparencias tampoco se por qué (creo que es porque solo usa 8 por cada canal de color y no tiene transparencia). Lo importante es que sí funciona con PNG de 32 bits a full y es una masa!!
Lo único malo de esto es que la imagen "visible" va a ser ese blank.gif (o como lo quieran llamar) entonces nadie va a poder bajarse el .png con el botón derecho porque el gif está adelante, a menos que miren el código y ahí sí se ve el nombre del .png. Obviamente que esta contra es si ustedes usan esto para imágenes que estén interesados en que se las puedan bajar los navegantes. Ahora, si usan esto para botones y esas cosas que hacen exclusivamente al armado de una página, ese detalle ya no tiene importancia.


Espero que esto les sea útil, porque lo que es para mi, estoy re cebado mal!!! No se si se nota! Esto es una masa!!! jajajaajaja


P.D.: Lo mejor es que el autor del tutorial es muy gracioso, sin duda.

Uff q buena info che!! Es incrible q ie no tenga soporte para png directamente, pero esta solucion es una masa.. muy util!!

Se pueden hacer cosas copadas, lo loco ahora es reformular las instancias de mi cerebro para tener en consideracion a las trasparencias con smoth pa decirlo mal y rapido..

Gracias por la info!:doyvuelta

Gracias Fedee! Muy buen dato para tener en cuenta!

Saludos!

Joya! Aun no vi el tutorial pero... no se si funciona con explorer 3 u 4? o_O (me refiero al formato .png en si)

buenisimo! creo que con las versiones 3 no funca pero seguramente se podra sacar provecho de esto, por algo todas las paginas de la gente opensource se hacen con png

OP! Tenia algo de razon y aun un "poco" mas grave... esta disponible solo en las versiones 5.5 en adelante del IE :s

salu2.

jajaj es cierto billu, ahora no hay que limitarse tanto con las cosas que hagan sombra sobre alguna textura o algo así.

improser, no lo probé en esas versiones, habría que ver que onda, lo que pasa es que tengo instalado el 6 acá. Pero será cuestión de ver desde qué versión toman PNG los demás navegadores, no se.
Y bueh, de última que se actualicen los que usan de la versión 5.5 para atrás jaja ya sea del explorer o cualquier otro programa.
Por algo salen versiones nuevas, se supone que para mejorar o arreglar algunas cosas, jaja

Bueno, le cuento que justo estoy armando algo en lo que necesitaba una cosa así y la puse en práctica a ver que onda, pero para mi desilución descubrí que esto de los PNG no es tan mágico como parecía. Si bien es cierto que es transparente, igual se comporta medio raro.

Resulta que estoy haciendo un menú donde la imagen de fondo va cambiando y sobre ella hay unos botones con una transparencia, entonces lo que había hecho yo era que todos los botones cambiaran cada vez que cambiaba la imagen de fondo, pero yo quería hacer algo más prolijo y hacer los botones en PNG y que solo cambiara la imagen de fondo. Bueno, lo probé y no queda bien.

Acá dejo los ejemplos para que vean.



Los botones tienen un rectángulo negro con la opacidad al 70%. En el primer ejemplo se ve bien porque es el JPEG entero, como si lo estuviesemos viendo en Photoshop. En cambio en el segundo ejemplo se ve el fondo también, pero el rectángulo se ve gris, no se por qué, yo exporté el PNG desde el archivo con fondo transparente. Lo mismo pasa con el sellito de contacto, se ve medio choto.
Así que bueh, seguiré haciendolo con los JPEG. Pero ojo, no quiere decir que esto de los PNG no sirva, al contrario, es algo zarpado de útil, solo que para este caso no me sirvió.

P.D.: Por cierto, esta es la primera vez que hago algo aplicando PHP y estoy muy contento. Logré hacer un menú dinámico con los comportamientos básicos de rollover (con y sin link).

P.D.2: El ejemplo ese es algo en progreso y no está terminado, solo hay algunas páginas ahí, además el contenido no es actual.

Je... los png estan buenos pero... si, ya confirme en una maquina aca en mi work con win2k y sp4 pero ie5, nu anda el ejemplo de la pag... y por cierto, como dice billu, ahora tengo que modificar mi estructura de pensamiento de forma que aprovecheve(?) esta facilidad o simplemente, luego de un espectacular diseño tu cliente lo visite en su maquina win98-ie4 y vea... desastres , pero si es cierto, png es libre por eso usan todos los projects open en sus paginas, ademas de todos los browsers aceptarlo...
El formato .PiNG con transparencia se aplica si o si al fondo que le de la aplicacion en cuestion de forma automatica añadiendo y substrayendo los valores automaticamente...
Preferentemente lo uso para guardarme logos/clipart con soporte de transparencia gradual incluido y de facil importacion con esas cualidades dentro de PS, Fireworks u otro.


salu2.

Hace un tiempo que vengo escuchando (leyendo mejor dicho) todo esto de los png y el soporte del IE, (que si, que no..) y me parecieron muy buenos los links Federiico.
Otra cosa, tal vez deberías probarlo sobre algún otro fondo. Porque desde MI monitor, las diferencias entre uno y otro menú son muy sutiles (y si, noté el reborde gris...tampoco estoy ciega -aún-), pero con el over del sellito no me pareció verlo mal, al hacer la comparación.
Voy a probar con alguna imágen más grande para verificarlo por mi misma...jeje... Y de paso me ahorro una visita al oftalmólogo, tal vez....

Fuera de bromas ahora, muchas gracias por los links. Me voy leer un poquito más del tema, hay enlaces interesantes en el home page de png.
saludosssss.

Che pero que los png no son mas pesados...??