By Virtual Mechanics
| This week I shall discuss
how the computer uses color. This should help you to understand
the different color selection methods, the consequences of selecting
a specific color and how that color is going to be seen by a
visitor to your web site.
I first became involved with computers and computer graphics
as a Graduate student studying Architecture at the University
of British Columbia. I used a Tektronix storage display (it
was a few years back) connected to a mainframe to construct
wire frame 3D models of buildings. Storage displays draw bright
green lines on a dark green background similar to an Etch-a-sketch.
The school of electrical engineering got the first color pixel
display. I believe it had a resolution of 320 x 240 and displayed
16 colors. It cost 10's of thousands of dollars not including
a computer. If you did not have a mainframe available, that
was going to cost at least a few hundred thousand dollars extra.
I got my first color terminal a couple of years later. The technology
had progressed to the point where it had 640 x 480 resolution
and 256 colors but still cost over $20,000. It was ideal as
a low cost terminal for the creation of video animation which
I had become involved in.
For many years, 640x480 by 256 colors was the state of the art.
Graphics display's were and still are memory hogs. The most
significant difference with advancing technology was a rapid
decline in price as memory prices declined. Today you can get
a state of the art PC graphic card that will display 1280 x
1024 by 16.8 million colors for a few hundred dollars. Even
so, cost is still a significant factor. Only a high end PC will
include a high-end graphic card. Most low to mid-range new computers
as well as older computers will include something less.
So what is the deference between a high-end high-resolution
color display and a low-end display? How do they work?
A graphic display breaks a picture down into pixels (Picture
Elements). Each pixel references a memory location that stores
the color that is to be displayed. The number of pixels divided
horizontally and vertically on the screen determines a display's
resolution. A 640x480 display has 307,200 pixels. In a monochrome
display, each pixel can be represented by a single bit that
specifies if the pixel is
On or Off. With 1 bit of memory a 640 x 480 display would require
38,400 bytes to store an image.
To display color, additional memory is needed for each pixel.
The number of bits available determines the number of possible
colors that can be displayed. An 8 bit display uses 307,200
bytes at 640 x 480 while a 24 bit display requires almost 1
Meg. A high-end display at 1280 x 1024 x 36 bits will need over
5 Meg. 5 Meg's of memory by today's standards is no longer very
expensive but only a few years ago it was.
Bits represent colors as Red, Green and Blue intensities. An
8 bit byte can represent 256 values while 16 bits can represent
65,536 values. When using 24 bits, each of the Red, Green and
Blue values can be represented by 256 separate intensities in
each of 3 bytes. This is usually referred to as True Color because
the 16.8 million possible combinations are greater than the
total number of colors that can be distinguished by the human
To use an 8 bit value to represent a color, the bits must be
divided as evenly as possible between the Red, Green and Blue
values. If 3 bits are used for Red and 3 bits are used for Green,
then 2 bits will be left for Blue. This would provide 8 possible
intensities for Red, 8 for Green and 4 for Blue to create 256
possible colors. This method however, would not provide any
flexibility in the 256 colors that
could be created and used.
To provide greater flexibility in creating colors on an 8 bit
display, a color lookup table is usually used. This works by
allowing the pixel to reference one of 256 color table locations
instead of an RGB value. Each color table location then contains
a 24 bit RGB value so that any of 16.8 million colors can be
created. The limitation is that only 256 of them can be used
at any one time. The color values in the table however, can
be changed whenever it is needed. When they are, any existing
pixel references to these colors will immediately change. This
will cause an anomaly that I am sure many of you are familiar
with. The images on the display will momentarily display scrambled
colors until they can be redrawn with the new color table values.
My apologies if all of this sounds excessively technical. My
experience however, is that many people don't understand why
things sometimes go wrong with the colors on their Web Site
and in their pictures. "It looks great on my machine. Why
does it look like something out of a spotted bog on yours?"
How can you fix it and avoid it from happening in the future?
When someone has their display set to true color 24 bit mode,
they will nearly always see the colors that are used on your
Web Site and in your pictures. Problems usually occur when 8
bit color tables are being used. This is because the colors
that are stored in the color table do not match the colors that
are specified on the web site.
Consider an extreme case where an 8 bit GIF image has been rendered
using 256 shades of red but the loaded color table contains
256 shades of blue. Which colors will be displayed?
Next week I will discuss selecting colors on your Web Site for
the typical visitor. How likely is a visitor to have a monochrome
or 8 bit display? Should you design your web site for them?
Which colors are safest?
Source: "IMS Web Tips" is a weekly news letter for
all web site managers regardless of experience who are looking
for detailed information on creating, maintaining and promoting
their web sites.
To subscribe send an email to firstname.lastname@example.org
or visit www.IMSWebTips.com
for subscription information and a list of past articles.
[an error occurred while processing this directive]