Why You Need a Mobile Ready Email Template | npENGAGE

Why You Need a Mobile Ready Email Template

By on Feb 7, 2012


This is a guest post by the talented Brett Meyer, Communications Director at the Nonprofit Technology Network. Make sure to check out their annual Nonprofit Technology Conference, taking place in San Francisco, April 3-5 2012.

Did you know that nearly 90 million Americans use their phone to read email?

If you’ve been been putting off accepting the growing reality that people read the messages your organization sends on mobile devices, stop right now. Just stop it. Stop and accept.

ComScore reports that nearly 90 million Americans use their phone to read email – and that number grew by 28% over the past year. Mobile is no longer something we need to worry about at some point in the future. To ensure we’re getting our messages out effectively, we need to address it right now.

Fortunately, it’s pretty easy to get started.


The Data

Over the past two weeks, we’ve been running A/B tests on our new mobile template. We sent out a total of 15 distinct messages, to more than 50,000 addresses (roughly 5% of the messages we expect to send this year). The messages went out at the same time, with the same subject line and the same content; the only difference was the template – our new mobile-enhanced code against our old version.

The results couldn’t be more clear. 14 of the 15 messages with the mobile template performed better, by an average of 2 percentage points of open rate. (So, if the regular template achieved a 20% open rate, the mobile version got 22%). The spread was from 0.6% to 7%; the median improvement was 1.92%.

That’s good news. Even better? You can do it, too. It really only requires two changes.


The Preview

We were spurred into action by Gregory Heller at CivicActions. He asked,

“Why do so many organizations waste the opportunity to hook their email subscribers with the first line of the email message?”

Gregory’s not talking about subject lines exactly, but about how the ubquitous, “E-mail not displaying correctly? View it in your browser.” line had taken over his mobile in-box. Guilty! Here’s how our messages showed up in iOS:

And Gmail renders things similarly:

This is no small matter. Campaign Monitor found that as of June 2011, iOS and Gmail accounted for up to 23% of email clients.

It only took a little <table> magic to fix that problem. Now, our messages lead with something like:




It’s like gaining an extra 40-80 characters of promotion space! And the code changes are easy. We went from:


(Click images for full size versions.)

The Content

So, that addresses what our readers saw when they received messages from us on their mobile devices or in Gmail. What about when they read it? If you’ve read email on your mobile – and knowing this crowd, I’m sure you have – you know it can be a cramped experience. NTEN’s messages on an iPhone pretty much required zooming in:

To make it easier to read, we applied some style information, as suggested by Cameron LeFevre of M+R Strategic Services. Essentially, we just hid the (non-critical) information in the righthand sidebar:

Ah, that’s better: no distractions. (As a bonus, you can see how the extra table information that’s generating the preview text looks in the actual message, up there at the top.)

All it took was the CSS @media query. Seriously, you can pretty much just copy and paste. But Cameron’s already written up a guide for that, so I suggest you read that and follow his advice.


What’s Next?

If I’d been a better data scientist, I would have made just one change at a time and tested them separately – but I’m convinced enough of the efficacy of the changes in combination that all of NTEN’s messages will be using a mobile-enhanced template in the near future.

We have some work to do to clean up the look; I didn’t spend a huge amount of time making it pretty without knowing if it was worth the effort. We’ll likely also add some mobile-only style to make the font bigger in the mobile version, for even better readability.

Of course, you should keep in mind that the NTEN audience is very tech-savvy – yes, it’s okay to pat yourself on the back! – and your own results may vary. If you do some testing of your own, we’d be very interested to hear the results.

But I think it’s pretty safe to add this to my list of ways you can improve your email open rate.


Looking to learn more about nonprofit technology? Make sure to mark your calendar …

The Nonprofit Technology Conference, taking place in San Francisco, April 3-5 2012, will let you connect with your peers and learn the skills you need to put technology to work for your cause.

By joining more than 1,500 of your peers at the NTC, you’ll make a solid investment in yourself, your organization, and your mission – and it won’t take long to realize a return on that investment. Attending the NTC will leave energized and brimming with the actionable strategies you need to create the change you want to see in the world. Learn more at nten.org/ntc


Frank Barry, formerly worked at Blackbaud helping nonprofits use the Internet for digital communication, social media, and fundraising. He’s worked with a diverse group of organizations including LIVESTRONG, United Methodist Church, American Heart Association, Big Brothers Big Sisters, ChildFund Int’l, InTouch Ministries, Heifer Int’l, University of Notre Dame and University of Richmond. Along with writing for industry publications like Mashable and Social Media Today, Frank facilitates discussions, presents solo sessions and organizes panels for industry conferences such as NTC, SXSW, BBCon and numerous others. When he’s out and about he enjoys talking to interesting people about how they are changing the world – check out his interviews. Say Hi on Twitter – @franswaa or Google+

Comments (3)

  • Robynrost says:

    How can you implement these changes if you’re using an email program such as Constant Contact or Mail Chimp? These services let you use templates without knowledge of HTML. 

  • Very good and comparative information about mobile world.

  • Katy McFall says:

    In the examples under The Content, I actually find the first email much easier to read, and I can read it at a glace, whereas I struggle to see the second “mobile friendly” email because of the layout and the long text links. It’s the long text links especially that make it difficult. In the second email, I feel like I have to read *more.* Not that I want to, because it’s difficult to read.

    Also, it would be most helpful if the examples had teh same content–just showing us what a different format would look like–and only seeing the one variable (the format) as opposed to two.

Leave a Reply

Your email address will not be published. Required fields are marked *