Image Files | Transparent
Backgrounds | Giftrans
Making Backgrounds
Transparent With Giftrans
The PC version of giftrans is a DOS program, not a Windows application. In practical terms, this means that you use giftrans by opening an MSDOS window on your PC and typing commands, rather than by clicking buttons or by making selections from menus.
Fortunately, giftrans commands are not very complicated, so the program is still quite easy to use even if it does lack a fancy interface.
Giftrans
Keep in mind that in making transparencies, the background is not actually removed, but rather it is set equal to the color of the browser display, which is equivalent to making it transparent. Note that "one color" (the background color) is removed and it will be removed for all occurrences in the figure.
Suppose we have a gif image with a solid color background in a file named visback.gif, and we want to create a version of the image that has a transparent background and store it in a file called transback.gif. We can accomplish this by typing the following command in our MSDOS window:
giftrans -T visback.gif > transback.gif
Here the -T specifies one of the possible options for running the program. This particular option tells the program that it should make the background color transparent. (As we'll see below, you can specify other options to the program.) As another example, we could type the following in our DOS window to produce the lower of the above U.S. maps, usa-trans.gif, from the upper version, usa.gif:
giftrans -T usa.gif > usa-trans.gif
If we want to save the new image with the transparent background to the same file as the original image with the visible background, we can use a two step process:
|
giftrans -T usa.gif > temp.gif
|
The first step temporarily saves the new image to the new file temp.gif, but then the second step renames this new file to the same name as the original file. This has the effect of replacing the original version (visible background) of usa.gif with the new version (transparent background).
Note that the background in the image created by giftrans will be transparent only when the image is viewed in a browser. If the new image is viewed with other graphics software, the background may still be visible.
Also note that the above versions of the commands
assume that each command is given while you are in the same folder as the image
that we want to use the program on and that either
(a) giftrans is in this same folder, or
(b) the location of giftrans has been added to your DOS variable
PATH.
Otherwise you will have to specify the path to the giftrans
program when you want to execute it.
Making Any Color Transparent
The above is all you really need to know to use giftrans for "removing" the backgrounds in gif images. But the giftrans program can also make transparent any single color in the original gif image. It is not just limited to doing this for the background color. But to do this, we must be able to tell giftrans which color it is that we want to make transparent. We can identify the color to change either by referring to its six digit hexadecimal rgb code, or by referring to its index in the image's color table. As an example of the former, we can make transparent all occurrences in an image of, say, pure red, with the command
giftrans -t #ff0000 old.gif > new.gif
We've seen some previous discussion of these hexadecimal representations of colors, but the notion of specifying a color in an image by means of its index in the color table may sound quite mysterious. But doing this is also actually very easy. There are graphics programs that will display the color table used for any image, and thus show us the index of each color in the image. But giftrans itself can also provide us with this information.
As a very simple illustration, suppose we have a gif image in a file redgreen.gif that consists only of two colors, red and green, such as below:
Then we can have giftrans show the color table for this image by
typing the command:
giftrans -l redgreen.gif
in our MSDOS window. (Here the -l option tells giftrans to
list the colors in the image's color table. Note that the "l" is the letter of the alphabet
after "k"; it's not the number one.)
If we type the above command, giftrans should respond with the
following information in this case:
Global Color Table: |
That is, the color in this image with index 0 has rgb components of Red 255, Green 0, Blue 0, and a hexidecimal representation of #ff0000. And the color in the image with index 1 has rgb components of Red 0, Green 255, Blue 0, and a hexidecimal representation of #00ff00. (Note that the color index ranges from zero to one less than the total number of colors in the image.)
We can use this color index information to have giftrans make the red transparent in the image by using the command:
giftrans -t0 redgreen.gif > temp1.gif
This will store the following image in file temp1.gif:
(Hold the right mouse button down over the area to the left of the green square, to
see that this is still part of the image that is now not visible in the browser.)
We can also use the command
giftrans -t1 redgreen.gif > temp2.gif
This will store the following image in which the green has been made transparent in file temp2.gif:
In a similar way, we can use giftrans with the -l option to show
the color table for any image, and use the resulting information to find
the index of any color in the image. giftrans can then be used with
the -t option and the color index information to make any color in the
image transparent.
Another giftrans Option
The giftrans program can also be used to convert any color in a gif image into any other color. This procedure can be repeated as many times as desired, so that any or all of the original colors of the image can be replaced by specified other colors.
The full set of giftrans options, with short explanations, can be
seen by simply typing giftrans followed by return in the DOS window.
Example for Your Homepage
Let's now use the above technique to add an image to your homepage with its background removed. We shall give you a .gif file to download for the example, but feel free to download a different .gif file if you prefer. Go to the following address:
click the right mouse button on the schoolhouse image at the top of that page and save the file to your folder on your local disk with the default name (school4_logo.gif). Note that in what follows we assume that the file you just saved and your homepage are in the same folder.
Now carry out the steps outlined above to remove the (gray) background from this image, saving it under the original name in your folder. Then go to your homepage file in the same folder and insert the following text at a convenient place (use the mouse to copy and paste):
<img src="school4_logo.gif" hspace="15" |
Save the changes and reload the homepage in the browser; if all is well, you should then have the schoolhouse icon (or another image if you so chose) positioned left, with text wrapped around it on the right and the background of the image should be transparent.