Learning Center

The Trouble With Responsive E-marketing

The mobile market continues to explode – in fact, Target and Amazon report that a whopping 60 percent of November-December 2014 traffic to their websites came from mobile devices like smartphones and tablets. Even more striking, mobile surpassed television as the top “attention medium” in 2014, meaning that people are spending more and more time with their mobile devices. It’s clear that any website that isn’t responsive – that is, built to look good on any size device — is missing a major part of its audience.

But what’s becoming increasingly obvious is that mobile use is important in e-marketing, too. Data from 1.8 billion marketing emails sent in 2013 shows that 41% of all marketing email is first opened on a mobile device, compared to just 28% on a desktop and 22% in webmail. This represents an incredible 30% shift toward mobile from 2011 to 2013.

Data from 1.8 billion marketing emails sent in 2013 shows that 41% of all marketing email is first opened on a mobile device, compared to just 28% on a desktop and 22% in webmail.

With those kinds of statistics, it’s not surprising that responsive email works better, too. According to Litmus and MailChimp, responsive design results in an almost 15% increase in clicks.

But despite the clear evidence that mobile marketing is the way to go, relatively few e-marketers have begun sending responsive emails. In fact, Jay Baer tracks more than 150 business-to-consumer brands, and found that just 51% of them use mobile-friendly email marketing.

So why haven’t web developers, who have dutifully learned the ins and outs of responsive web design, applied what they learned to responsive e-marketing?

The technical challenges of responsive email design

As it turns out, the reason is simple. Programming responsive email is technically difficult and not at all similar to responsive web design — in fact, it’s the polar opposite, as we’ll see. Technical challenges involved with programming responsive email include:

Modern email clients (applications for Outlook, Gmail, or apps for most Android devices) do not support modern, responsive code, which means:

• Coding a responsive email is like coding a website from the early days of the web. At one time (in the late 90s to early 2000s), the HTML table element was the fundamental method of adding any sort of design or style to a website. Originally designed to display table data (such as that found in a spreadsheet), early web designers adopted the element to create a coding technique that essentially involved piecing webpage sections together like a stack of Jenga blocks — if one piece was off or misplaced, the entire layout would collapse. While the web has evolved enormously, and much better coding methods are available now, responsive email design still requires this antiquated technique. Ironically, websites designed in this older way were not responsive, but emails designed in this way are! Even modern email clients, like those found on your smartphone and tablet, still haven’t caught up to coding techniques that evolved in the early 2000s. So, as you can imagine, responsive design — an idea which really only came to fruition in webpage design around 2012 –comes with a few caveats when we’re talking about email. For example, “media queries,” or blocks of code which are able to detect the width and height of a browser window, are not supported on many modern email clients, including Gmail, one of the most popular web-based and app-based email options.
• Coding the old way for email means reverting to an antiquated and less-efficient way of doing things, which is counter-intuitive to experienced designers. Younger web designers may not even know this technique at all, as it was outdated by the time they began to learn.

There are multiple email clients across multiple versions of multiple devices. Today, most browsers render websites the same way, so a website generally looks the same on, say, Chrome, Safari, Explorer, and Firefox — which wasn’t true in the early days of the web, meaning that designers had to test websites on all browsers and make tweaks so that the design would function equally well on each of them. Email clients have not evolved to the point where an e-newsletter design renders the same way on them all — far from it. And there are an enormous number of email clients (many more than web browsers). Just a couple of examples of what this could mean are:

• Something that displays great on the Gmail app for iPads could look horrendous in Outlook for desktops.
• Even something that works on an older version of Android might not work on a newer version.

There’s an issue with images. Because many smartphones and tablets are now using retina displays (screens that show images at a higher resolution), larger images must be used to create a crisp, sharp look. This can be a problem for email clients that limit the size of incoming emails, not to mention the technical difficulties involved in creating fluid width images that don’t break the entire layout in some email clients, particularly Microsoft Outlook.

Testing is time-consuming. Any responsive design should be tested across a wide range of devices, but this is really hard when dealing with email. Here are reasons why:

• There are services that allow you to see what email templates look like across multiple clients and platforms, but testing on a real device is always best/most reliable.
• The sheer volume of email clients and devices means it’s simply not feasible to test on every device using every possible email client.

But all that doesn’t mean it can’t be done — in fact, Prime Design Solutions has recently re-programmed our monthly company e-newsletter in a responsive format (not a subscriber? Join at using the form in the upper left corner!), as well as the e-newsletter for Do Johnstown!, a blog and events calendar we operate. It does, however, mean that coding responsive email is difficult and time-consuming, which explains why so few e-marketers have done it.

Conclusion

Despite these significant technical challenges, the reality is that e-marketers have no choice but to shift to responsive e-marketing – the shift toward mobile and away from desktops will only increase. Also, we can hope that in time, programming innovations and developments will begin to make the design process easier, as it did with web design.

In the meantime, the good news is that once you have invested in a responsive email template you’re set for the foreseeable future.

• email
• responsive design
• responsive email marketing

By Shelley Johansson. Read about Shelley on our Meet Our Staff page.