SiteCrafting Blah Blah Blog

Mar. 16, 2007 at 10:48am

Safari and PNG Headaches

I just finished coding a new photography contest application for a client, and our graphic designer alerted me to some weirdness that Safari has with PNG images. To make a long story quite short, Safari doesn't translate PNG colors to match CSS colors reliably; it darkens them just a bit. The details are beyond me, so instead check out this article for those, and you can see an example in this image. The example labeled "Your Version" is the Safari rendering, and the box labeled "Our Version" is the Firefox rendering.

For you, this means that you shouldn't use PNG images where color matching is important, use GIF instead. However, if PNG use becomes more widespread, hopefully the treatment of PNG images by browsers and OSs will become more standard and can replace GIFs - which have fewer colors and larger filesizes.

Posted in Browser Bugs, CSS, Design by Dave Poole

Comments (4)

Did you file a bug?

http://webkit.org/quality/reporting.html
1 | Left by Bernie Zimmermann | Mar. 18, 2007 at 5:46pm


Dave says:

Bernie -

No, I didn't. This issue is well documented by many more people who understand it much better than I do. Adding my voice to the mix would only serve to distract from those that really know what's going on.
2 | Mar. 19, 2007 at 8:49am


Yeah IE7 has issues with PNG too. It has something to do with the gama adjustment feature Microsoft decided to support that nobody else would touch. There is a way to fix your PNGs by stripping out the gama info in the img headers supposedly.
3 | Left by RR Anderson | Mar. 19, 2007 at 1:30pm


http://www.amake.us/software/pngcrusher/ RR Anderson is correct, safari trys to be helpful and will read the profile of that image instead of just using srgb. Use http://www.amake.us/software/pngcrusher/ to remove any profile/gamma data and it should work. Also it will improve file size if thats a big deal for ya. I had some issues with my mac since it ships with a gamma of 1.8 and windows is 2.2. Changing your mac to use the srgb profile loaded with photoshop, and making sure your workspace is srgb
4 | Left by Michael Pierce | May. 30, 2007 at 11:01am


Remember me
Name: Email: URL: Comment: *   No HTML, http:// will auto-link
* required    Comment Guidelines