Re-animation

I have just been tearing my hair out trying to get a very simple animated gif to look right. I created several basic designs in PhotoShop and then animated them with ImageReady for my client. All exported fine. On refining one, I worked following the same procedure, but found that my exported gif had somehow incorporated a fine horizontal line into the design. So I re-worked it, re-exported it, re-exported it with a different file name, started again, all to no avail. All this time I'd been viewing it with IE6. I had a look in Firefox and Opera and the gif appeared fine, no horizontal line whatsoever. Grrrr. So had a look in IE7 - same problem. Getting increasingly frustrated, I reworked the gif in Fireworks - same thing!! I investigated everything frame by frame but couldn't really see what was going on.

I asked a technical colleague why it would look fine in one browser and not another, and they reckoned it was to do with the encoding the browser uses for animated gifs. After inserting some blank frames, in ImagReady, between the offending frames, we managed to cure the problem. So it seemed to be something to do with some residual 'show through' for want of a better description, from a former frame/layer. Having a little play with the optimisation settings, we found that by default, ImageReady was using transparency when it was exported. By turning this off, the gif exported perfectly. SO lesson learned - having thought an animated gif was pretty much an animated gif, it seems that is not the case. Different browsers use different encoding when presenting them which can effect the appearance. Therefore, it is just as necessary to check animated gifs in different browsers as it is for any web page. Furthermore, pay attention to the optimisation settings to ensure you get the desired result.