Producing consistent color when creating images for the Web

Keeping colors consistent in images for the Web is a challenge. You have control over how your images display on your monitor, but you have no control over how they will display on other monitors. Additionally, most browsers do not recognize a document's embedded profile. They simply send the raw RGB values to your monitor. Without a profile, a computer's color management system must guess what colors a document's RGB values actually represent. Although it may seem impossible to produce consistent colors in an image for the Web, there are a few things you can do to keep the colors as consistent as possible.

To keep colors as consistent as possible in Web images:

Set up your monitor for a color-managed workflow

Calibrate and profile your monitor. Use a visual calibrator like Adobe Gamma (Windows), Monitor Calibrator (Mac OS) or, for more precision, use third-party software and hardware.

Set up color management in Photoshop

Choose Edit > Color Settings (Windows) or Photoshop > Color Settings (Mac OS) and specify the color management settings. You can either choose Web Graphics Defaults from the Settings menu in the Color Settings dialog box or customize the settings. If you prefer not to use the preset option, it's recommended that you at least use sRGB for your working space. sRGB is a smaller color space than Adobe RGB (1998) and supposedly represents the profile of the average monitor. Tagging your image with an sRGB profile increases the possibility that more monitors will correctly display the colors in your image.

(Optional) Convert the document to sRGB profile

If you have an image that's tagged with a profile other than sRGB, you can convert profile to sRGB so that the colors have a chance of maintaining a consistent appearance on a wide variety of monitors. Choose Image > Mode > Convert to Profile and choose sRGB for Profile under Destination Space.

Save for Web

Choose File > Save for Web. The Save for Web command gives you more control over the optimization of your image. You can specify the colors that are preserved when saving an image in GIF or PNG-8 format. In JPEG format, you have the option of embedding an ICC profile in the file. Currently, only Internet Explorer (Mac OS) and OmniWeb (Mac OS) can read embedded profiles in images if the user enables the ColorSync option in the preferences. If an image has no embedded profile, Internet Explorer (Mac OS) and OmniWeb (Mac OS) assume an sRGB profile for the image.

Website Hosting
Get a Domain Name
Search Engine Optimization
Email Marketing

Adobe Illustrator Tutorials