Free Web Hosting : Election 2008 : Drug Rehab : Troubled Teens : Teen Drug Treatment

Are transparent gifs necessary? That is the big question. A jpg image is around 16 million colours while a gif image is limited to 256 colours. There is a myth that all graphics need to be transparent so that they blend into your webpages background. I don't think that all images need to be a transparent gif and I will show you why. When I am done and you still believe you want, or even need, a transparent gif then you can use the Transparent Gif Tutorial below. The decision is yours.

Below are the three most common types of images that are used on Ikonboard Message Boards.

Standard Ikonboard Gif
2.1 kb

Transparent Gif
1.9 kb

Jpg file with same
colour background
1.7 kb

So, if your image is going to sit on a web page with a single color background with no texture or pattern, you might as well just use a JPG and set the background color of your JPG to the same color as the web page. Actually, when you are creating your images with Paint Shop Pro you should ALWAYS save your final work as BOTH a PSP file and a JPG file. If you save it as both you can always go back and change the background colour to whatever colour you want. A small tutorial on how to set the background colour can be found below.

BUT if your image is going to sit on webpage with a textured background then a transparent gif probably could be the way to go. This textured background is pretty plain and I just coloured the background of the image a simple brown to try to blend in. It looks good here and it maybe an alternative unless you have a very intricate background.

Standard Ikonboard Gif

Transparent Gif

Jpg file with same
colour background

So there is my whole argument. Now it is time for you to decide. If you want to learn how to make a transparent gif then use the tutorial down below. This tutorial consists of two parts. The first part shows how to colour the background of an image so that you can then create a transparent background. Of course, if you just wanted to stop there and have a simple one colour background to your images you would be done but if you wanted to make your transparent background then move onto stage two once you are finished with stage one. I am using Paint Shop Pro 7 for this tutorial.

Transparent Gif Tutorial

Part One

OK, a few things you need to know before you move onto the tutorial. I know this may seem like a lot of unnecessary knowledge but trust me, you need to know all this before you continue on. Besides, isnt it going to be nice to say "I made that"?

1) Did you know that a transparent gif really isn't transparent? The GIF transparency is achieved by selecting a single colour that you instruct the web browser to ignore. Remember that statement because it is a very important thing to remember. Why remember it? Well, if you were to convert the Standard Ikonboard Help Image

you will notice that the single colour that you instruct the web browser to ignore is going to be white (colour coded 255,255,255 - the background colour right?). Not wise because you will notice that there is white elsewhere in the image. The word "help", the white pages of the book and even some of the button which is white could also become transparent. So, when selecting a single background colour that you instruct the web browser to ignore select pink, green, red or some other colour you know is not in your image.

2) After you save your work you must close it then reopen it to get the real image. The saved image still in the workplace is not the real saved image. Remember, a GIF image can only be a single layer and can only be 256 colors. When you save a many layered, 16 million colored image as a GIF, and if you say yes to the 'merge layers and reduce colors' message, the image on the workspace now has the .gif extension, but it is not a GIF. How can you tell? It still has 16 million colors and all the layers intact, neither of which can be elements of a GIF image. Only when you close the image in the workspace and then open the saved image will you have the actual GIF you saved.

Finally, now we go to the tutorials. The first one is just to show you how to colour the background of an existing image so that it may seem transparent on your one colour background Message Board. The the second tutorial will show you how to create a "real" transparent gif.

Colouring an images background
Creating a true transparent Gif