...Previous Page   Consider the GIF images below and note the file size printed underneath:     4868 bytes 3085 bytes 1782 bytes The GIF on the left is largest by far. This is because the use of blended colors means that most side-by-side pixels are different colors, and can't be represented in the file by a simple run notation. In this case, nearly all of the pixels values are saved and compression is low. The GIF in the center is over 30% smaller than the first. But note that it is a complicated image. While it basically only uses two colors, the complexity means that pixel runs are not as long, and so the file is larger. On the other hand, the GIF at right is very small. High compression was possible here because the image is simple, producing long pixel runs. Although certainly not a technical specification of GIFs, knowing how they are compressed should give you enough information to create very colorful, yet surprisingly small, GIF images! Reducing The Size Of GIF Files: Of course, some images you'll use like photographs, clip art, or pre-made Web art are already created! Nevertheless, you can still optimize the size of these files by using the information above. See also the section entitled The Best Image Tools and check out how the on-line GIF Wizard can reduce image size greatly! Other Image Tips And Uses   Transparent Images: Another great feature of the GIF file format that can enhance your design is its ability to treat a particular color you select as a transparent color. In other words, wherever pixels exist in your image that have the value of the transparent color, no color will be displayed there and the background (the color or image below the GIF image) will be displayed there instead. For example, the following image with no transparent color set... looks considerably different when the color grey is set as transparent, as it is in the same image displayed below: How you define a color as transparent will differ from program to program. In Paint Shop Pro, for example, you create a transparent color by choosing that color for your background, then making sure the Option "Set transparency value to background color" in the Save As window is checked when you save the image as a GIF. Check out the Image Tutorials link page to see if we have a link to a tutorial for the image processing program you use. If not and you end up finding one, please let us know and we'll add it to the list! Background Images: These are images that are downloaded to a visitor's browser and displayed as a page background. All of your text and images will be printed on top of this image. The most common background images are small images referred to a seamless tile images. Most image processing programs like PhotoShop or Paint Shop Pro will allow you to easily create seamless tiles from most any image, or you can download a prepared background from one of the sites listed in our Background Images list. There are two very important considerations to keep in mind with any background image you use: Be sure that your text and other images contrast well with your chosen background. Change your monitor's brightness and contrast adjustments to check the page as other people may see it. A visitor doesn't see anything happening while a background image downloads. Make sure that your background image is small enough to download quickly! A good rule of thumb is to keep background images to under 20K. The smaller the better. Background images can be either GIFs or JPGs. Consequently you can also get very creative with them. You can actually create a full-window background image by using a simple two or three color design with a GIF, or by increasing the compression of a JPG to around 90% (losing a lot of detail in the process, though!). ...Previous Page Image Basics ~ Using Photographs ~ Animated Images The Best Image Tools Copyright © 1997 by MicroVision Development, Inc.