The world functions on interactivity. From flicking on a switch to lighting a room, tapping certain points on your handheld device in a sequence to order a pizza, or even saying ‘Hey Siri’ to bring up your personal assistant, every action demands our interaction. In fact, we learn better via interactivity (babies today can easily navigate their way around a digital device without anyone teaching). This is why most websites use JavaScript to create beautiful animations and interactive elements in their homepages.

By Chris Donald

Unfortunately for emails, interactivity was a distant dream as JavaScript was not supported owing to security reasons. Then in 2014, the inclusion of CSS animations and email client support, brought a new ray of hope in the horizon for email interactivity. Email developers started incorporating interactive email elements such as hamburger menus, image carousels, keyframe animations to increase user interactivity which enhances the user experience, thereby improving the customer engagement.

How interactivity improves customer engagement?

An average email subscriber is never going to ‘read’ your email. People generally prefer to scan any content, looking for keywords and terms that answer what they are looking for. If the email fails to communicate the message in mere seconds of opening, its purpose is defeated.

Now, if the email message is programmed to be revealed only on user interactivity, there is a very good chance that curiosity will push the subscriber to spend more time to interact with your email. This increased time spend is roughly translated into increased interest and the more interested a subscriber is, the more are their chances of converting.

In fact, a research by Demand Metric found out that interactive elements boast of a conversion rate of 70%, which is double compared to non-interactive elements (36%). Psychologically, when a subscriber interacts with an interactive email, they feel like an active part of the email.

Moreover, by using interactive elements such as survey and polls in an email, you can collect personalization information which you can use to further create relevant and customized content.

What different types of interactivity are possible in emails?

Fixed Element / Scrollable background

Parallax effect is quite popular in website designs. Exporting similar concept, email developers have managed to create emails wherein an element is static, and the background moves based on user interactivity. In the email example below by Penguin Random House, the bus remains static while the background moves in order to create an illusion.

While this is a purely visual effect, it motivates the subscriber to scroll till the end while going through the copy and there is a good chance that the subscriber might have clicked the CTA button. In a similar way, you can add a fixed CTA button which doesn’t move with the content and so the subscriber can click the CTA at any point of the email.

Accordion effect in email

Ideally, an email should be only 2 scrolls long but sometimes you need more space, especially when you need to show more than 2 products. Taking an inspiration from the musical instrument, the accordion effect in email expands or collapses specific sections based on where the subscriber clicks or taps. This way the length of an email is reduced considerably without sacrificing the email content. In this email by Microsoft, they showcased the features of different products by having a user click on individual sections. Additionally, you can add a CTA to each section and you can measure which section performed better.

Click based keyframe animations

Animated GIFs are predominantly being used in emails by brands worldwide, but they start playing as soon as you open the email. This way they lose their charm. What if you could delay the animation till someone clicked on the email copy? This is exactly what click based keyframe animation does. The holiday greeting from Adestra will explain the fun-ctionality in a better way.

When the subscriber opens the email, all they see is a blank snow globe. Once they click the button, the magic happens – a GIF starts playing and on clicking it again, the animation changes. This way the customer is intrigued to click more than once to check out all the different animations.

Many more exist but beware…

Email developers are constantly coming up with interesting ways to make an email interactive but using interactivity in your email is like a doubled edged sword. If implemented incorrectly, it can damage your brand reputation. Interactivity relies heavily on CSS animation and not many email clients are capable enough to run all the different types of interactivity. Always create an interactive element with a fallback support for non-supporting email clients to avoid a broken user experience. Moreover, interactivity needs to have a meaning in your email message. Never add an interactivity just for the sake of it.

Takeaways:

  • Interactive elements boast of a conversion rate of 70%.
  • Interactivity in email relies on CSS3 animations.
  • Certain interactive elements can help you know your subscribers better. (e.g. surveys, polls and accordion)
  • Support for Interactivity in emails depends on email clients. Always have a fallback support ready.
  • Interactivity in emails should only be implemented if it is purposeful.

Chris Donald is the Director of InboxArmy, a professional email marketing agency that specializes in providing advanced email marketing solutions from production to deployment. He has worked directly with Fortune 500 companies, retail giants, nonprofits, SMBs and government bodies in all facets of their email marketing services and marketing automation programs since almost 2 decades. He enjoys sharing his distinctive thoughts and insights into email marketing best practices at his blog.

Email interactivity stock photo by Gajus/Shutterstock