IMC Home Page | Library Home Page | UAlbany Home Page

Index

This tutorial provides information on the basic elements of Web page color use and presentation. It is not meant to be a comprehensive course on Web site construction. It is intended to be an introduction to color for the Web, its uses, and its limitations.

The tutorial takes about 10 to 15 minutes to complete. Clicking on any selection in the Table of Contents below will take you directly to that portion of the tutorial.

 

The Basics

Illustration of a CRT monitor and color electron guns

The use of color on the World Wide Web has often been portrayed as a source of mystery and arcane science. In reality, Web color and how it can be used follows relatively simple principles that are easy to understand and apply

The first thing to understand is how color is produced on the screen of a computer monitor. An old-style CRT monitor screen are made up of small dots of phosphor called “pixels.” There are three pixel colors, red, green, and blue. A standard computer monitor has three electron guns, one each for red, green, and blue. Each electron gun “shoots” electrons that illuminate pixels with the matching color. The diagram on the right demonstrates how a CRT monitor works.

 

The pixel patterns of an LCD monitor

A modern LCD or LED monitor, tablet screen, or smart phone display is also made up of pixels, but the pixels are activated when a voltage is applied to them. When they are switched on they display as either red, green, or blue. But when no voltage is applied and they are switched off they appear black.

The diagram on the right illustrates how LCD pixels are arranged on a monitor screen.

 

 

Animated image of an LCD monitor showing the actions of the pixels

The illustration on the right demonstrates how the pixels in a monitor might be turned off and on as the image changes. Such activity occurs when a video is being viewed or when you change from one Web page to another. In some instances, such as when a game is being played, the switching occurs much faster.

 

 

 

 

The monitor display setting of a Windows computer

Varying the “amount” of red, green, and blue produces different colors. This is called the RGB system. The typical computer monitor today is capable of producing up to 32 million colors. The settings for a monitor are specified using a Display Properties panel similar to the one on the right.

Originally, Web browsers use color pallets. These pallets consisted of the 256 specific colors that were available in the early color computers. Of the 256, only 216 were theoretically the same on both Macintosh and PCs. 40 colors were reserved for computer use. The remaining 216 colors are called “browser safe” because they are supposed to be presented identically by browsers on both PC and Macintosh computers and should be capable of being displayed by all computers.

This meant that in the "old days" a computer might be capable of displaying 32 million colors it was limited, by the browser, to displaying only 216 colors on a Web site.

Modern browsers are vastly improved display engines which means that they are now capable of displaying nearly any color imaginable. It is generally considered that it is no longer necessary to limit the color pallet of a Web site.

Click here to go to the next page, Colors and Hexadecimal Values