Animated GIFs in email: which clients play them, and how big to make them

Animated GIFs are the one kind of motion that works in almost every email client, which is why newsletters, product announcements, and onboarding emails use them. Two things still catch people out: some versions of Outlook show only the first frame, and a GIF straight from a video is often several megabytes. This guide covers both.

The short version: put the message on the first frame, because some readers will only ever see that one. Keep the file near 1 MB: in our test, 320 px wide, half the frames, and 64 colors took a 2,107 KB GIF down to 256 KB.

Which email clients play animated GIFs

Can I email, which tests HTML and CSS support across email clients, lists GIF as supported in every client it tracks, with one family of exceptions:

Caniemail's GIF test was last run in February 2020, so check newer Outlook builds yourself if they matter to your audience.

Microsoft's own support article adds a reader-side cause: if only the first frame appears in Outlook for Microsoft 365, animations are switched off. In versions before 2008 that's the "Play animated GIFs" option under File → Options → Advanced. In later versions Outlook follows Windows: "Show animations in Windows" on Windows 10, or Accessibility → Visual effects → Animation effects on Windows 11. You can't change that setting for your readers, so plan for it.

Design the first frame

Because some readers see only frame one, treat it as a still image that has to work on its own:

• Put the message there. The headline, offer, or product shot belongs in the first frame, not in the middle of the animation. A GIF cut from a video can start on a transition or a blurry frame; trim or reorder so it doesn't.
• Make the last frame count too. Outlook 2019 with Microsoft 365 stops after three plays, and any GIF set to play a fixed number of times ends on its last frame. In EasyGIF, set how many times the GIF plays on the Motion tab.
• Keep text big. Phones often show email images scaled down, and text that's readable on the desktop can turn to mush at half width.

In EasyGIF you can drag frames on the timeline to reorder them, or delete the slow start of a clip.

Keep the file small

Email clients don't publish a size limit for images, but sending platforms do. Mailchimp, for example, says each image file should be about 1 MB or less. A big GIF also means a slow-loading email for anyone on mobile data.

We encoded a 2.4-second, 24-frame clip from a camera pan with EasyGIF's encoder, changing one setting at a time:

Each single change roughly halved the file; combining three brought it to about an eighth. The combined row was measured by re-encoding the default GIF, the way you'd shrink a GIF you already have. Your own clip will differ, so check the size EasyGIF shows in the preview before you download.

A few things specific to email:

• Width. Make the GIF the width it will be shown at in your template's content column. A GIF twice that wide for sharp high-density screens costs far more than twice the bytes: our 640 px version was 3,590 KB, 3.6 times the 320 px one.
• Colors. Email GIFs are often flat graphics like text, buttons, and icons. For those, turn dithering off; on our screen-recording clip that alone cut the file by 73%.
• One palette. For a slideshow of product photos, "One palette for all frames" with dithering off took our six-photo test from 673 KB to 541 KB.

The guide to making a GIF smaller has the full measurements behind these numbers.

Alt text and image blocking

Many email clients can be set to hold back images until the reader allows them, and screen readers can't see a GIF at all. Give the image an alt attribute that says what the GIF shows or what it's for, such as "Spring sale: 20% off all plans". Your email editor usually has an alt text field for each image.

Timing

Most email GIFs don't need video smoothness. A product turning, a few slides, or a short UI demo work fine at 5–10 frames per second, and slides can sit for a second or more each. Long delays cost nothing: GIF stores a frame's delay as a number, so a frame shown for 1 second is the same size as one shown for 0.1 seconds. The frame delay guide explains how GIF timing works.