What’s happening: .gif images are either 100% transparent or 100% opaque. There is no in-between. So Illustrator, assuming by default that your background is going to be white, fades the edges of you image to an almost-white, then cuts to transparent. This of course would make for a nice clean edge on a white or almost-white background (maybe even yellow), but placed over any other color you’re going to see those almost-white pixels around the edges.
One way to handle this is to save your file as a png. Unfortunately IE6 (still currently one of the top used browsers) doesn’t support pngs, unless you load the iepngfix.htc on your server and link your stylesheet up to it properly. (If you’re interested in doing this, please email me and I’ll email you back on how.)
Another way to handle this is to export your Illustrator file as a .psd with the same color background you are using on your website. Then open it in Photoshop and use the Magic Wand (making sure the Tolerance is set to “1″ and Anti-alias is checked) to select only that color (If the selection picks up areas of the image you don’t want to be transparent you may want to check Contiguous. You may even have to go through and deselect those areas with any other marquee tool of your choice.). Make sure your image is not flattened (you can unflatten it by double clicking the layer and then clicking OK) then delete what you have selected. If you’ve got your checkered transparency background then you are ready to save the image as a .gif. It will look very pixelated around the edges, but with respect to the background color of your website. So it will blend right in. This will usually work even on a background with a subtle image or pattern that doesn’t deviate too far from the initial background color. Unfortunately, you’ll have to do this all over again if you decide to dramatically change the background color of your website, which brings me to a third way of handling this issue.
If and only if your background is a solid color, then there really is no need for transparency, and it’s much easier to simply put a box around your image that matches your background color. If you’re creating this in Illustrator however, you will probably still have to export it to Photoshop to crop about 1 pixel off all four edges (again, to compensate for Illustrator assuming that your background color is going to be white). With this method you have the additional option of saving your image as a .jpg. However, the .jpg format doesn’t allow you to pick and choose your colors and sometimes gets them wrong unless you’re saving it at a higher quality (which equals a longer load time).
