This is a new browser window - Please close window to return to main website

Explore Photoshop

Transparency
Actions
Tutorials

Transparency

The GIF and PNG file formats support transparency, allowing you to place your image on a coloured or patterned background on a web page. 8-bit images (GIF and PNG8) do not allow for ‘antialiasing’ (graduated pixel colours around the edge of the image which create smooth-looking edges), so this works best when the images is ‘matted’ onto a colour the same as or similar to your background colour.

Layers paletteIn Photoshop, your image must have transparency for you to be able to save a transparent GIF. Photoshop layers contain transparency, so you should convert your ‘background’ layer to a normal layer, by opening (double-click on layer) and renaming it. (see Layers palette at right)

This will allow you to use the eraser tool, or select and delete areas, to create transparent areas (transparent areas are indicated by a grey/white grid).

Layer showing transparency

When you go to ‘save for web’, you will then see that the ‘transparency’ checkbox in the GIF optimisation palette is available. It will also allow you to select a matte color for the image.

Actions

Photoshop actions are a useful way to efficiently process images when you have a sequence of manipulations to apply. It operates by recording the sequence as you perform it on a sample image, then it is only necessary to replay the action when processing subsequent images. It is also possible to batch process images (through the file:automate menu) using actions. The actions palette is illustrated below.

Some actions with arbitrary parameters (such as an arbitrary crop, resize or brushstroke) cannot be recorded, but actions such as cropping or resizing to a set size, applying effects or adjusting levels and saving for web can be recorded as actions.

Actions palette

Photoshop tutorials

An excellent introduction to Photoshop tools and functions can be found at: http://www.adscape.com/eyedesign/photoshop/four/index.html (This explores Photoshop 4 ­ most elements are still relevant to Photoshop 6).

Photoshop 6 tutorial: http://www.trainingtools.com/online/photoshop6/index.htm

Photoshop 5.5 tutorial: http://www.trainingtools.com/online/photoshop55/index.htm (this course can be downloaded as a PDF)

Tutorials for Photoshop can also be found at: http://www.free-ed.net/fr03/lfc/030103/123/