November 19, 2014

Using HTML5 Can Put Punch in Holiday Email with Animation

The holiday shopping season is in full swing according to some early birds, and even those who are holding out for the “official” start with Black Friday (NewsAlert) don't have much longer to wait. Astute retailers and vendors have been planning marketing efforts for some time now, but even those who have plans in place are retooling said plans as need be to account for changes in the environment. One big change is coming from HTML5, and it's opening up a whole new field that may not previously have been considered: animation in email.

The standards are all in play, of course—images, personalized greetings, the use of color and display features—but thanks to the growth of HTML5, animation is now becoming a more viable alternative than it was in the past. Frowned on in the past due to its potential to be interpreted as potentially dangerous content by ISPs and webmail clients, the move to HTML5 has allowed for a few new tricks to come into play that open up the use of animation. Additionally, many regarded the quality of animation even just a few years ago as inferior, and not worth using as it would reflect poorly on the user. Again, however, that has changed with the rise of HTML5.

With the use of HTML5, the code is set up to read directly to the email client. With that kind of up-front behavior, it's hard for even the most secure ISP or webmail provider to regard the message as “spammy” or worse, a potential portal for malware. Better yet, the code can be established in such a fashion as to adapt the video as needed for the display, ensuring that the best presentation is made regardless of the device used to read the message. With an increasing number of email clients allowing for animated content in general—given the rise of things like Vine and assorted GIFs running around, that's a move that's not surprising—that only improves the odds of both the message getting through and the animation being enjoyable when it gets there.

Still, however, there are things to remember, other than using HTML5 to drive the animation in question. Be careful with the use of animation; too much has the potential to clutter the message and render it useless. This is still a marketing document, so make sure important things like the call to action and the like are still front and center. Better yet, for those who add video, leave out autoplay; it's impossible to know in advance just what the target is doing at the time, and the last thing anyone wants is to cause a Flash crash in someone's browser. No one wants potential customers to think, oh yeah, that's the company whose email crashed my browser.

The proper use of animation in email might best be described as like a spice. Eating an entire spoonful of cinnamon is really not recommended, but throwing a little in the apple cider makes it a completely different experience. An animation or two can perk up an email, but a load of same can do more harm than good. It's worth exploring all the potential tools a marketer might have on hand—these days people are surprisingly resistant to many forms of marketing—and animation, thanks to HTML5, may have a better chance than ever of hitting its mark.

Edited by Maurice Nagle


HTML 5 Demos and Examples

HTML 5 experimentation and demos I've hacked together. Click on the browser support icon or the technology tag to filter the demos.... Learn More

HTML5 GAMES is the largest and most comprehensive directory of HTML5 games on the internet... Learn More

The HTML5 test

How well does your browser support HTML5?... Learn More

Working Draft (WHATWG)

This is the Editor’s Draft from WHATWG. You can use it online or print the available PDF version... Learn More

HTML5 Flip Book

Free jQuery and HTML5 flip book maker for PDF to online page turning book conversion... Learn More