Vantage21st

PhotoShop Work Flow for Preparation of GIF Images
Compatible with Adobe™ Photoshop versions 6.x, 7.x CS and CS2

The steps in this guide are generic to the GIF preparation process. You may use these steps when using other graphics programs like The Gimp, Corel Paintshop Pro or Adobe Fireworks. The menu items will be in different locations however the generic process will be the same.

  1. Illustrations and graphical images that are NOT photographs are best saved as GIF files. These files may come to you in one of many formats including BMP, TIF and EPS.
  2. Never work on or make any changes to your original image.
    File > Save As >
    and save a working copy. Append the word “working” to the file name. For example: if your original image file name was rose.tif name the copy rose_working.tif. Use all lower case and no symbols the underscore is OK.
  3. If the image is a TIF you will see a different dialogue box. In the TIF Options dialogue box look for the Byte Order section. If you are working on a Mac select Macintosh. If you are working on a Windows computer choose IBM PC. All other settings may be left as they are.
  4. Check Image > Mode
    If CMYK has a check next to it, click on RGB to change the mode from CMYK to RGB.
  5. File > Save (save your work)
  6. Crop if necessary – select the crop tool on the vertical tools palette. Draw out the crop area and crop the image.
  7. Color Correction : Unlike JPG images or photographs most illustrations are true color and do NOT need color correction.
  8. Image Size : The image may be the right physical size in pixels for your web page. It may also be too large. If the image needs to be reduced in size follow this procedure.
  9. Check Image > Image Size The Image Size dialogue box will open

    Towards the bottom of the dialogue box look for the two check box items Constrain Proportions and Resample Image. If either box is unchecked place a check in the box. Verify that “Bicubic” is selected in the drop down menu to the right of Resample Image. In newer versions of PhotoShop including CS and CS2 there is a third check box named Scale Styles. Check this box.

  10. Resolution : Normally original illustration files are high resolution and may be 240 or 300 ppi. If you are using Photoshop you do NOT have to manually reduce the resolution manually in steps to 72 ppi. When you use the PhotoShop or PhotoShop Elements File > Save For Web tool the amount of colors will be reduced from millions or thousands of colors to 256 colors and the resolution will automatically be reduced to 72 ppi.

  11. Reduce The Image Size : Select Image > Image Size
    At the top of the dialogue box under “Pixel dimensions” locate the Width and Height fields and reduce either the Width or Height value in pixels The other dimension will automatically reduce proportionately.

  12. Select: File > Save for Web to save your file as a GIF image.

    The Save For Web dialogue box will open click on the Optimized tab at the top.
    On the right select GIF from the drop down menu.
    For further instructions on what settings to select please refer to the Vantage21st PhotoShop guide How to use the "Save For Web" tool .

If you are using another graphics program like PaintShop Pro or perhaps an older version of PhotoShop follow this general procedure.

Follow the generic steps 1-12 above. These will be common to most graphics and imaging programs. Then do this.

  1. Change the Mode to Indexed or Indexed Color
  2. File > Save AS > and select either Compuserve GIF or GIF89a
  3. For a more detailed discussion of the procedure used in older versions of PhotoShop refer to the Vantage21st guide GIF peparation for PhotoShop versions 5.0 and earlier. Some of this information may alos be helpful if you are using a program other than PhotoShop.

End Notes: Most tools used in this workflow are available in popular photo imaging programs like Fireworks, Image Ready, PhotoShop Elements, PaintShop Pro, The Gimp and Corel PhotoDraw.

Good Free Imaging Software: The Gimp or “ GNU Image Manipulation Program” is a free photo imaging program. It is available for Windows, UNIX and MacOSX here http://www.gimp.org/.

Copyright 2004 - 2007 John Sedgwick
All rights reserved

Revised March 2007