Photoshop makes a pretty good
GIF optimizer

Example: my GIF owl button started life at 110k

To reduce the size of the .gif file, I first reduced the pixel dimensions to 70% in Photoshop.

My image was still too big for a button, but I wanted to use it as an operator logo, or maybe a screensaver on a rarher primitive phone. The dimensions were about right, but I needed a really tiny file to fit in that pea-brained device.

To show you the picture here, I reduced the colours to 64 in PhotoShop Save for Web. The resulting GIF is 6.7k.

Reducing the colours to ten reduced the file size further to 2.6k.

Not bad when the file had started out at 110k.

As I hope you can see, the image lost little definition.

Steps to optimizing a .GIF
in Photoshop or Photoshop Elements

To cut the file size of an image:

First pre-edit your picture in Photoshop or Elements.

Crop to only the most vital part of your image.

Eliminate busy background.

Then go to the Save for Web window.

2-Up and 4-Up Views allow you to compare the effects different choices have as you downsize .gif images . You can try a few JPEGs here, to compare them with the results you get as a .gif.

Note that these are steps to take in the full Photoshop. They are similar in Photoshop Elements, though Elements is more - well, elementary. For instance it shows only two views, your original and the version you are working on.

Save the graphic as a GIF. (A JPEG will probably be better for a photo, though you cannot reduce a JPEG by eliminating colours. Experiment.) For a GIF, a little palette will appear and show you the actual colours your file contains.

Test Perceptual, Adaptive, Selective and Web Safe colour schemes to see the results you get.

Play around with the amount of dithering, noting the effect on your picture and its file size. Hues not found in the palette are simulated by dithering (stippling to create extra shades).


Now to cut the colours in your computer image. Do this first with the number box. Lock any hues you want to keep by clicking to select them in the palette, then clicking again on the little lock icon below. This will ensure they are notdiscarded when you try a lower number.

Test smaller and smaller numbers in the box until your picture starts to degrade, then opt for the best result.(If you have lost an important colour, increase the number again to get it back. Lock it and then reduce again.)

You willl notice there are two very similar shades of purple left here. I could have binned one of them, leaving only seven, with no loss of quality.

When you are down to a few colours, you may be able to eliminate yet more by dragging them to the waste bin one by one. (Or selecting them then clicking on the bin.) Do this until taking any more away makes the picture patchy, muddy or dim.

You can select one colour to be transparent. If it's white, make sure it is not, for instance, in the subject's eyes, or they will look as hollow as a Hallow E'en pumpkin! Colour a background you want transparent in a hue that does not appear anywhere else in the picture, then select that for your transparency.

Reduce the size percentage or pixel measurements. If you want your file yet smaller and you have not already reduced the image size in pixels, you can do it here. Click the 'Image Size' tab next to 'Color Table' in the lower palette. Be sure to click 'Apply'.

The slimmed down computer image you finally evolve will be 'Saved for Web' as the picture only, without additional data that could weigh it down again.

Keep your original graphic and save the edited version under a new name. Then you will always be able to revert if you decide your cutting was a bit too drastic.

Photoshop as a GIF optimizer
Save for Web does a dramatic job of downsizing

Photoshop as an icon maker

Vector images are sharp at any size

Which is best for small images? Vector or Bitmap?

History note. It's easier than it used to be to draw on a tiny screen!

© Valerie Beeby 2015