The introduction of graphical Web sites has enabled us to turn the web into an art form as well as an informational tool. At the same time graphics have turned the web into a bloated maze of download time. Nothing will turn a potential user away quicker than having to wait for what seems like hours for a site to load. Graphics are larger than a plain HTML document and therefore slow down the time it takes to view a page.

So how do we avoid long download times that turn our users off? There are a few principles to follow: make your graphics meaningful and small.

Keep 'em Useful

Like the trite old phrase says, "a picture's worth a thousand words." Why say it when you can show it? Some people take this idea too literally. Unless you're working on an online gallery of artwork, product photos or something similar, keep your graphics to a minimum.

An illustration to a story, a small graph for statistical use, maybe even a graphic template with rollovers for navigation are all fine, but a giant image that takes up an entire page is not. If you feel you must have an image that spans your entire 640 by 480 window, break it up into pieces. Smaller pieces of an image are faster to download than the Titanic of all graphics.

Remember that the web began as a means to communicate through text. Graphics were an afterthought that made the web more appealing to the populace. By keeping your graphics to a minimum, you are saving your audience from the all too familiar frustration caused by long waits.

How small is small?

Keeping graphics small has almost nothing to do with the physical size of the image. It has everything to do with the file size. Making a graphic small enough for the web is about image compression. If you're not familiar with that term, here's a few names to jog your memory: GIF and JPG.

GIF and JPG are both file formats that allow you to compress your image. How do they do it? By reducing the amount of useless colors in your images.

Every image, unless it's a strictly black and white line drawing without the slightest trace of grey, has more colors than you will ever notice. If you take out the unnoticeable colors you're left with an image that has a smaller file size and basically looks the same as your original.

JPGs are mainly used for photographs. They can have millions of colors, they can be compressed to tiny sizes. That would make JPG the logical choice for anything, right? Not exactly. JPGs are "lossy" formats. They can look really bad because they lose pixel data and end up looking grainy or showing prominent pixels in the image. JPGs are saved as high, medium, or low quality with compression sizes going from one to ten.

On the other hand, GIFs can only hold up to 256 colors, which means that all of those lovely shades of violet could be reduced to three shades and some grays. GIFs are great for most types of images because most of the time you don't need more than 256 colors. Of course, since 256 is the maximum amount of colors you can have in an image, that means that your file size is actually pretty big. For GIFs it's usually a good idea to keep the number of colors to around or under 128.

Graphics are a great way to add some life to a site. They can help you navigate, show you ideas, and bring you to places you may never be able to go. The key to graphics is to have those visual elements without frustrating your users. Compression and appropriateness are two ways that you can ensure that your work won't go unnoticed.