Mobile-friendly email: Trends and best practices

www.act-on.com | @ActOnSoftware | #ActOnSW

Mobile-friendly emailTrends and best practices

Join the @ActOnSoftware conversation on Twitter and discover what others are saying about us:

#ActOnSW


Welcome! Thanks for joining us today.

Janelle JohnsonDirector, DemandGen

Act-On Software@janelle_johnson

Justine JordanMarketing Director

Litmus@meladorri


Agenda

• Email Marketing Basics

• The Lay of the Land

• Email Best Practices

• Tips & Tricks for Mobile Emails

• Trends & The Future


Importance of Email Marketing


Leverage Email Marketing

• Consistency in messaging

• Planning and coordination

• Content is King


The Basics

1. Segment

2. Subject line

3. CTA / Landing Page

4. Test & Refine

5. Mobile -friendly


Some Stats: A Lay of the Land


Email Opens: January 2013

Desktop33%

Webmail25%

Mobile42%

Source: Litmus Email Analytics

Mobile: Smartphones (iPhone, Android) and tablets

Desktop:Installed email programs (Outlook, Apple Mail)

Webmail:Email accessed through a web browser (Gmail, Hotmail, Yahoo!)


Change Over Last 12 Months

Jan FebMarch April May June July Aug Sept Oct Nov Dec

Jan220%

25%

30%

35%

40%

45%

50%

Opens in Each Environment

Webmail Desktop Mobile

Mobile opens have grown 138% in 18 months; 45% in last year

42%

38%

33%

Source: Litmus Email Analytics


Mobile Market Share

iPhone56%

Android16%

iPad27%

Other1%

Mobile Email OpensSource: Litmus Email Analytics

Android

iOS

Blackberry

Microsoft

Symbian

Others

0% 10% 20% 30% 40% 50% 60% 70% 80%

69.70%

20.90%

3.50%

3.00%

1.20%

1.70%

53.40%

36.30%

6.40%

2.90%

0.60%

0.40%

Smartphone OS Share

US WorldwideSource: ComScore (US); Gartner (Worldwide)


Know Your Audience

31% of marketers don’t know their mobile email open rate!

What percentage of customers/prospects interact with your organization’s mobile email messages?


Back to Basics: Best Practices


Subscriber Experience

Subscribers view emails in stages, making

choices as they go.

Landing Page/SiteClick

Preview/Open

Preheader

Subject Line

From Name


Envelope Fields

From Name~25 characters

Subject Line ~35 characters

Preheader~85 characters

Preheader


Preheader

• Support the subject line with a creative, useful or helpful preheader.• Call-to-action• Special offer• Reminder• Clickable/

measurable

Preview/Open

iPhone: 320 x 460

Android: Dimensions vary;

top-left corner displayed


Preview/Open

Emphasis on from name & subject line. Images often disabled.

iPhone Windows Phone Blackberry


Click

• Tappable touch targets• Bulletproof buttons that

don’t rely on an image• Left-hand side


Landing Page/Site

Don’t forget the landing page!

Not these… But these!


Tips and Tricks for Mobile Emails


Consider Context

• You can’t predict where users open… most of the time.• Mobile app follow-ups• Travel alerts• Mobile coupons• Weekend sends


The Finger is the New Mouse

Design for tappable touch targets; not text links44 x 44px minimum

Touch Targets

Text Buttons Image “Buttons”


Increase Font Sizes

• Recommended minimums• Body copy: 14px• Headlines: 22px

• Body copy < 13px will be resized in iOS• CSS fix: “-webkit-text-size-adjust: none;”


Increase Font Sizes

Streamline

• Content comes first• Reduce clutter

• Navigation• Repeated links• Low priority

content/imagery• Clear and direct

copy/CTAs

Don’t Create Friction


Trends and the Future


Symbols in Subject Lines

Can increase open rates. Use carefully to support your message rather than detract from value


Mobile First/Aware/Scalable

• One layout for all screen sizes

• Single column design• 320-500px

• Large text & buttons • Generous white space• Clear calls to action • Short, concise body copy


Responsive Design


Responsive Design

• Uses media queries or @media• Not a “line of code”, more like a conditional

statement that enables alternate styles• If the screen size is x, then display y• If the screen size is x, then increase headline size to y• If screen size is x, then show image at 100%

• Detects screen size of the device being read on and enables alternate styles accordingly

• Not supported everywhere


Device Detection

Detects mobile device at time of open: deliver “deep link” directly to app store, specialized content, timers


Inspiration and Examples

Jetsetter: Aware

Vodafone: Responsive


Resources & Takeaways


Resources

stylecampaign.com/bloglitmus.com/blogcampaignmonitor.com/blogemaildesignreview.commobileawesomeness.commediaqueri.esMedia Post Email Insider columnsA List Apart / A Book ApartEthan Marcotte and Luke Wroblewski


Your Takeaways

• Know your audience!• Don’t forget about the basics

• From name• Subject line• Landing pages

• Quick wins:• Bigger text• Touch targets (big buttons)• Streamline content

• Explore different approaches; find what works best• Responsive design isn’t a silver bullet


Q&A

• Justine Jordan• Marketing Director, Litmus• [email protected]• @meladorri

• Janelle Johnson• Director, DemandGen, Act-On Software• [email protected]• @janelle_johnson

mailto:[email protected]

mailto:[email protected]

Date post:	01-Nov-2014
Category:	Technology
Upload:	act-on-software
View:	738 times
Download:	3 times

Mobile-friendly email: Trends and best practices

Technology