View Single Post
Old 06-21-2006   #1 (permalink)
Heri
Poseidon
 
Join Date: May 2006
Location: Arizona, USA
Posts: 31

Send a message via MSN to Heri
Thumbs up Fixing the PNG Color Problem in IE

PNG images have been the long-term answer in the web design world for years. But problem after problem arises in the use of PNGs, which is why most designers are still resorting to GIFs or JPEGs for their web graphics. For many years the problem wasn’t the PNG format itself, but the lack of browser support towards it. However all that has changed now and all major browsers including Internet Explorer, Firefox, Netscape, Opera, and Safari have PNG support.

There’s been a problem that has plagued the PNG world for years. Few people could ever figure out why PNGs appeared darker in IE and didn't match CSS colors (and this problem still exists even with the beta release of IE7). This discouraged many people from using PNGs at all.


But there’s a fix to this problem, though it sacrifices one of PNGs greatest capabilities. What you will need is a program like TweakPNG (yes, it's free), which allows you to edit PNG chunks and allows you to compress PNG file sizes much better then Photoshop does.

Using TweakPNG, simply open up your PNG image and remove the gAMA chunk. This will totally fix your problem of PNG images not matching CSS colors in IE. Also remove the pHYs and iCCP if you’re concerned about file size (and remove cHRM if you’re not using any transparency), as those chunks aren’t needed to get a PNG to display correctly in the different browsers.


So what’s going on? Well, I advise you take a look at the following link. It will explain what we just removed.
PNG (Portable Network Graphics) and Gamma

“That’s so cool! I wish GIFs or JPEGs could do that! But why did I have to remove gAMA in order to make PNGs look right in IE?” Now I can’t take advantage of it!!!

Good question and simple answer. IE doesn’t have a proper gamut setting, so it misuses the gAMA information that the PNG provides and displays something darker then it’s supposed to be. So if you remove the gAMA chunk you'll fix the IE problem, but once again your images will act like GIFs or JPEGs when it comes to how they act across systems with different gamma settings. A shame really, as it’s a really cool feature.

Last edited by Heri; 06-21-2006 at 01:54 AM..
Heri is offline