DISPLAYING TRANSPARENT GIFS ON
TEXTURED OR GRAPHIC BACKGROUNDS

As you can see this web page background has many colors present, varying shades of
black and brown. Since we can choose only one solid color as transparent, to display a
transparent gif on this page we need to find an average solid brown color that will not clash
with the web page background and show up as that jaggie halo. One can do this by trial
and error until you find the color that works best. Probably the best way though is to
put a copy of the web page background in your graphic editor and blur several times
until the colors start to merge together thus giving you a better shot at the average.

This is the color I came up with.
You can see why its advantageous to use the blur method. At first glance it doesn't look
like the average color but it is. You'd probably end up pulling your hair out trying to find
this using the trial and error method. Displayed below are the same transparent gif using
white, blue and the average brown I made as the chosen transparent colors.


Obviously the one on the right is the object of this tutorial. It does indeed have the same jaggie
halo (of the added pixels from the antialiasing) as the other two but since they are shaded from
black to our brown they are not apparent, they blend in with the web page background.

As we said at the bottom of the last page why not just put your graphic on the same background
texture as you used on your web page background and forget about having to mess with
transparency? We know that works fine with solid color page backgrounds but what about
textured pages. As you can see below this page background is pretty busy and it doesn't look
too good. It will work just fine on many fine grained or symmetrical textures though.

All this can be summed up with two basic statements:
1). Use antialiaseing when making your graphic, it smoothes out curved and angled
edges.
It looks better.

2). When saving your transparent gif make sure the color you chose to make transparent
is the one that best blends in with the web page background you are using it on.

On the next page we will discus the display of downloaded graphics where
obviously you don't have a choice as to the transparent color used.

NEXT PAGE