A well maintained website draws attention of everybody. Various attributes make a website unique like its design, lay-out, color combination etc. Recently, E-commerce has created a new demand for accurate rendering of product images. Preparing images for web publishing generally involves scanning your images, saving them at the highest possible JPEG compression level and ending with the hope that it is precisely displayed on your cyberspace. But more often, you would find the image looking very differently what you remembered.

First of all, monitors play a major role in color distortion. No two monitors display colors similarly. There are several reasons for this inconsistency such as variances in monitor design, graphics cards, computer configurations and even surrounding room lighting. Most of the desktop computers still have Cathode Ray Tube (CRT) technology. The gamma setting is very essential, as it affects how pictures appear on your monitor. People provide different explanations on what gamma is. Generally speaking, gamma controls the intensity of the middle tones, which affects the overall rendering of your image. When pictures look either “washed out” or “too dark,” there is a strong possibility that the gamma setting is incorrect.

Most designers are aware that images created on a Mac appear darker than those created on a Windows PC and vice versa. The gamma setting is responsible for those differences. The default gamma setting on a Mac is 1.80 and for Windows it’s 2.20. Recently, Hewlett Packard (HP) had done a survey of monitors and found a very wide distribution of gamma settings. In average number of monitors, gamma was set at 2.20 (Windows) with a standard deviation of 0.20. So the monitors out there are displaying your images at varying intensities, which affects their color rendering in a big way.

One solution to this problem is to embed your color profiles or tags into the images. As a result, home computer systems can read those tags and adjust the image accordingly. The International Color Consortium (ICC) has defined a standard method for creating a device description of color behavior. It’s called an ICC profile. There are a number of calibration utilities available to measure displays and create accurate ICC profiles. Many devices supply ICC profiles in their software packages. Now both Windows and Mac operating systems have color management built into their software. Windows calls their system ICM and Macs use the ColorSync system. Whatever be the system, the main objective is color accuracy.

Web designers can contribute a little bit on their part to solve this color accuracy problem. You need to play with the gamma control panel and find the medium that best suits your needs. Then adjust all your monitors to display the same setting. You can use software calibration systems, such as ColorSync and Pantone Personal Color Calibrator (P2C2) which are affordable and effective for web publishing. You need to calibrate all your devices to ensure consistency among workstations. Use image editor like Adobe Photoshop to embed your ICC monitor profiles. It is always a good idea to save a high-quality version of your scans in a lossless, uncompressed format like Adobe’s .PSD, Windows’ .BMP, TIFF etc. Mention the color management system you use on your website for the convenience of your visitors. In the end, test your site on different platforms and browsers to make sure that the images are displayed correctly.