I have made a transparent gif that I would like to put on top of a gradient.

The image is quite detailed but when I save it the edges arent very smooth and it looks quite jagged.

What is the best way to save this gif to make it more smooth?

I am using Photoshop CS

Thanks.

I use gimp for editing, but when it comes to gifs, you're pretty much screwed. Gifs colors are confined to a specific set of colors (specific to that gif) (afaik). When you create such a file, all your beautiful alpha blends and ever-so-slight changes get mapped out to a big dot in a small set of colors. Gif is a lossy file format.

I recommend using the lossless png format. IE 6 doesn't support transparency without a hack, but you'll get a much better quality image that way.

The image I am trying to save is just one solid color (white). Does that make a difference?

Unfortunately, if you want transparency over a gradient, you're going to have to use a transparent PNG because, as Jeremy stated, GIF's are just too limited.

How is "one solid color (white)" equal to "quite detailed"?

If it's a solid white color, then use a div or something -- not an image.

Sorry I meant the edges are quite detailed.

It is on the bottom of this page: http://www.jfwebdesign.co.uk/nu-scapes2/

As you can see the edges are quite 'fuzzy' and distorted.

You should really do the PNG thing for that page.

If you absolutely cannot stomach doing a PNG (why?), then another technique for so few colors would be to add the green gradient to the background of the white image in your graphics editor and then crop away everything except for a pixel or 2 around the white. This saves the transition while not interfering too much with any minor changes to the gradient.

Hello Joe,

I couldn't agree more with Jeremy and LadynRed, for a crisp clean image/graphic the png format is a far better format over a gif. The downside to pngs the size of the file will be much larger, I try to use pngs as much as possible even over jpegs.

have you tried antialiasing the graphic against a mid green (sampled from somewhere near the bottom of the page) and setting that green as the matte colour then when you save for web it should come out ok against that green background?

Thanks for the advice, the 'client' didn't like the image any ways so I junked it.

This is a bit unrelated, but your webiste has some issues on large monitors. The image on the bottom is covered up by a big white rectangle.

Thanks for letting me know.