Animated gifs in html emails
Can we put animated gifs in html emails? Sort of.
Animated gifs have only limited support in html email. They work in most webmail platforms, but they are not widely supported in Outlook. Weirdly, they worked in Outlook several versions ago, then they stopped working for a few versions, and now they work again in the very latest versions. Something to keep in mind is that most of our clients are using versions of Outlook that do not support animated gifs.
So, we can put animated gifs in html emails, but we have to be aware that in many cases our clients will not be able to see the animation in their work email. If we can explain that to the client, and they’re okay with it, then great!
Another important question to ask is, what email platform is the audience for this email likely to be using? If it’s people in offices using Outlook, then animated gifs probably aren’t a good idea. If the target audience is webmail users, then it’s possible that the majority will see the animations.
Animated gifs in html emails degrade gracefully
Fortunately, animated gifs in html emails degrade gracefully, and we can design around this. If the recipient is using an email platform that doesn’t support animated gifs, they will simply see the first frame of the animation as a static image. Not too bad.
So as long as we design an animation that also looks okay if the user just sees the first frame as a static image, then we’re fine.
Here’s a good example. I received an email in Gmail with a butterfly in the corner slowly flapping its wings. If I was using Outlook and the butterfly wasn’t moving, this would seem fine to me; nothing would appear broken.
Now, here’s a bad example. Let’s say the designer wants the headline of the email to be a graphic that fades in from white. Works great in Yahoo! Mail, but in Outlook we only see the first frame of the animation, which is a solid white rectangle. Bad.
Is it worth animating if not many users will see the animation?
My opinion, in most cases, is no. If the gracefully degraded version, i.e. the static image, is good enough, then why not just stick with that for your whole audience? This is my philosophy on most interactive things; I prefer to create one experience that is great for all users regardless of platform/device/etc. But this is a subjective thing, and different jobs call for different strategies. Hopefully the above can help you make an informed decision.