Henri Sivonen: instead of fixing the original problem PNG gamma “correction” created a new, even worse problem: inconsistent color within a Web page.
Another leaky abstraction that has puzzled me for a while now has an explanation.
I develop on Ubuntu, and have tried to figure out why the colors in the logo don’t match the banner used in the Depot chapters of Agile Web Development with Rails. See this illustration of the differences. You won’t see a difference if you are on a MAC. You will if you are on a PC.
I had drilled down in GIMP and the RGB values matched. The colors looked right on the Mac. I couldn’t blame it on the monitor as the differences were clearly bounded by the image itself.
Also particularly interesting is Henri’s commentary on the situation:
That is, doing something was emphasized over correctness and consistency
The next edition of the book with not use a PNG for this image.
Update: Using ImageMagick to convert the original PNG image to GIF and back results in an image that works portably across Ubuntu/Firefox, Windows/IE, and Mac/Safari. It is 4 bytes bigger than the intermediate GIF, however. I've updated my illustration to show all three images.
I tried using the technique of removing the png’s gamma information using pngcrush with the following command line from this page:
Fixed the issue for me (and saved 30 bytes relative to the original PNG), but as noted there are some browsers that will still apply gamma correction even when no gamma information is supplied.
Browsers should follow the CSS spec, and treat HTML/CSS colors and untagged images as sRGB. See [link]
Secondly, PNG producing apps should declare a color profile in images, rather than using the wacky gamma tags, etc. I think Photoshop does this mostly right at this point, but there was a long period where it didn’t. I don’t precisely remember the details.
I had that (or a similar) problem with Paint Shop Pro 8. The image would be different from the background.
I managed to fix it by opening it in Paint Shop Pro 6 (which I couldn’t work in, due to lack of transparency support) and re-saving it without altering anything.