Technique

Though you can't really change the basic rectangular shape of the file, you can change its appearance and this includes the functional boundary or what you can see through the image. The idea will be not so much to change the shape of the file, but to make the areas that you don't want to see transparent or essentially ignored by the browser when the image loads. While the actual boundary of the file remains rectangular, the transparent area allows you to see through completely to whatever is in the background.

For the web, shaping your image can be done in several ways some actually transparent, while others just mimic the result of being transparent by creating an image area that matches the background in what would be transparent areas. Transparency can be used only with GIF images, while matching can work with both GIF and JPEG images. In this tutorial, you'll see three methods, two that deal with creating actual transparency, and a third that discusses the matching method.

Whether creating actual transparency or matching the background, you'll want to use selection to define the part of the image you want to keep. Once the selection is created, you can use that selection to create the image elements you'll need to create transparency.

The tutorial will make some assumptions, as it focuses on the basic process of creating transparency. As the details of selection can be very involved, there are some suggestions as to what to do, but generally the assumption is made that you know how to use some of the basic tools to make the selection.

  Copyright © Richard Lynch 2001