Designing emails for mobile devices

How to make your emails work better on mobiles

How to make emails work better for users on mobile devices is a big issue for email marketers in 2011. I've recently written the forward for a new whitepaper by Ed Melly of SmartFOCUS on Email design for mobile devices (PDF).

Here is my summary of 5 steps to take to design better for mobile. You can see the full whitepaper at the end of this summary.

Step 1. Review industry mobile statistics

You'll know that mobile usage is growing rapidly. There have been significant year-on-year increases in Apple iPhone adoption, the Android platform is gaining momentum.Furthermore, the tablet market created by the iPad is expected to continue growing rapidly.

In its Internet Trends presentation of June 2010, Morgan Stanley predicted that the population of mobile users will exceed desktop internet users within five years.

Such predictions are not uncommon: Google CEO Eric Schmidt  said in October 2010 that: ”Search on mobile will eventually exceed that of PCs... so, eventually, mobile will be a very, very strong revenue stream in comparison to PCs”

He's talking globally, of course, but it shows why mobile is such a strategic priority for Google and will be for many other companies.

As you'd expect, the majority of our time on mobile devices is spent reading and responding to email.

Research by Nielsen shows that Email accounts for 42 percent of mobile internet time (compared to just 10.5 percent using social media, for example).

Step 2. Review your mobile statistics

Much more important, is finding out how YOUR mobile visits are changing. I'm hearing figures of 5-15% quoted quite often now, but these are the exception.

To find your mobile usage levels take a look in your Google Analytics at the Visits, Mobile Devices. You'll be able to see the main types of devices you need to support:

For my old site, the figure is only around 2% so it's not a major priority for me, every site owner needs to check their own.

You can also set an advanced segment of mobile to see whether people enter the site by mobile (landing pages report) and whether they convert (goals and ecommerce reports).

It's also worth looking to see WHEN these visitors read your emails.

Step 3. Select your target devices and define rendering approach

Smartfocus advise that your email must work in both Outlook 2010 and the latest mobile clients which support emerging standards like CSS3. It needs to hold up on a widescreen monitor and a mobile screen a few hundred pixels wide.

One approach is to create separate versions of your email and then let people choose between the two.

Another is to actively target recipients who your analytics software believes are using a mobile, then send them the ‘mobile-optimised’ version.

But fortunately Internet-enabled phones now include browsers and email clients that are based on the WebKit rendering engine, which has fantastic HTML and CSS support.

This includes the iPhone, Android devices, webOS, Samsung’s Dolfin browser and the latest version of RIM’s browser for Blackberry.

So design and code an email that works on the desktop, and you can be fairly
certain that it will render faithfully on all these devices.

Step 4. Select design requirements and layouts for each target device

The examples and reference links in the report shows how the masthead, headers and calls-to-action can be adjusted.

Step 5. Use coding techniques to render differently on different platforms

By using the approach of progressive enhancement and media queries, different levels of experience are provided to give capabilities of different devices.

Please view the details and an example of this in the report:

Email Design for Mobile Devices