Setting up color management in Adobe Photoshop for web publishing

Color management is usually a pain in the ass and there is never a silver bullet solution for all cases. That said, here's some findings and suggestions regarding how to setup color management in Adobe Photoshop for web publishing. Keep in mind that the settings I am using were on a Macbook Pro running OSX, so you may need to tweak your own settings accordingly.

I have found that when designing for web output, you should strip all color management from images (in most cases). Here's some reasons:

1. Even if the color profile in the image is read, the colors in the page (e.g. hex color values) are not managed (or default to sRGB61966-2.1).
   

   If your monitor is profiled to 2.2 gamma and 6500 degrees Kelvin, there should be minimum change between an image that has no color profile (untagged) and sRGB IEC61966-2.1 color space.

2. ICC profiles are just too large for web use:

   While Safari for Windows-based computers makes color-managed web browsers more common ... adding color profiles increases file sizes, about 4K per photo.

3. Color consistency in the page is more important than accuracy. Sucks, but its true.

So, how should you work in Photoshop (CS3 as of writing) when doing web work? Well, I'll suggest a pragmatic (albeit not ideal) solution:

1. On my Mac, I choose to leave the monitor's color profile at the factory setting ('Color LCD' on my Macbook Pro). Sucks, I know, but keep in mind who your target audience is (i.e. out-of-the-box computer users).
   
2. In Photoshop, set 'Color Settings' to the 'Monitor Color' preset.
• Modify the 'RGB Working Space' by setting it to 'Custom'. This should start with your default gamma settings, etc. Change the gamma to 2.0. Since Mac gamma is 1.8 and PC uses 2.2, a gamma setting of 2.0 should give you a reasonable split. This will ensure that when you are working on designing images, you won't be too far out of whack between Mac and PC.
  
3. Adjust the 'Save for Web' dialog
• Click the flyout menu at the top of the window (to the right of the 'Optimized', '2-up', '4-up' tabs) and set the view to 'Uncompensated Color'.
  
• Click the flyout menu (next to preset on the right-hand side) and make sure that 'Convert to sRGB' is turned off. This will avoid color shift in programs that use ICC profiles (e.g. Safari).

Now, you will notice that when you go to 'Save for Web', the images will be slightly lighter in gamma (on a Mac, darker and deeper on PC). This is because you are now seeing the image at your native gamma setting (in my case, 1.8 instead of 2.0). So, you are seeing how the image will look on a web browser on the Mac.