/    Sign up×
Community /Pin to ProfileBookmark

FF/Safari images have different shade backgrounds

Copy linkTweet thisAlerts:
Aug 03.2008

I have a few images on my web page that use the same background color as that of my website, a dark gray.

In Firefox everything is fine and the images blend seamlessly, if you look at the site in Safari, the background of the images are a darker gray than that of the websites background.

Why is this and how can i rectify it? I didn’t want to use transparent PNG graphics as IE 6 doesn’t work well with transparent PNGs and there is a slight dip in image quality than that of JPG.

to post a comment
CSS

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@gil_davisAug 04.2008 — What code are you using for the background-color? Is it a word (e.g.: lightgrey) or absolute (e.g.: #D3D3D3)?
Copy linkTweet thisAlerts:
@WebJoelAug 04.2008 — This is rather a pain if the colors are branding colors (Corporate logo, etc., or colors that MUST be correct like showing colors of paint, clothes, wallpaper, yarn, etc. that must meet with the end-consumers expectation). They need to be EXACT colors.

Likely, your color managed browser reads each files embedded color profile and converts it to the monitor profile so if the monitor is not adjusted correctly, you get washy-colors, off-colors, etc.


I need to 'adjust/correct' my monitor colors, I'm sure. Every time I do a website review and complain about the colors, the owner of the site expresses surprise as what *I* am reporting, they do not see... Surely, they fault cannot be entirely theirs alone. I have heard this reported back to me too often for me to not be at least partially to blame..

Have you tried any online-adjustment sites. -I have not, but here is one that might help or give ideas what to adjust:

http://www.gballard.net/boutique/colorcorrecting.html

At least, knowing that YOUR monitor is correct takes the onus off of you for the image colors, if this is not the actual fault..

Note the line: "...[I]Mac computer monitors should calibrate to 2.2 gamma, 6500/D65[/I]."
Copy linkTweet thisAlerts:
@slaughtersAug 04.2008 — ..They need to be EXACT colors...[/quote]
Agreed.

...Have you tried any online-adjustment sites. -I have not, but here is one that might help or give ideas what to adjust:

http://www.gballard.net/boutique/colorcorrecting.html

At least, knowing that YOUR monitor is correct takes the onus off of you for the image colors...[/QUOTE]I played with the whole gamma correction thing back when I was doing 3D art. What I found was that all the fiddling with my monitor did not matter in the slightest. It was how everyone else's monitors looked like that was important.

As you said though, and as gil davis was implying, for this particualr problem, make sure the colors hex code values are exact matches.
Copy linkTweet thisAlerts:
@smyhreAug 04.2008 — This is basically due to Safari reading the embedded color profile in the images. The way I have delt with this before is to re-save the images without the embedded profile then it looks fine.
Copy linkTweet thisAlerts:
@slaughtersAug 04.2008 — Jpeg's have embedded color profiles ?
Copy linkTweet thisAlerts:
@smyhreAug 04.2008 — They can if they are done in photoshop
Copy linkTweet thisAlerts:
@adam_fakeauthorAug 12.2008 — I'll have to try and save the images without the Embed color file in photoshop - its such a pain in the ass!
×

Success!

Help @adam_fake spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...