Browser color - IE vs everything else

[JonathanRimmel]

I imagine there is already a thread for this, but search isn't always accurate. So if there is point me there.

My issue is this. Internet Explorer over saturates my images. NO other browser does this. (I have most of them) I am using a color calibrated wide gammut display. This is where the difference is most noticeable. BUT, there is still a subtle difference on my narrow gamut display as well (also calibrated).

Before posting images to the web, I always: covert to 8 bit, and sRGB. Generally I include the ICC profile. Though I have tried not including the profile, which only makes it over saturated in all other browsers and doesn't change IE. Things get worse if I convert CMYK images.

Any thoughts on this? I certainly don't want people looking at my portfolio in IE (as most clients likely will) to see nasty off color, over saturated images.

[JeffKohn]

I'm surprised you say that all other browsers work correctly, since last time I checked FireFox was the only windows browser that worked correctly on wide-gamut monitors.

The problem with IE is that it while it respects the embedded profiles in images, it ignores your display profile and assumes sRGB output. There's nothing you can do about it until Microsoft fixes it in a future release. Just one of many reasons I switched to FireFox a long time ago.

Any thoughts on this? I certainly don't want people looking at my portfolio in IE (as most clients likely will) to see nasty off color, over saturated images.

Nothing you can do.  I'm guessing the number of users who have wide-gamut monitors and know how to configure things to get accurate color reproduction in the browser is fairly small. Even if IE supported monitor profiles, users would need to have one associated with their display for things to look correct. Fortunately it's not really an issue for standard displays where the gamut is a reasonably close match to sRGB.

[JonathanRimmel]

Correction, Opera doesn't display properly either.  But what gets me most, is that these images I upload are already sRGB, so I don't get why IE would have a problem. Isn't that what it defaults to?

[MarkM]

But what gets me most, is that these images I upload are already sRGB, so I don't get why IE would have a problem. Isn't that what it defaults to?

I think Jeff's answer explains this. If the browser is substituting sRGB for your display profile it doesn't really matter how it interprets the image unless your monitor happens to be close to sRGB. Since you have a wide gamut display it obviously isn't. So, for example, if the browser takes a saturated red in sRGB and just sends those numbers to your video card, you will end up with a super-saturated red on screen.

I don't understand how bugs like this make it through beta testing.

[Simon Garrett]

To put what the others say another way:

Your monitor is wide-gamut.  That means it has a gamut (colour space) wider than the "standard" of most monitors of approximately sRGB.  So if you send values in sRGB to your monitor, they will end up over-saturated.  

With colour-managed software this is no problem.  A colour managed program works out the colour space of the image from the embedded profile (sRGB in the cases we're talking about).  Then it looks up the monitor profile (by asking Windows: this is the profile created when you calibrated/profiled your monitor).  Then it maps the individual RGB values from the image colour space to the monitor colour space, and then sends the modified values to the monitor.  

Provided the program does colour management, then any image looks right on the monitor.  Unfortunately, IE - even IE9 - doesn't do colour management properly.  

• Firefox and Safari both colour manage, but Safari does it only if the images contain embedded profiles.
• Chrome colour manages, but only for sRGB images.  A bit silly, but most images on the web are sRGB.  Oh, and it doesn't colour-manage pages containing any Flash content.  This is because it contains a built-in Flash player that doesn't do colour management. 
• IE 9 does colour manage any image profile, but perversely ignores monitor profiles (assuming all monitors to be exactly sRGB colour space).  So it's useless except on monitors with a colour space very close to sRGB

But there's a further bug that affects ALL browsers, to the best of my knowledge: even those that colour-manage do so only for the primary monitor.  They assume the same monitor profile for all monitors.  This is for simplicity: a web page has to be rendered only once, when it's downloaded (and not re-rendered if the browser is moved to another monitor).  

It's hard to imagine a more chaotic, half-baked set of browsers when it comes to colour management.  I mean, you couldn't make it up, could you?  I guess it shows how unimportant even vaguely accurate colour is to most people.  

[John.Murray]

Very strange!  Do you have a link to some images?

IE does support embedded profiles, but does not use the host's display profile:
http://ie.microsoft.com/testdrive/graphics/colorprofiles/default.html#

Firefox supports it's host's display profile if you set gfx.color_management.display_profile to your current system's installed display profile - specify the full path.  You can also turn on v4 support with gfx.color_management.enablev4, matching IE's behavior.  Point firefox to about:config to change these....

[Simon Garrett]

Very strange!  Do you have a link to some images?

IE does support embedded profiles, but does not use the host's display profile:
http://ie.microsoft.com/testdrive/graphics/colorprofiles/default.html#

Firefox supports it's host's display profile if you set gfx.color_management.display_profile to your current system's installed display profile - specify the full path.  You can also turn on v4 support with gfx.color_management.enablev4, matching IE's behavior.  Point firefox to about:config to change these....

I think that's what I said for IE - it supports image profiles, but ignores display profiles.  It apparently "passes" the test on the link you give, as that test doesn't test whether the display profile is used.  

For Firefox, I don't that's quite right.  Colour management defaults "on", and you  don't have to set gfx.color_management.display_profile unless the system default isn't the correct profile.  If that parameter is null (the default) than Firefox uses the Windows system default (which is normally what one would want).  Yes, you need to turn on v4 support if you want it, but lots of programs don't support v4 profiles (including Lightroom) and I would recommend anyone to use only v2 profiles for the foreseeable future.  The only about:config parameter in Lightroom that I alter is gfx.color_management.mode, which I change from the default of 2 to 1.  By default (if the parameter is 2), Firefox doesn't colour manage graphics with no embedded profiles.  This is rather annoying on a wide-gamut monitor, as virtually all graphics objects are sRGB, and without colour management are too saturated - which of course is the core of this thread!

Curiously, Chrome gets this one right (it colour-manges untagged graphics, i.e. graphics without embedded profiles), but even then you have to turn on colour management in Chrome by starting it with command line switch “--enable-monitor-profile”.

Edited: sorry, you asked me for a link to images.  I can't think of anything suitable, although I could make some screen captures perhaps.  I've figured out what the various browsers do by trying them with various images in different colour spaces, both with embedded profiles and without, and on two different monitors: one wide-gamut and one approximately sRGB.  In combination, that shows pretty well what isn't working. 

One benefit of having two monitors with markedly different colour gamuts: colour management problems are immediately very, very obvious!

[Colorwave]

There's nothing you can do about it until Microsoft fixes it in a future release.

Let me correct that for you:  "There's nothing you can do about it, except cross your fingers for the slim chance that Microsoft gives a $hit and decides to fix it."

[JonathanRimmel]

Let me correct that for you:  "There's nothing you can do about it, except cross your fingers for the slim chance that Microsoft gives a $hit and decides to fix it."

Yes, that seems to be the only solution for now. It does look like browsers only take the color space of the primary monitor. That may be why my lower gamut monitor also looks a tad off.

[digitaldog]

• Firefox and Safari both colour manage, but Safari does it only if the images contain embedded profiles.

Safari assumes all untagged images are in display RGB which is a bit goofy. Least on Mac OS. Most images on the web may be in sRGB but is there an embedded profile? Mostly not.

But there's a further bug that affects ALL browsers, to the best of my knowledge: even those that colour-manage do so only for the primary monitor. They assume the same monitor profile for all monitors.

Not an issue on Mac OS.

Best way to test the browser:

http://www.color.org/version4html.xalter

[Simon Garrett]

Not an issue on Mac OS.

Sorry, I was being PC-ist!  I have tested only PC browsers, but didn't think to mention it.