Basic Tutorial Tips

Making Transparent GIF's

To make transparent GIF's you'll need Adobe's Photoshop export plugin from their site at:

http://www.adobe.com/supportservice/custsupport/LIBRARY/3082.htm

and download the ZIP file if you don't already have it (go File>Export and see if you have GIF89a Export as a choice in you menu). This is for the full Photoshop PC version. If you want a different version, use the Adobe search engine for - transparent GIF's - and then pick your platform needed . Follow the directions for installing it.

Then, with the image you want to make transparent, you first have to turn it into an indexed color mode by going Mode>Indexed Color. In most cases, the adaptive palette option will be good to use with 8 bits per pixel. Once you've OK'd the change, go to File>Export>GIF89a Export and click on it. Up will come a dialog box with the image you want transparent. All those little colored boxes at the bottom represent all the 256 colors and shadings now contained in the image after you converted it to Indexed color mode. Using the eye dropper with the plus sign, you can click on a color square, or a color right in the image itself, and watch it disappear. If you make a mistake, you can hold down the CTRL button on the keyboard and change the plus sign to a minus sign and re-click the color to get it back. The magnifying glass will zoom in on the image, to zoom out hold down the ALT key. The hand allows you to move the image around once it's been zoomed larger than the viewing area. Click OK when done, saving it with a different filename than the original in case the final outcome isn't what you like, you still have the original. But, if you ever open up the transparent GIF image itself and work on it, it will no longer be transparent, and you'll have to go thru the process again.

One 'trick' I do when I want an image to seem transparent is not make it a transparent GIF. In some of my images with a shadow background, instead of making it an indexed color file, I've added a layer underneath the image, and added the background I wanted as a pattern to the entire layer (see Making A Pattern if you don't know how), which is usually the background tile I'm using for that particular web page. Then, switching back to my image, I've deleted any colors and areas where I want the underlying layer to show thru at. The red aluminum looking buttons on my main contents page are like that, as are the Title headers at the top. There's a bit of grey in the reflections and in the shadows and it was becoming transparent when I didn't want them to be. The drawback to using a 256 color palette or less is some of the colors with different hues in the original image will be converted to all the same closest color in the index mode, and some of those you want transparent around the image will also be contained within the image, creating a punched-hole effect. I do a Save A Copy and save as a JPG, that way my original file with the layers remains intact to work on again.

Using the Marquee and Lasso Tools

The Marquee and Lasso tools are actually very powerful tools. They allow you to select any where from one part, to multiple parts, to the entire image that you wish to make effects on. In my day job, I use a CAD program called Microstation, and they call the Marquee a Fence instead. In both cases, it's a very powerful tool that can move, copy, delete, protect, mirror or change an element or part of an image. I decided to list the keyboard commands for Photoshop's Marquee and Lasso tools for ease of reference. The commands are out of the books that come with Photoshop, and if you're like me, you don't read the manuals unless you have to.

Using the Square and Elliptical Marquees

Select square Marquee + Shift/hold will constrain the Marquee to a square.
Select square Marquee + Alt/hold will start from its center.
Select square Marquee + Alt + Shift will start from its center and constrain to a square.
Pressing Alt before releasing mouse button will double size of Marquee.
After placing Marquee, select Move, hold down both Ctrl and Alt, and only the Marquee will move. Using arrow keys will move Marquee one pixel at a time.
After placing Marquee the Alt + Move command copies selection.
Releasing Alt after moving but before releasing mouse button only moves selection.
Shift + mouse click/hold + Move constrains selection to 45 degree movements in all directions.
Holding Shift after mouse click constrains Marquee to a circle.
Holding Shift before mouse click allows multiple Marquees to be made.
With Marquee active, choose Image>effects>scale + Shift which will scale the selection proportionately.
With Marquee active, choose Image>rotate>free + Shift which will rotate image in 15 degree increments.

Using the Lasso Marquee

Holding Alt + one mouse click at a time will draw a straight line from point to point. Releasing Alt will draw a straight line from last mouse click back to origin, or you can click back at the starting point and release Alt to close the Marquee. By holding the mouse button down instead, you can draw freehand Marquees, and alternate between straight lines and freehand lines. Again, release Alt when done.