Including a little bit of motion into an electronic mail can carry the message to life and elevate your electronic mail advertising. As these 5 manufacturers have proven us, GIF hero picture designs wow the recipient into trying out what an electronic mail has to supply.
However there are another methods a GIF can improve an electronic mail. On this publish, we’ll cowl some totally different makes use of for animated GIFs in electronic mail and how one can implement them in your subsequent electronic mail marketing campaign.
Measurement for GIFs in Electronic mail
It’s necessary to think about the varieties of pictures you utilize in an electronic mail, in addition to the general weight of an electronic mail’s HTML and its loading velocity. A slower load time may imply decrease engagement out of your subscribers.
There isn’t a hard-and-fast rule on the utmost measurement of a GIF in electronic mail, however the increased the file measurement, the longer it’s going to take to load. Aiming for beneath 200kb is an effective rule of thumb.
With most readers receiving electronic mail on their smartphones, you must 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:
Electronic mail on Acid’s Marketing campaign Precheck contains an picture optimization characteristic that means that you can see in case your pictures 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 electronic mail.
What About Outlook?
Now that it’s solely older Outlook shoppers that don’t assist GIFs, it’s price exploring some extra choices for animating pictures all through an electronic mail. You probably have loads of subscribers utilizing older Outlook shoppers, try this useful hack to indicate a selected static picture to those shoppers.
Methods to Use an Animated GIF in Electronic mail
Animated GIFs aren’t only for hero pictures anymore. Take a look at 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 selected module.
Deliver Life to Static Photographs
Followers of the Harry Potter movies and books have in all probability imagined including real-life motion to images.
These animated pictures may have many functions, from e-commerce to leisure. For instance, you would experiment with including a delicate spinning motion to a mannequin sporting the clothes you might be promoting. This can provide the e-mail recipient a bit of extra data and a full 360º view of the product, growing the prospect of a click on.
Enjoyable Typography
Including transferring textual content to pictures is a cool means so as to add a signature or fascinating factor to a message. Should you use this method, make sure you embody a separate static picture or embody all of the textual content within the first body to accommodate older Outlook shoppers. Additionally, don’t neglect to incorporate descriptive alt textual content.
Take a look at the code for this “Thank You!” message, together with a fallback static picture.
Transferring Backgrounds
Utilizing background picture fixes to cowl as many electronic mail shoppers as potential, you possibly can embody an animated GIF instead of a static picture so as to add some motion behind your content material. The fallback for these pictures is identical as a traditional GIF, so solely the primary body will present if the e-mail consumer doesn’t assist animated GIFs.
View the complete electronic mail on-line.
Calls-to-Motion
By including a small little bit of motion or encouragement to a CTA (an important a part of your electronic mail), you possibly can draw consideration to an motion you desire 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 participating and efficient. Utilizing this sort of picture provides a little bit of intrigue into an electronic 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 neglect you may as well use GIFs so as to add some character to an in any other case formal electronic mail or use it to reinforce your model model and voice.
Artistic Growth, a world graphic design weblog, has a set of eyes that observe you round their web site. They bring about this enjoyable approach into their electronic mail, as properly, by putting it subtly throughout the footer.
Pizza Categorical makes use of dough ball characters that seem all through their youngsters’ menu, firm web site and social media channels. So, bringing these characters into their electronic mail is a good way to reinforce the model.
How Do You Use GIFs in Electronic mail?
As we’ve seen in these examples, together with extra motion in your electronic mail can encourage longer studying time, spotlight necessary areas of your electronic mail, or improve your branding.
How do you utilize GIFs in your emails? Share with us within the feedback part beneath!
Creator: Jay Oram
Jay Oram is a part of the design and code options group on the electronic mail specialist company, ActionRocket. In his function at ActionRocket, Jay is normally 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_.
Creator: Jay Oram
Jay Oram is a part of the design and code options group on the electronic mail specialist company, ActionRocket. In his function at ActionRocket, Jay is normally 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_.