I recently ran into a problem where PNG images were not being rendered properly in IE8, but only in IE8.  All other browsers displayed the images properly.  By “not being rendered properly” I mean that the PNGs were just slightly darker than the color they should have been, even though the image itself showed the proper color.  The the image below is an example of this; the left and right areas of the tabs are just slightly darker than the middle area.

At first I thought was related to the PNG transparency not being rendered properly and figured that I would take it up with the Graphic Artist when time allowed.  However, after walking away and then coming back to it, I was able to track down the real culprit: gamma correction.  It seems that the gamma information is included in PNGs to allow for a more accurate rendering of graphics, but that it is ignored by most browsers – except Internet Explorer 8.  A detailed explanation of the how and why of this can be found on Trevor Morris’s blog though his post was written prior to IE8, the issue was the same.

After spending some time in Paint.Net (I don’t have access to Photoshop) I was unable to come up with a way to remove the gamma from an image.  The Paint.Net forums suggested copying the image information into a new image and saving that, but that did nothing.  Fortunately, a bit lower in the same thread was the recommendation of a utility called “TweakPNG” and that did the trick.

All I had to do was simply save the image in my Image Editor, open it with TweakPNG, delete the gAMA information and hit Save.  Now my PNGs displayed correctly, even in IE8.