• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 4. Creating Web Images > Exporting GIF Images from Photoshop

Exporting GIF Images from Photoshop

Use the GIF format for logos, banners, and other computer-generated images. GIF images are limited to 256 colors or fewer.

To export GIF images from Photoshop:

1.
Create an RGB image at 72 dpi (Figure 4.13).

Figure 4.13. Create an RGB image at 72 dpi. Since most monitors can't view images at higher resolutions, any higher value is just wasting bandwidth—and your visitors' time. And yes, that is a quarter moon.


2.
Choose File > Export > GIF89a Export (Figure 4.14). The GIF 89a Export dialog box appears (Figure 4.15).

Figure 4.14. Choose File > Export > GIF89a Export.


Figure 4.15. Choose the desired options in the GIF89a Export dialog box for transparency, color reduction, and interlacing.


3.
If desired, click the Transparency Index Color box to choose how transparency will be displayed in your image. For details on creating transparency itself, see page 70.

4.
If desired, choose an option in the Palette submenu or load a custom palette. For details, consult Reducing the Number of Colors on page 69.

5.
If desired, click the Preview button to see how the image will appear given the palette and number of colors chosen in the previous step.

6.
If desired, click the Interlaced option in the bottom-left corner. For more information, consult Interlacing GIF Images on page 73.

7.
Click OK.

8.
In the dialog box that appears, give the image a short name with the .gif extension (Figure 4.16).

Figure 4.16. Once you click OK in the GIF89a Export dialog box (Figure 4.15), the Save dialog box appears. Photoshop automatically appends the .gif extension to the name. If necessary, change the name and/or folder. Then click Save.


9.
Click Save.

Tip

Windows users: These techniques work just as well in Photoshop for Windows.


Tip

Only the visible layers are exported. Hide any layers that you don't want to include in the GIF image (Figure 4.17).

Figure 4.17. If you have several layers in your document and only want to include some of them in the exported GIF, simply hide the unwanted ones before exporting. In this example, I've hidden the background to export just the main portion of the logo.



Tip

If GIF89a Export doesn't appear in your Export submenu, it's because you have an old version of Photoshop. You can download the GIF89a plug-in from Adobe(http://www.adobe.com). Or you can create GIF images by converting the document to Indexed-color, Grayscale, or Bitmap mode, and then saving the document in CompuServe GIF format.


Tip

By using the Export plug-in, you maintain the original (RGB) image as well as the new GIF image. You can return to the RGB image, modify it, and then export new GIFs as desired.


Tip

If your image is on a transparent layer, transparent areas are automatically converted to transparency in the GIF image. For more information, consult Creating Transparency on pages 70–71.


Tip

The fewer colors in your final image, the smaller it will be and the faster it will load. For details, consult Reducing the Number of Colors on page 69.


Tip

On the Mac, check the Export Caption option in the Save box if you've added a caption to the File Info dialog box (using File > File Info) and you want to include that information with the GIF file for use with Fetch or other image cataloging software (Figures 4.18 and 4.19).

Figure 4.18. To export a caption with your GIF image, first choose File Info in the File menu.


Figure 4.19. Type a caption in the File Info dialog box. Then when you go to export the GIF, you'll be able to mark the Export Caption option.



Tip

Since icons add to the size of your file, choose Never (under Image Previews) in the Preferences dialog box.


  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint