Why more marketers need to think about responsive email design

The growth of mobile has been a game changer for the world of email marketing.

Considering that smartphone usage tripled in 2011, it’s no surprise that email consumption via mobile devices has also seen a steep upturn.

Furthermore, we have seen some of our clients experience open rates of around 70% on mobile, proving just how vital it is when running campaigns.

However, at times we, as marketers, struggle to find a consistent definition of what the term ‘mobile’ actually means.

Ultimately, it can apply to all manner of different devices and scenarios, such as receiving an email on your laptop when travelling, on your iPad while watching television, or on your mobile during the early morning commute. Or all of the above!

Therefore, email must be optimised for all of these different situations, so that every recipient you target, in each of these different situations, can consume your content effectively. Rendering in different email clients has always been a challenge for marketers but, when you throw different screen sizes into the mix, things get even more complicated.

Responsive design to the rescue

The concept of responsive design is one that is now widely used in the web design space as the most effective way to optimise content for mobile devices.

However, when it comes to email marketing, responsive design is still largely ignored by the masses, why is this, is it simply forgotten or perceived as too technical? This is particularly surprising considering that 88% of smartphone owners check their email on their mobile phone every day.

Even when I see responsive design utilised effectively for web optimisation, the email campaigns used to drive traffic to the optimised site are almost unviewable on smaller screens, making the whole strategy rather pointless.

The best news of all is that, although it sounds complicated, mobile optimised responsive email can be a relatively simple process.

Here are a few tips to get you started:

  • No more separate coding. Responsive design means you use one code for all devices. This is added to and tweaked for optimisation on different platforms.
  • Change your content. When and where recipients are affects the way they engage with your email. Factor this into your design. Send them a non-intrusive design during waking hours or a call to action that is simple enough to respond to while on the commute home.
  • Target specific devices. There is no set template for every different laptop, smartphone or tablet. You have to experiment and see what works in terms of rendering, readability and usability across as many platforms as possible to get it right.
  • Analyse your results. Find out what works in terms of open rates and engagement. When are people more likely to open? What kind of people open on what device and where? Use this data to your advantage to create a more targeted campaign next time round.

Tink Taylor is Managing Director of dotmailer and a guest blogger on Econsultancy. 

Add your own

