Not signed in (Sign In)

A podcast and forum for those who design, develop and run websites.

Boagworld is not just a web design podcast, it is also a thriving online community. Whether you build, design or run websites there are always people here to help. Whatever your question there is sure to be somebody with the answer.

Welcome, Guest

Want to take part in these discussions? Sign in if you have an account, or apply for one below

Vanilla 1.1.10 is a product of Lussumo. More Information: Documentation, Community Support.

Have your say

Become apart of the Boagworld community...

Design IE8 renders PNG "wrong"

Bottom of Page

1 to 4 of 4

  1.  
  1.  permalink
    Just a quick heads up for people who haven't spotted that IE8 renders PNG images differently to every other version. It's not doing it wrong, it's just that all the other browsers ignore certain bits of colour information, whereas IE8 adds support for them.

    The main culprit appears to be gamma correction, which is effectively the brightness of the image. I've noticed backgrounds that used to blend seamlessly into a solid CSS colour don't any more in IE8 - the whole PNG image is rendered slightly darker.

    This is only a problem if your PNG file contains gamma correction information, but I believe Photoshop automatically adds this for you so it probably affects a lot of us! Luckily there are tools you can use to strip out this extraneous data: for example pngcrush on Windows worked nicely for me. You can download the source from SourceForge, so I'm sure it will work on Mac and Linux.

    Here's a decent article about it:
    http://morris-photographics.com/photoshop/articles/png-gamma.html

    pngcrush:
    wikipedia
    SourceForge

    From the article it appears that gamma correction problems have been around for a while, so apologies if this is old news!
    •  
      CommentAuthorDoug S.
    • CommentTimeJun 9th 2009
     permalink
    Good tip! I wasn't aware this was even something to consider. PNGCrush is a PPC app so those of us with Intels will see it using up extra resources. Not cool.

    Check out ImageOptim. It's free, allows you to optimize multiple images, is still actively developed (something the others can't claim more often than not) and it even will turn your PNG-24 images to PNG-8 if it can do so without losing visual quality.

    Pretty nifty, I use it on all of my sites.
  3.  permalink
    Can PNG-8 support alpha-transparency, or does it only support one level of transparency similarly to GIFs?

    I'd also noticed PNGs displayed differently in IE6 and IE7, but haven't tested them in IE8 as I haven't upgraded yet, and I tend not to use PNGs is layouts any way. I can't remember the last time I did!
    •  
      CommentAuthorDoug S.
    • CommentTimeJun 10th 2009
     permalink
    Yes, PNG-8 supports alpha transparency.

    I wasn't sure but I did a bit o' Googlin' and it came up pretty quick. Apparently Fireworks can output it pretty easily so I don't see why this program couldn't manage.

    More and more I think Photoshop is crap at exporting for the web.

1 to 4 of 4

  1.