Animated GIFs in eMail (the basics) by Anna Yeaman @stylecampaign
I was on an email forum recently when a guy asked,
“Does anybody know if you can use animated Gifs in emails and if so how do you do it? I know that you cannot send flash, or it’s not recommended”.
If you’re just getting started with animated Gifs in email, here are the basics:
1. Can I use animated Gifs in email?
Yes. Animated Gifs play in all email clients, except for Outlook 2007 and Apple Mail 3.0.
| Animated Gif support in email | |
|---|---|
| Desktop clients | |
| AOL | Yes |
| Apple Mail | No |
| Entourage 2008 | Yes |
| Lotus Notes | Yes |
| Outlook Express | Yes |
| Outlook 2000 | Yes |
| Outlook 2003 | Yes |
| Outlook 2007 | No |
| Thunderbird | Yes |
| Windows Mail | Yes |
| Web clients | |
| AOLWeb | Yes |
| Gmail | Yes |
| Windows Live Hotmail | Yes |
| Yahoo Mail | Yes |
| Yahoo Classic | Yes |
| Comcast | Yes |
| AT&T Webmail | Yes |
| Verizon Webmail | Yes |
| Earthlink Webmail | Yes |
Although animated Gifs play on the iPhone and Blackberry, playback can be slow.
2. Animated Gifs in Outlook 2007 { view Tiffany email }
Outlook 2007 only displays the first frame in a sequence. If an Outlook 07 user received the above Tiffany email, all they would see is a blank blue image (Frame 1).
Make sure your first frame is not blank and works as a stand alone image. That means no fade ins, or leaving the CTA/reveal until later frames (I’m looking at you Juicy Couture!).
3. What about Flash in email? { view Flash email }
Only Mac Mail supports Flash, so I’d give it a miss.
The only Flash email I’ve received, was from Neiman Marcus back in Jan07. They quickly switched back to animated Gifs.
4. Creating an animated Gif in Photoshop: { view tutorial }
If your using an early version of Photoshop (7.0) you can use ImageReady, here’s an animated Gif tutorial.
If your using Photoshop CS3 or 4, ImageReady has been discontinued. Most of its core features are still included. Select Window/Animation to bring up the controls (same as ImageReady so refer to above tutorial).
5. Controlling speed and playback
You can adjust the speed of an animated Gif in Photoshop, by assigning a time to each frame. So your first frame may display for 2sec, your second 0.5 sec and so on.
You can also set the number of times it plays e.g. once, 5 times or looping continuously.
6. Need more reassurance? {view early animated email}
Many top UK and US retailers, have been using animated Gifs in email for years. I’ve collected over 300, dating back to this Neiman Marcus example from Nov 06.
Here is a sample of retailers using animated Gifs in email:
Amazon, American Apparel, Anthroplolgie, Barnes & Noble, Bluefly, Clinique, Dillards, Dior, Evans, Express, Gap, Hermes, Johnnie Boden, Lands’ End, Macy’s, Neiman Marcus, Next, Photojojo, Saks, Selfridges, Tiffany, UrbanOutfitter and a bunch more…
7. Takeaway: Animated Gifs are widely used and play in the majority of email clients. Just take care with that first frame.
 |
|
|
Other post by this Author
|
|
We just released a new whitepaper about using animation in emails earlier today. It includes a real world example along with some additional tips. http://goo.gl/G8q5p
Hi, I made an animated gif in Easy Gif Animator. It works when in the program and it works if I put it on my website but it doesn’t show anything but the first frame in an email. Is there something special you have to do? thanks.
Perfect timing! We were looking at an animated GIF as an option for an email campaign this week. I’ll make sure we didn’t miss anything thanks to your post.
Hi Sharon,
Thanks for the comment and we are glad you found this post useful! BTW, loving your tweets on #MPEIS!
Regards,
jim
Enjoyed your post Scott, I had not seen the Marketing Sherpa case study only the Bluefly A/B.
BTW you can rename a Gif file JPG and it still plays in the inbox. The Twilight example [ http://tinyurl.com/87ldxf ] was an early video Gif we created. We were playing around with the jpg extension to see if there were any benefits, as we’d seen another company do this.
We could not determine any (besides maybe masking the fact it was a Gif, which we had no interest in doing) since then we just stick with the Gif extension…
Great Post! I’ve continued the topic and linked to a few of Anna’s email in this post: http://blog.indiemark.com/2009/10/19/email-animation-examples-case-studies/
Phil,
Awesome! It’s really rewarding to know that we are helping people! That’s what we love to hear! If you’ve got questions let us know so we can find the answers!
Regards,
Jim
Editor
I just found this post on twitter. Great, just in time my company wants to send out an animated gif holiday email/card. This is a huge relief to know the “rules”.
Thank You
Phil
Boston, MA