Probably the best thing about 24-bit PNGs is that they have an alpha channel, which means that they have real, proper transparency (unlike GIFs). Unfortunately, IE 6 and below don’t support it, with all transparent and semi-transparent pixels coming out grey, severely limiting the usefulness of PNGs for web work.
Fortunately, Windows itself can handle alpha-channel PNGs, and there exist hacks to have IE 6 re-render the PNGs with Windows’ alpha-channel support. One that I’ve recently had success with is the IE PNG fix at TwinHelix.
Very easy to use:
- Save iepngfix.htc (download here) to your server.
- Add the following code to the your site’s head:
<!--[if lte IE 6]><style> h1, img, div { behavior: url("/iepngfix.htc") } </style><![endif]-->
I could only get this working with iepngfix.htc referenced relatively. Not sure if that was just a silly mistake on my part, though.
The thing I like about iepngfix is that it’s really easy to apply it selectively, just to the elements that are causing trouble. Because of that, it doesn’t interfere with the Google Maps API—very important for me.
Another solution that looks promising is SuperSleight, though I haven’t investigated further.