Building 3D Models for the Web

Technical Details of 2D Web Graphics

Can contain up to 256 colors. These colors are stored in a list called the color palette. You should use the Web safe palette that consists of the 216 cross-platform colors.
Files are compressed by building a catalog of repeated patterns in the image. This is especially effective for logos and other line art with areas of solid color. It is not effective for photographic images. If your original image contains too many colors, then the color palette will be crushed to 256 colors, possibly degrading the image. Once the palette is crushed to 256 colors, the compression algorithm will not degrade the image any further--none of it is lost in the compression process.
One of the colors can be replaced with transparency. This is especially effective if the background color is made transparent. The globe graphic in this example has a transparent background.
GIF graphics can be interlaced (or interleaved), so that the image gradually fills in as it is loaded. Here is an example.
A GIF file can be a sequence of images, which results in an animation.

You can reduce file sizes by:

Supports 24-bit graphics--millions of colors--for monitors that are 24-bit or greater. Will dither the image on 8-bit monitors.
Uses a complex algorithm (called a Discrete Cosine Transform) to compress the image. This algorithm loses some of the image's detail, depending on how much you compress the image. It does not work well on images with sharp lines of contrast, such as logos. It does work well on most photographic images.
Does not support transparency.
A recent extension to JPEG, called Progressive JPEG, supports interlacing, but it is not as well supported in software packages as GIF interlacing.

Portable Network Graphics

A new standard that attempts to overcome the shortcomings of GIF and JPEG.
Can use 8-bit graphics or 24-bit graphics
Compresses images by cataloging patterns, similar to GIF but looks for more patterns.
Supports transparency.
Not supported yet in all Web browsers.

Background Image

Loads much faster than background image
Specify color using hexadecimal format
Should use one of the 216 Web-safe colors to avoid dithering
Can also color text and links. The page that you are reading is formatted this way using the BODY tag:
<BODY BGColor=ffcc99 TEXT=003399 VLINK=cc3300 LINK=663300>
Be certain to use readable color combinations
Some browsers, such as Netscape, allow you to use color names, such as "steelblue" in place of hexadecimal colors. But, hexadecimal colors are supported by more browsers.

Maintained by H. Edward Donley <hedonley@grove.iup.edu>
Last Modified Monday, 13-Aug-2001 16:53:26 EDT