Why graphics are a bit difficult
Image maps and graphics slicing
Graphics
Jeff Williamson
Northern Virginia Community College
www.nvcc.edu/home/nvwillj/html-graphics/
nvwillj@nvcc.edu
Transparencies
All graphics on the web are rectangular. Transparencies are a way to allow art work to appear non-rectangular. They do this by making one color in the art work transparent.
GIF files support transparency; JPEG files do not. GIF transparency is a standard feature on commercial graphics packages such as Photoshop and Paintshop Pro.
I don't use transparencies often because the same effect can be had for solid-color page backgrounds simply by painting the graphic background the same color as the page background:
|
|
|
| Transparent image, white page background | Same image, red page background |
|
|
|
| Non-transparent image with white filled background, white page background. | Same image, red page background |
Because images use multiple colors, a page that uses an image background will pretty much require transparent graphics.
One frequent problem in transparencies is halos - the white schmutz you see around the letters below:
 |
Halos in my understanding are caused by anti-aliasing. Anti-aliasing is the automatic addition by a graphics program of intermediate colors to make lines which are not perfectly straight appear less jagged:
|
|
|
|
|
|
|
Figure 3: Figure 1 file, developed with some antialiased features on a white background and set for white background transparency, now displayed on a blue background. Halos are the not-exactly-white colors added by antialiasing. |
To sum up:
Images on the web are always rectangular; transparencies can give the illusion of non-rectangular images.Transparent GIFs can be created with standard commerical graphics software
Solid-color backgrounds do not require transparencies; image backgrounds do.
Transparencies that are set for one background color and then used on a mixed or different background are likely to develop halos.