Optimizing GIF Files

Gif files can use up to 256 colors. They often don't use all the colors. You can save space by reducing the number of colors in your file.

Are you going to use the color-safe palette*, or a custom palette? How complicated is your image? Are you sure you want to limit the colors, and not just allow the browser to dither the image? (Saving it as a jpg would allow the browser to do the work.)

Let's start with something simple; a web graphic using the 216 color web palette. More often that not, my graphics only use a portion of the 216 color palette. I don't think I have ever created something that used all 216 colors. Lets use the dragon as an example.

This is the palette for the dragon. He only uses 104 colors out of the 216 in the web palette. He is currently 12k. With the additional unused colors stored in his file, he jumps up to 14k.

To reduce the palette in Photoshop, simply save as indexed color, revert back to RGB, then back to index, and save as exact. You now have a compact little gif file. Keeping the dithering down will also help keep your file sizes down. There is an option when saving as indexed to dither or not. Experiment with this option. The dragon was saved with dithering off. Large areas of a single color take up less space than dithered areas of mixed colors. Gifs compress better when there are horizontal bands of the same color.

You can create an action that will do the above steps for you in Photoshop.Create one action to dither, and one that doesn't dither. If you use layers, include a flatten image command in your action. Remember when using actions, there are no undo's. Copy the image into the clipboard before you perform the action.

Color Safe and Dither Box are plug-ins that allow you to create patterns with the 216 color palette that will appear to be colors outside the pallette. They give you more choice for colors. The files created with these plug-ins will be larger, because of the dither pattern they create.

*The Color Safe pallet was created from the 216 colors that the Mac and PC shared back in the days of 14 inch monitors and we could only see 256 colors.


Copyright © 2014 Cyber Element, Inc.