I am having an issue creating a transparent .gif image using white text. When put on a background color on a webpage, it looks horrid. Black text on a transparent background seems to work fine though. I did a search with Tek-Tips and found that the correct transparency to use is index-transparency, but that doesn't seem to help. Does anyone know how to display crisp white text on a transparent background and have it look nice on a webpage? THanks.

-Bamboo

Hi Bamboo

The secret to making a transparent image look good is to set the background colour of your canvas to match the background colour that the Gif will be going onto on the page. As the object (in this case text) is anti-aliased to the background fireworks adjusts the pixels around it to blend in, so these pixels inherit the colour of your background. When you export and remove the background colour you are left with the "halo" around the text of these anti-aliased pixels.

This is why you see so many websites with images which have this halo effect - people just can't be bothered to do it properly.

I am assuming that the text is not going onto a white background!

If the text is going to go over a non solid colour choose the closest match you can. Then when you export you can choose index or alpha transparency - I have never had a problem with either of them.

Derren
[Mediocre talent - spread really thin]

Oh, you could also choose to change the setting of the text to "no anti-alias" (this will not have any halo at all) but it tends to make the text look a little, hmm, pants.

Derren
[Mediocre talent - spread really thin]

Darren, Thank you for your input. If I did this though, wouldn't it just be the same as creating a text on the same color canvas as my background in DW and then saving it as a regular .gif file? I'm looking for a way I can create on transparent image and use it on any color background withouth having to alter the canvas of the image each time. What you said worked fine, but from what you said, if I now want to place that same image on another page with a different background I would have to open the .gif up again, change the canvas color to match the new color and resave it using index-transparency. Doing this would be the same as creating a bunch of frames matching each background I wanted and saving them as plain .gif files. Does this make sense?

-Bamboo

It certainly does make sense.

The only way to create a single transparent gif which will look good against all backgrounds is to ensure that anti-aliasing is OFF. This is an unfortunate situation, and the reason that so many people can't be arsed to put that extra bit of effort into their site images.

Try the no anti alias option, it may work visually in your case (it will definitely work technially)

Derren
[Mediocre talent - spread really thin]

Take a look at this transperency tutorial. Tough its not the solution to your problem. It will explain why what you are trying is almost impossible... well almost

http://www.handson.nu/HTML/transparency.shtml

Ranjan
:: I earn because I learn ::

See - it's not just me!

Derren
[Mediocre talent - spread really thin]

I have found that using a very light grey for the text colour works well.  Then you can use the transparent background and the text still looks white.