Reader comments (21)

  1. Sharon Jennings Sharon Jennings

    Email Production Specialist at Metia

    10:08AM on 16th October 2012

    This is something that everyone seems to be talking about, but no one's actually DOING!?

  2. Avatar-blank-50x50 Thomas

    10:19AM on 16th October 2012

    This is SO crucial to our email marketing strategy...our 'open' rate from mobile is on average 95% compared with just 73% for desktop! Our mobile viewing customers purchase on average 40% more also, please don't over look the importance of this article :)

  3. Elliot Ross Elliot Ross

    Email marketing design at actionrocket.co

    10:42AM on 16th October 2012

    Agree with all of this, I think one thing that can help is to build the responsive code into a template. The code can be quite fiddly to work with, so it makes sense to get it right, lock it down, then just update the content as you need.

    Sharon - there's a few more out there now, but it can depend which device you're using - I see quite a few on my iPhone.

  4. Avatar-blank-50x50 Ben Goodwin

    Email marketing manager at Personal

    10:47AM on 16th October 2012

    @Thomas,

    Your comment makes no sense to me, sorry. How can you measure your open rate to mobile separately from your open rate for desktop?

    Sure, you can measure what % of opens are on each, but you can't determine an "open rate" for mobile and desktop because the email is delivered to a mailbox, not a device.

  5. Sharon Jennings Sharon Jennings

    Email Production Specialist at Metia

    11:22AM on 16th October 2012

    @Ben Some Email providers allow you to see what device(s) your email was opened on.

    @Elliot - I'm on Samsung, and see very little that doesn't involve scrolling and/or zooming...

  6. Avatar-blank-50x50 Ben Goodwin

    Email marketing manager at Personal

    11:26AM on 16th October 2012

    @Sharon,

    I know that. That allows you to tell what % of your emails are being opened on particular devices.

    Thomas was suggesting he measured a 95% open rate for mobile and 73% for desktop. It's this that I'm struggling with, as I can't see how it's possible, or even makes sense. There is no such thing as an open rate for mobile (as in opens/sends to mobile) which seems to be what the comment suggests. I send an email to a 1,000 customers, they either open it or they don't - this gives me a campaign level open rate (as well as per domain). If they open it on an iPhone, I get an overall iPhone open rate. What I cannot measure is an 'open rate' for mobile and an 'open rate' for desktop in the same way as a campaign level open rate, which is what Thomas is suggesting given 95% + 73% is more than 100%

  7. Elliot Ross Elliot Ross

    Email marketing design at actionrocket.co

    11:37AM on 16th October 2012

    see what you mean - a mobile open rate would be the % of people who received the email on mobile, but did/didn't open. But you can't tell if a user received the email on a mobile until they open it.

    What you may see is, where some platforms send a different html to "mobile" users, segmenting the list based on what device/browser they've used previously. You'd get an open rate for your "mobile" list and your "desktop" list there, but that's not responsive email, and these days that approach doesn't work as well.

    @sharon - are you using Gmail app? some of the responsive code doesn't work there, so that might be the reason, also some designers may be targeting smaller screen sizes

  8. Sharon Jennings Sharon Jennings

    Email Production Specialist at Metia

    11:44AM on 16th October 2012

    @Elliott - not using gmail, using the standard email app. And I can code it so it works in there...

  9. Elliot Ross Elliot Ross

    Email marketing design at actionrocket.co

    11:51AM on 16th October 2012

    might just be the screen size then.. if designers/coders are targeting max-device-width: 480px then it might get missed off with a larger screen size. though mind you, there *are* still lots of non-optimised emails out there

  10. Sharon Jennings Sharon Jennings

    Email Production Specialist at Metia

    11:53AM on 16th October 2012

    @elliott - sucks!

  11. Avatar-blank-50x50 Aidan Foster

    8:22PM on 16th October 2012

    Given that Internet explorer 8 or below doesn't understand media queries and Outlook still renders HTML in word - I think responsive emails will have to be created as "desktop first" responsive design (which is the opposite of how I like to build responsive websites). Then on mobile if the email client is capable of understanding media queries you re-flow to a small-screen format - If it doesn't you get the same crappy experience you get now - A desktop email on mobile.

    I'm running responsivedesign.ca and would love to know if there's any resources which outline media query support for the various email clients, and email web services - Any suggestions?

  12. Avatar-blank-50x50 Dave

    10:37PM on 16th October 2012

    My company is currently still using table-driven design on our emails because of the lack of CSS support in many email clients.

    Don't a lot of email clients strip out the CSS? Is it possible to build a responsive template without it?

  13. Elliot Ross Elliot Ross

    Email marketing design at actionrocket.co

    11:08PM on 16th October 2012

    @Dave - yep the idea is generally you stick with table based layout, which still works in the desktop, then you use media queries to format those when it's viewed on a mobile device. The tables and table cells can be pretty flexible if you build them in the right way.

    @Aidan - agree, traditional responsive stuff doesn't work on desktops, it's really only useful for phones and tables. The code isn't read by desktops, but luckily we don't need it to. The best approach I find is to design a desktop version, that also has some design enhancements for mobile, such as larger buttons and larger typefaces, and then use responsive as an extra layer that works on top of that on mobiles.

  14. Avatar-blank-50x50 Ryan

    11:33PM on 16th October 2012

    Making sure that your site is viewed correctly on all of the different devices is something that will drive many people crazy. Technology is changing so fast, it is difficult for many companies and small businesses to stay on top of it. It is vital that they have someone working with them to help them on top of their site and all of the changes that need to be made.

  15. Avatar-blank-50x50 Artur

    10:22AM on 17th October 2012

    Isn't it the case that Gmail app on smartphones strips all media queries?

  16. Sharon Jennings Sharon Jennings

    Email Production Specialist at Metia

    10:57AM on 17th October 2012

    @Artur - Yes it is. So just need to make sure that your email is optimised for mobile (as you should be anyway), as well as responsive. Then all bases are covered as much as possible.

  17. Avatar-blank-50x50 Ant Stone

    11:30AM on 17th October 2012

    "Furthermore, we have seen some of our clients experience open rates of around 70% on mobile, proving just how vital it is when running campaigns."

    Does this mean 70% of mobile recipients open the email; or 70% of all opens are on mobile?

  18. Chris Knowles Chris Knowles

    Web Designer at The Data Octopus

    11:30AM on 17th October 2012

    Whilst I absolutely agree that we should be thinking about how our emails appear on mobile, the audience who receives them determines how high up the priority list it is.

    Our last campaign only showed around 7% of opens via mobile devices, with Outlook still reigning supreme, but the audience was B2B.

  19. Ian Brodie Ian Brodie

    Founder at The Rainmaker Academy

    11:36AM on 17th October 2012

    You know, all my emails have been mobile responsive for years.

    And the reason is, I don't use any graphics (other than the odd image of a video snapshot for people to click on).

    Using plain text with a bit of formatting (bold, italics, anchor text on hyperlinks) means the device can format the email in the most readable format possible.

    All I have to do is make sure I'm using short paragraphs so that the text doesn't look to dense.

    Won't work for everyone of course - but in truth very many people send out emails that are simply text with a graphical header. And it's the graphical header that screws the responsiveness as the device tries to fit the header into the small screen and so shrinks everything to make it unreadable.

    A couple of years ago marketingexperiments published results showing that heavily graphical emails got 55% fewer clicks than plain text ones (which is why I switched to simple text emails).

    Times have moved one, but I wonder if anyone's seen any more recent test results.

    For me as a one-man business, simple emails work best as they feel to the reader like they're coming from me personally - they look like an email they'd get from friends and colleagues. Graphical emails look like emails you get from people trying to sell you stuff.

    Ian

  20. Avatar-blank-50x50 Tink Taylor

    6:03PM on 17th October 2012

    @AntStone Re: "Does this mean 70% of mobile recipients open the email; or 70% of all opens are on mobile?" It is 70% of all opens.

  21. Avatar-blank-50x50 John Smith

    9:51AM on 18th December 2012

    Email marketing is an effective way to reach your customer, but your Email design must be effective and informative.

Log in to post a comment