Color profile problem in Photoshop.

T

Travis86

Registered
I asked this on another forum, but got no reply, so I think I'll ask it here.

I am making a page about Firefox for my website. I have a Firefox logo that I got off of the Internet, and I made a little picture that is part of the navigation. All of this is on a background that is set with an HTML color. The the background of the picture I got off of the Internet is the same color as the picture I made, and is also the same as the HTML background.

My problem is that the image I got off of the Internet matches the HTML background, but the image I created doesn't match. If I don't "Save for Web", the picture I made will match in Firefox, but it won't match in Interent Explorer. However, the picture I got off of the Internet matches in both browsers. This is very strange.

I have looked at the color profile settings, but they all look right.

What should I do?
 
A couple things. And welcome, by the way!

1) What type are the images? Jpg? Gif? If they are different types they will display colors differently.

2) Are you saving them out the same way? Obviously when you use different compression schemes you will exclude/include different colors and get differences between images.

I think you may need to not edit the image for it to match your (and hence the other site's) HTML background.

Also, remember too that if you are copying someone else's site there could be some ramifications and action taken against you depending on how large or popular the website is.
 
...and ten days later I write back. Sorry.

I uploaded the page to TravisDart.com/firefox so you can see what I am talking about. I got one of the ways to work, but I don't know why it works and the others don't.
The bump on the left is a png I made with "Save for Web" on Photoshop, the bump in the middle is a gif I made with "Save for Web", and the bump on the right is a png I made with plain old save in Photoshop. The left bump is a lot lighter than the background in Firefox and is a little bit darker than the background in IE. The gif is a tad bit lighter in both browsers, and the right png is just right in both browsers. Why is this?

Thanks.
 
The easy answer to your question is that if you compress/optimize images in different ways, they're going to look different on the web because you are taking different bits of color information out of the image. If you do all the buttons the same they should all come out the same. :cool:
 
But shouldn't there be a way to get it to match?

(Also, now that you've seen the page, I'm going to change it so there's only one bump like there is supposed to be.)
 
There's a way to get them to match. You can sample the color from the bar you want to match and then paste that color into your buttons. Make sure you compress the images in exactly the same way/level. If you save the images with different compression levels you are going to get different colors.

Bottom line: Compress all your images the same way, with the same colors used and they will all end up looking the same.
 
Just now I was trying to overcome the same problem, and I was finally able to recreate it in Photoshop. I just set the original picture to use standard Macintosh color, and one color is lighter than the other.

What's causing this? A color profile for the monitor, a Photoshop color profile, or what?

This is so frustrating...
 
Like I said in an earlier post, images created with different compression rates will have different colors. You have to create your images in EXACTLY the same way for them to match. Or you have to use your dropper tool on the existing image and use exactly that color in your new image.

I can't stress this enough: Images from different sources are almost always going to look different, no matter how close you try to match them by hand.
 
You must log in or register to reply here.
Back
Top