Task 4 How to Create a GIF Transparency | How To Use Adobe Photoshop CS2

GIF files have an advantage over JPEG files in that they enable you to set certain areas as transparent. This means you can create silhouette effects to place over web page backgrounds. The transparent areas in a GIF file are completely invisible. This task uses ImageReady to create the transparency.

1. Open File in ImageReady

In ImageReady, select File, Open. In the Open dialog box, select the file you want to work with and click Open.

2. Select the Area to Be Transparent

Using any of ImageReady's selection tools (such as the Magic Wand tool to select areas of similar color), make a selection representing the area you want to make transparent. Here, I selected the sky.

3. Apply a Layer Mask

Open the Layers palette by selecting Window, Layers. With the selection from step 2 still active, press and hold the Option/Alt key and click the Add A Mask button at the bottom of the Layers palette. This action "masks out" the selected area, giving you an idea of what the final result will be. If the button is grayed out, rename the Background layer.

4. Build Optimize Settings

When the transparency is the way you want it, select Window, Optimize to open the Optimize palette. Then specify the appropriate settings. (Refer to Task 2, "How to Build GIF Files for the Web," for instructions on setting up a GIF file.) Make sure that the Transparency option is checked. Inspect the results in the Optimized window.

5. Preview in a Browser

Select File, Preview In, <Browser Name> or click the Browser Preview button in the toolbar to look at the file as it will appear in a browser.

6. Save Optimized File

If the file looks good, close the browser and return to ImageReady. Select File, Save Optimized to save the file using the settings in the Optimize palette.

How-To Hints

Fixing the Transparency

If the transparency in the layer mask in step 3 is not right, click the Add a Mask button in the Layers palette and paint the transparent selection as you would with any layer mask. (See Part 10, Task 7, "How to Add a Layer Mask," for details on layer masks.)

Transparency in Photoshop

You can also set GIF transparencies using Photoshop's Save for Web dialog box. Select the color in the Color Table and click the Transparency icon at the bottom of the Color Table.