[kvandekrol]

site: http://s92622896.onlinehome.us/bbc/beuteltest/

Problem: The header image's colors. It all looks fine in IE and FF on a PC, but when I checked it on a friend's Mac with Safari, it rendered like this:



Apparently the colors aren't web safe. I thought this quit being a problem in 1996 once everyone replaced their 256-color monitors?

The header image was originally a PNG, but due to IE's crap PNG gamma rendering, I switched it to JPG, which was working just fine until I Mac'd it.

Anyone have any suggestions for making it work? What am I doing wrong?

[d3mcfadden]

Ive ran into this same issue before and have not been able to pin down exactly what causes it... It is very rare though.

[Intrinzik.v2]

i dont think it has anything to do with the browser more than it has something to do with the monitor its being displayed on. #22313a (Hex of the outside color) (#23313a) Hex of the color inside color (Darker color) . I took a prnt screen and checked the colors and that what it came out to. Change the background color of the image to #22313a and it should work because its of a little but a little on a monitor with different color settings may make a big difference.

[hawken]

by habit, I often zap the background of any image like that into transparent.

[kvandekrol]

In Photoshop the image's background is #22313A, just like the rest of the header, but when I save it, it converts it to #23313A. I tried saving the jpeg header image a number of different ways and it still did the same thing every time. Am I doing something wrong, or is it just a problem with the compression that I have no control over?

For now I decided just to change the header background to #23313A to match the image... but if that makes the whole header the darker color when viewed on a Mac, I would really prefer to have it all the lighter color. (Incredible how much difference that one number is making!)

Any pointers on how to get the jpeg to do what I want?

[kvandekrol]

anyone?

[u982744]

What colour settings are you using in Photoshop? Perhaps your working space is set to something other than sRGB? If so that might be your problem.

[dorian]

by habit, I often zap the background of any image like that into transparent.

the image is a jpg.

but h is right - your image should be something like this:
(you ought to recreate it yourself though - I worked with a JPG - it's not really advisable to reoptimise this way...)

besides - a gif in this case is about 5 times smaller in file size!

[dorian]

The header image was originally a PNG, but due to IE's crap PNG gamma rendering, I switched it to JPG, which was working just fine until I Mac'd it.

run your png's through png crush and it will display just fine across browsers.

[chazthetic]

that image should be a gif anyway, it's not a photo and only has a couple flat colors (run it with 8-16 colors and it'll be super small and load quickly too). Then you won't run into as many problems with the background as you can make it transparent.

[kvandekrol]

Yeah, I actually decided to go with a transparent-background PNG. Works just fine. Thanks for all the help!