Including a little bit of motion into an e mail can carry the message to life and elevate your e mail advertising and marketing. As these 5 manufacturers have proven us, GIF hero picture designs wow the recipient into testing what an e mail has to supply.
However there are another methods a GIF can improve an e mail. On this submit, we’ll cowl some totally different makes use of for animated GIFs in e mail and how one can implement them in your subsequent e mail marketing campaign.
Measurement for GIFs in E-mail
It’s necessary to think about the forms of photographs you utilize in an e mail, in addition to the general weight of an e mail’s HTML and its loading pace. A slower load time may imply decrease engagement out of your subscribers.
There isn’t a hard-and-fast rule on the utmost dimension of a GIF in e mail, however the increased the file dimension, the longer it can take to load. Aiming for underneath 200kb is an efficient rule of thumb.
With most readers receiving e mail on their smartphones, you need to take into account loading time on cellular networks (though many readers are in a position to join cellular units to WiFi). In case your readership is especially desktop, why not check out some greater GIFs to see how they do?
Nike despatched a marketing campaign with a 2.7mb GIF:
E-mail on Acid’s Marketing campaign Precheck consists of an picture optimization function that lets you see in case your photographs are too heavy. It additionally helps you to optimize the picture with one click on, then host it or obtain it to incorporate it in your e mail.
What About Outlook?
Now that it’s solely older Outlook shoppers that don’t help GIFs, it’s value exploring some extra choices for animating photographs all through an e mail. In case you have plenty of subscribers utilizing older Outlook shoppers, take a look at this helpful hack to point out a particular static picture to those shoppers.
Methods to Use an Animated GIF in E-mail
Animated GIFs aren’t only for hero photographs anymore. Try these totally different strategies for utilizing GIFs in your campaigns.
Encouraging a Recipient to Scroll
Including an arrow or character beckoning a person to hold on scrolling is nice for longer emails, or to attract consideration to a particular module.
Deliver Life to Static Photos
Followers of the Harry Potter movies and books have most likely imagined including real-life motion to pictures.
These animated photographs may have many functions, from e-commerce to leisure. For instance, you possibly can experiment with including a delicate spinning motion to a mannequin carrying the clothes you’re promoting. This may give the e-mail recipient somewhat extra info and a full 360º view of the product, rising the prospect of a click on.
Enjoyable Typography
Including transferring textual content to pictures is a cool method so as to add a signature or fascinating ingredient to a message. In the event you use this system, make sure you embrace a separate static picture or embrace all of the textual content within the first body to accommodate older Outlook shoppers. Additionally, don’t overlook to incorporate descriptive alt textual content.
Try the code for this “Thank You!” message, together with a fallback static picture.
Shifting Backgrounds
Utilizing background picture fixes to cowl as many e mail shoppers as potential, you may embrace an animated GIF rather than a static picture so as to add some motion behind your content material. The fallback for these photographs is identical as a standard GIF, so solely the primary body will present if the e-mail consumer doesn’t help animated GIFs.
View the total e mail on-line.
Calls-to-Motion
By including a small little bit of motion or encouragement to a CTA (a vital a part of your e mail), you may draw consideration to an motion you prefer to the recipient to make.
Discover the code for this button on codepen.
Cinemagraphs
Including motion to an in any other case static picture could make a photograph extra partaking and efficient. Utilizing one of these picture provides a little bit of intrigue into an e mail (“Did that simply transfer?”) by including delicate motion. This system can enhance the studying time and encourage readers to scroll on to see extra.
Emphasize Your Model Fashion or Voice
Don’t overlook it’s also possible to use GIFs so as to add some character to an in any other case formal e mail or use it to reinforce your model model and voice.
Inventive Growth, a world graphic design weblog, has a set of eyes that observe you round their web site. They carry this enjoyable method into their e mail, as nicely, by inserting it subtly inside the footer.
Pizza Specific makes use of dough ball characters that seem all through their children’ menu, firm web site and social media channels. So, bringing these characters into their e mail is a good way to reinforce the model.
How Do You Use GIFs in E-mail?
As we’ve seen in these examples, together with extra motion in your e mail can encourage longer studying time, spotlight necessary areas of your e mail, or improve your branding.
How do you utilize GIFs in your emails? Share with us within the feedback part under!
Writer: Jay Oram
Jay Oram is a part of the design and code options workforce on the e mail specialist company, ActionRocket. In his position at ActionRocket, Jay is often experimenting with new code for emails or discovering that elusive rendering repair. See extra articles from Jay at emaildesignreview.com or discover him on Twitter at @emailjay_.
Writer: Jay Oram
Jay Oram is a part of the design and code options workforce on the e mail specialist company, ActionRocket. In his position at ActionRocket, Jay is often experimenting with new code for emails or discovering that elusive rendering repair. See extra articles from Jay at emaildesignreview.com or discover him on Twitter at @emailjay_.
