The situation: a designer emails the layout but the layout person receives a total gibberish incarnate (in case the designer uses Windows OS and the layout person - MacOS). Alternatively, the layout person saves the image and voila - the colors have shifted.

Let's find out what's going on and how are we to live with it.

A brief excursion into the theory. To display the colors, our monitors use the RGB color model. However, since monitors of different models and makers are different, companies proposed several alternative color models relevant for an "average" monitor. Here we're interested in the sRGB model.

sRGB – is color model that displays the same graphics identically, be it on a fancy latest notebook model or on an ancient workhorse laptop.

sRGB is the default model for displaying graphics on the Internet.

The difference is in the profiles

A clever layout coder would set the profile to North America Web / Internet. Make sure that the Working Spaces indicate the sRGB model. 

A clever designer also would have chosen this profile when creating a site layout. Then there are no problems.

Apart from working with the correct profile your Photoshop also must display the true view of the layout. Yet as the latest monitors are unlikely to use the average sRGB, you must check the Proof Colors checkbox - this makes sure that your Photoshop displays the images according to the profile.


The OS differences

Windows default graphic handler applies the sRGB profile, that is, even if you did not select this profile you still get the sRGB. However, MacOs uses monitor profile as the default, which is bad. The profile you use in the graphics editor would have the crucial difference.

There is another difference: with Win, the default gamma level is 2.2, with Мас 1.8 (at least with the latest OS version). Because of this, images drafted on Mac look darker in Windows, and vice versa. If a designer wants to attain enlightenment, they must raise the Mac gamma level to 2.2 (
Adjustments -> Displays -> Color -> Calibrate -> Continue -> 2.2 Photovisual Gamma…)

Click on, name your choice and use it. Why raising on the Mac rather than lowering on the Windows? Because Linux also has 2.2, and it is rumoured that the new version of MacOS will come out with a gamma level of 2.2.

I've got the layout profile other than sRGB

This is the most interesting.

Happens. The designer has no idea that he runs his work on something like "Cinema HD_BQB01072007". Like, our thing is to draw, anyone can offend an artist, et cetera.

You're highly unlikely to to persuade the designer to transfer the layout into sRGB and redraw all colors. Well, only in case you have some absolutely outstanding charm (knowing how to handle an axe might help, too). No worries.

First make sure that we've ticked the following.

vector icons  

Now, when getting a "soiled" profile, we'll see this window.

vector icons 

What we can do here.

  1. We can apply the profile provided with the graphic

  2. We can convert the profile into our workspace.

  3. We can continue using our profile.

Many layout newbies keep on trying all three options until the picture is identical to the one that appears in the viewer (ACDSee or Irfan, for example). And stop on the third option. This is INCORRECT, because your viewer also displays incorrectly.

So let's say you chose the first option. In this case, when saving the images through the "Save for Web & Devices..." you need to tick off the "Convert sRGB". Otherwise, the saved file will be absolutely different from what we need.

vector icons  

This is important. In Photoshop CS3 the option is hidden here.

vector icons

I highly recommend choosing the second option — the conversion. Of course, after you've clicked your way into "Convert to Profile" and unticked this:

vector icons  

Because if the received profile uses more colors than sRGB, the Photoshop will try to replace the missing color with proprietary combinations. The truth is, I have no idea what it looks like as I've never seen it. Most likely, you'll get a partial color mismatch.

That's all. Please send in your questions.