Firefox Being Weird with Colour

[macka]

I went to Scott's gallery to check out the entries (wow!) and thought mine looked a little flat colour-wise compared to how I remembered it.

So I opened it up in photoshop and it looked heaps better. I had a horrible thought that maybe I hadn't used sRGB, but I definitely had.

So I opened up Scott's gallery in Safari, and the colours look great, exactly the same as in photoshop. So I thought the problem must be with firefox.

But then I tried opening the same page in Opera and Camino - colours look crap, same as firefox. Hmmm...

Why is this happening? Is this the result of some obvious stupidity on my part? Is there any way to fix it? Your help is appreciated.

Cheers

Edit: I found this article, could this be an explanation? http://blogs.smugmug.com/don/2007/02/14/this-is-your-mac-on-drugs/

[DaveB]

If the colour looks correct in Safari, that's probably because the JPEGs have the profile (presumably sRGB in this case) embedded, and Safari uses this and your monitor's profile to display the right colours.
Other web browsers (e.g. Firefix and presumbly Opera) just send the pixels to the video memory unmodified, and if your monitor is in fact quite different to sRGB then you'll see quite different colours.

Note that if the images don't have the profile embedded then Safari doesn't assume sRGB (which I would argue would be a reasonable assumption).
For most web images it's not worth the extra 3kB/image to embed sRGB, but for images like this I would recommend embedding the profile.


To check that this is what's happening, determine which profile is associated with your display (in the Display Preferences -> Color tab) then open up your image in Photoshop. The colours should look OK as Ps will be converting the colours. Try using Assign Profile to assign your monitor profile to the image. It should then look the same as it does in Firefox. But that's just to demonstrate - don't accidentally save the modified file!

[macka]

To check that this is what's happening, determine which profile is associated with your display (in the Display Preferences -> Color tab)

I am currently using a Spyder2express colour profile. I last calibrated my monitor about 2-3 weeks ago.

then open up your image in Photoshop. The colours should look OK as Ps will be converting the colours.

Correct, colours look good in photoshop.

Try using Assign Profile to assign your monitor profile to the image. It should then look the same as it does in Firefox.

You're right, when I assign my monitor's profile it looks the same as in firefox - ie. crappier.

So, are you saying I didn't embed the sRGB profile like I thought I had? Or that I did embed it?

I think what you're saying is that I did embed it, but because my monitor is quite different to sRGB, it looks different (crap) in firefox.

Would most people be seeing the images as I see them on firefox?

In future, for images being posted on the web, should I assign my monitor's profile and then do my editing? Or is this pointless considering I cant control how other people will see my photos anyway?

Sorry for all the questions, and thanks for your help. This is all very confusing.

[DaveB]

I am currently using a Spyder2express colour profile. I last calibrated my monitor about 2-3 weeks ago.

It should have calibrated your screen (using only the video card's colour lookup tables [LUTs]) to roughly a colour temperature of 6500K, gamma 2.2. On top of this calibration, Photoshop, Safari and other profile-aware software can use the profile to display correct colour.

However, the Spyder2express software doesn't give you a "pre-calibration" phase where it guides you through setting your monitor's brightness/contrast/RGB controls. If it did, most of the calibration can sometimes be done in the monitor, minimising the manipulation that has to be done in the LUTs and in the profile. The Huey is another example of a calibrator/profiler without hardware calibration. The Eye-One Display and the Spyder2 Suite and Spyder2PRO all prompt you through adjusting the display hardware.

What sort of monitor are you using?

So, are you saying I didn't embed the sRGB profile like I thought I had? Or that I did embed it?

I think what you're saying is that I did embed it, but because my monitor is quite different to sRGB, it looks different (crap) in firefox.

Yup, that's what it sounds like.

Would most people be seeing the images as I see them on firefox?

Only if they have a monitor as "crappy" as yours!
It's possible that using something better than Spyder2express would improve your monitor's behaviour, or it may be more serious than that.

In future, for images being posted on the web, should I assign my monitor's profile and then do my editing? Or is this pointless considering I cant control how other people will see my photos anyway?

Don't assign your monitor's profile if you're going to send the image to someone else: no-one else has your monitor. Assigning it was just a quick way of getting Ps to display the image without profile conversion.
The best we can do is follow the web standard and put all our images up on the web as sRGB. Whether we embed the profile or not is a 3kB/image question, and will only affect browsers like Safari that honour the profile.

But sRGB really is the best guess we have as to the behaviour of the average viewer's monitor. Unfortunately it sounds like it's not a very good match for YOUR monitor.

[macka]

What sort of monitor are you using?

I have a 13.3inch white Macbook. It's about 6 months old so I would expect the monitor to be functioning as new.

It's possible that using something better than Spyder2express would improve your monitor's behaviour, or it may be more serious than that.

Hmmm... ok. Might try another one sometime.

Don't assign your monitor's profile if you're going to send the image to someone else: no-one else has your monitor. The best we can do is follow the web standard and put all our images up on the web as sRGB.

Ok, that makes sense.

Thanks for the explanation.

[Yi-P]

Colours look just fine to me on a Windows Firefox 2.0 with Spyder2 calibrated LCD monitor...

[sirhc55]

Kris - you might find the following useful:
http://www.gballard.net/psd/go_live_page_profile/embeddedJPEGprofiles.html