Email is one of the last places on the web where GIF remains the only reliable animated image format. JavaScript is stripped, video autoplay is blocked, and WebP support is inconsistent across clients. If you want animation in email, GIF is your only real option — which makes knowing how to optimise it properly essential for any email marketer or developer.
Why Email GIFs Need Special Treatment
A GIF that works fine on a web page can cause serious problems in email. Many corporate email servers impose attachment size limits of 1–5 MB, and even where no hard limit exists, large GIFs slow down inbox loading and increase the chance of being flagged by spam filters. Outlook 2007–2019 on Windows doesn't animate GIFs at all — it shows only the first frame — so your first frame must work as a static image. Gmail on mobile has historically had issues with very large GIFs consuming mobile data budgets, leading users to disable image loading entirely.
The practical target for email GIFs is under 1 MB for most campaigns, with under 500 KB being ideal for mobile-heavy audiences. Achieving this while maintaining visual impact requires a systematic approach to palette, frame rate, and dimensions.
The First Frame Rule
Because Outlook on Windows shows only the first frame, your first frame must communicate your key message on its own. This means the first frame should include your headline, call-to-action text, and any critical information — not just a blank background or a transitional animation frame. Treat the first frame as a standalone static image that happens to animate for clients that support it.
A common mistake is to start an animation with a fade-in from black or a blank frame. On Outlook, the recipient sees only a black rectangle. Instead, start with the fully-composed final state of your animation, then use subsequent frames to add motion or transitions.
Recommended Settings by Email Type
| Email Type | Max Size | FPS | Colours | Width |
|---|---|---|---|---|
| Promotional / sale | < 1 MB | 6–8 | 32–64 | 600px |
| Product showcase | < 800 KB | 8–10 | 64–128 | 600px |
| Transactional / receipt | < 300 KB | 5–6 | 32 | 480px |
| Newsletter header | < 500 KB | 6–8 | 32–64 | 600px |
| Mobile-first campaign | < 400 KB | 5–8 | 32 | 320px |
Step-by-Step Optimisation Process
Start with your source file — ideally a short MP4 clip or a sequence of PNG frames. The shorter the animation, the smaller the file. Aim for 2–4 seconds maximum for email; longer animations rarely add value and always add file size.
Step 1: Scale down. Email templates are typically 600px wide, and retina displays don't help GIFs the way they help raster images. Export at exactly 600px wide (or 300px for mobile-first). Reducing from 1080p to 600px cuts the pixel count by 69%, which has a compounding effect on file size.
Step 2: Reduce frame rate. Drop to 6–8 fps. Most email animations are simple transitions, product reveals, or countdown timers — none of which require smooth motion. At 6 fps, a 3-second animation has only 18 frames, which is very manageable.
Step 3: Reduce palette size. For most email designs — which tend to use flat colours, gradients, and product photography with limited colour ranges — 32–64 colours is sufficient. Use the Bayer dithering algorithm for email, as it produces a regular crosshatch pattern that compresses well with LZW and avoids the noise that Sierra2 can introduce on flat colour areas.
Step 4: Check the first frame. Open the GIF in a viewer and confirm the first frame works as a standalone image. If it doesn't, reorder your frames or add a static first frame with your key message.
Step 5: Test across clients. Use a tool like Litmus or Email on Acid to preview your email across Outlook versions, Gmail, Apple Mail, and mobile clients before sending. Pay particular attention to Outlook 2016 and 2019 on Windows, which are still widely used in corporate environments.
Common Mistakes to Avoid
Using too many frames is the most common mistake. A 10-second animation at 24 fps has 240 frames — even with aggressive compression, this will produce a multi-megabyte file. Keep animations short and purposeful. If you need a longer animation, consider using a video with a poster image as a fallback, and reserve GIF only for clients where video doesn't work.
Forgetting to set the loop count is another frequent oversight. GIFs loop infinitely by default, which is usually what you want for email, but some animations (like a one-time reveal) should play once and stop. Set the loop count explicitly in your export settings.
Finally, avoid using GIF for photographic content in email. A photograph with millions of colours will look terrible at 64 colours and will still be large. For product photography, use a static JPEG and reserve GIF for graphics, illustrations, and simple animations where the colour count is naturally low.