GIF instruction

Saving an image as a .gif is quite simple although a PITA sometimes *S*. I used to use the Wizard all the time but I finally found some settings in the gif optimizer that suit me just fine. I AM NO EXPERT on .gifs but I thought I would jot this down for those who need this information.

The rule of thumb is that you save a photo as a jpg and a graphic as a gif. Well, I save many graphics as jpgs - just depends on which looks better and how much compression I want. All the screen shots in my tutorials are jpgs - they compress to a smaller file size that way and it helps the pages load faster.

A gif can be saved tranparent or saved not transparent. I am going to show you how to save something as a transparent image. Remember, when it is saved as transparent it will show that way on a website or as a sig tag (which also is saved as an html file) but when you open that transparent image up in your PSP it will not look transparent. You will see the colour of the background that you used during the following steps. You can't open it in PSP and then apply it to another image expecting it to be transparent ... you have to create a Tube in order to do that.

~Created using PSP7

1. Open a new image as a transparent image (has the checkrboard showing). Create what you want, using layers if needed. When you are done go to Layers/Merge/Merge Visible. Then CTRL C (copy) and CTRL V (paste as new image). This copies the image and takes away all that excess space around it.... like so ...

2. Make sure your Fill Colour (background) on your Styles Palette is set to the colour of the background you will be using this image on. I have mine on gray #E0E0E0. I use this for all sig tags as it looks good on all e-mails with light coloured backgrounds. A dark coloured e-mail would show more of that thin outline but not many people use dark backgrounds. Go to File/Export/Gif Optimizer (I think PSP6 says Export as gif). A window will open showing you a "uncompressed" and "compressed" view.
- On this first tab (Transparency) you will click on "Existing Image or transparency".
If you look closely you can see a thin line around the compressed version (on the right). When you create something using ** Antialias (see image), which I almost always do, you can't get away from having a thin line of the colour of background you choose. So if I am making a website with a pale blue background I would change the gray to that colour ... and then it would blend in.
Okay, so on we go ....

3. Click on the next tab "Partial transparency" and check "Use full transparency for pixels below __% opacity". I have mine set at 5 but you could try it at 10 and see how it looks. The higher it goes the more it will take away any stray pixels that are around your image but it looks too jaggy if you do too much. Also check "Yes, blend with the background colour". By the way, if the colour needs to be changed, right click on it and choose from there.

4. On to the next tab, Colors, make it 256 and Dithering at 100%. Check "Optimized Octree" and "Include Windows colors"

5. The next tab is the format ... a personal choice I guess. I have mine set at Non-Interlaced, Version 89a. Click OK and name it and save it to a folder.

That's it! When you apply this to html it will be transparent.

You can also save an image that isn't transparent as a gif. Just select "None" in the Transparency tab. Hope this was of some help :-)