how to create amazing mobile emails

800-‐920-‐7227 | www.pinpointe.com

Presented by Pam Neely


Webinar brought to you by…

Leader in B2B Email Marke9ng


FEATURED SPEAKER Pam Neely Marke1ng Content Creator, Email Expert www.pamneely.com Phone: 505.660.7072 | [email protected] Twi>er: @pamellaneely

MODERATOR Eryn Branham Pinpointe On-‐Demand, Inc. [email protected] 800-‐920-‐7227

Email markeIng and content creaIon expert, author of “50 Ways to Build Your Email MarkeIng List”


Free GiM

From Email on Acid (a Pinpointe partner)

!  Free White Paper: MOBILE OPTIMIZATION h>ps://www.emailonacid.com/images/blog_images/downloads/2015/MobileOpImizaIon/eoa_mobileopImizaIon_pinpointe.pdf

!  Includes a FREE RESPONSIVE EMAIL TEMPLATE (page 20)


What We’ll Cover Today

•  How widespread is mobile email use? •  How mobile users interact with email •  Design Ips for mobile •  CopywriIng Ips for mobile •  Examples of mobile emails


How widespread is mobile email use?


Cellphone and smartphone use con9nues to expand globally

From eMarketer 2 Billion Consumers Worldwide to Get Smart(phones) by 2016 December 11, 2014

Total global populaIon is 7.3 billion, so as of right now 26% of global populaIon has a mobile phone. 11% of global populaIon has a smart phone.


According to Ericsson, 90% of the world’s popula9on over age 6 will have a mobile phone by 2020


And smart phones aren’t just for calling…

From Email Monday’s Mobile Email Usage StaIsIcs, last updated this month.


Mobile device growth wordwide

From the RadicaI Group’s February 2014, “Mobile StaIsIcs Report, 2014 – 2018”


What Americans use their phones for


“My subscribers are older. They won’t read emails on their phone.”


“But my industry is different, I’m in…”

From the Movable Ink Q1 2015 US Consumer Device Preference Report


Which mobile devices?


Mobile use overall



Litmus’s stats for mobile usage as of January 15th


Here’s how the stats on devices used for mobile emails breaks out

x From the Movable Ink Q1 2015 US Consumer Device Preference Report


Here’s how the stats on devices used for mobile emails breaks out

From Litmus blog January 15, 2015


Maybe we should all get gold iPhones to remind us


Where’s Android?

?


How mobile users view and interact with email


Many mobile users will scan or cull their inbox via their phone first.

They use their phones to deciding whether or not to keep your email based on

•  How important it appears to be (from boss, client, family, airline)

•  Does it look good and read easily on a mobile device


Our subscribers are “mobile first” in this sense Many of them decide to keep or cull our emails based on how they “render” or appear or a mobile device. The data firm Optyn found 75% of smartphone users delete emails if they can’t read them easily on a mobile device.


But they will unsubscribe if…


These are similar reasons to why people unsubscribe from any email In March, TechnologyAdvice Research asked 472 U.S. adults: “For what reasons have you marked a business' emails as spam?”


In January of this year, MarkeIngSherpa asked 2,000 adults “How ooen, if ever, would you like to receive promoIonal emails (e.g., coupons, sales noIficaIons) from companies that you do business with?”

Here’s how oMen people want to get emails


Types of mobile-‐friendly emails


There are three general types of mobile-‐friendly emails

•  Scalable •  Fluid •  Responsive


Scalable or “mobile-‐friendly” emails

•  No media queries – the email isn’t set up to show a specific set of

code for each different device.

•  Scalable code does not adjust to different devices.

•  Basically an old-‐style coded email modified to look okay for mobile

users.

•  Scalable email designs may also be called “mobile-‐aware”, “mobile-‐

friendly” or “agnosIc”.


Examples of scalable emails


Fluid mobile-‐friendly emails

•  No media queries.

•  Instead of staIc measures (“50 pixels”), fluid design uses

percentages (“15%”) to control layout.

•  Also known as “liquid design”.

•  Consider using the “max width” property in the code so you don’t

end up with readably long lines of text if someone is reading your

email on a desktop.


Examples of fluid emails


Responsive mobile-‐friendly emails

•  This is the most widely-‐talked about mobile

email design approach.

•  Responsive emails use media queries to serve

up different versions of code based on what

device the email is being viewed on.

•  This lets you code your email to, say, display

two columns on a desktop, but only display

one column on a mobile phone.


Fortunately, most email service providers offer responsive email templates (Pinpointe included) •  You almost never have to “recreate the wheel” •  Just use one of the responsive templates your email

provider offers •  Tweak that design to fit your needs


Some of Pinpointe’s Responsive Templates


What are email marketers doing?

From the Econsultancy Email MarkeIng Industry Census 2015, in associaIon with Adestra


How sophis9cated is marketers’ mobile email op9miza9on?


What specifically are marketers doing?


A responsive email case study


Responsive email case study Stream Companies had recently redone Montgomeryville Nissan’s emails. To verify how effecIve the new responsive template would be, they ran three A/B split tests with the new responsive template against a non-‐responsive template.


The responsive email crushed the original design


Don’t expect to double sales

If you switch to responsive coding. But a 15% lio is a good bet.


Designing for mobile


Mobile-‐friendly email design essen9als

•  Clear hierarchy •  Readable font size •  Clickable bu>ons •  Clickable navigaIon •  Single column design •  OpImized images •  Looks good verIcal & horizontal •  Fluid or responsive •  White space


Mobile design essen9als: Font size

•  Font size has to be big enough to read. 16 points is the minimum.

•  Headlines should be 22 points or larger

•  Use type size to show hierarchy of content

This is too small to read


Mobile design essen9als: Call to ac9on

•  Bu>ons have to be big enough to be “clicked” with a thumb

•  At least 44 x 44 pixels, plus at least 10 pixels of space all around.

•  Use CCS bu>ons, not images.


Mobile design essen9als: Call to ac9on

This is big enough to click easily

These are not even close to being easy to click. They need at least double the space around them.

These are okay… just barely. People will hit the wrong item a lot.


Good-‐sized social media icons!


•  Make the logo clickable

•  Make type big enough to read and click

•  No more than 3 or 4 choices

•  Consider leaving it out enIrely

Mobile design essen9als: Clickable naviga9on


Mobile design: Clickable naviga9on


Don’t forget load 9me aka “paint 9me”

Aim for an email size of about 75kb or less •  Reduce file requests (images, etc) •  Keep message short •  Simplify your code as much as possible •  Minify the html •  OpImize images


Resources for email designers

•  Email on Acid’s Mobile Op9miza9on whitepaper h>ps://www.emailonacid.com/images/blog_images/downloads/2015/MobileOpImizaIon/eoa_mobileopImizaIon_pinpointe.pdf *Includes a free responsive template

•  Jason Rodriguez’s book, Professional Email Design h>p://rodriguezcommaj.com/books

•  Interac9on Design Best Prac9ces: Mastering the Tangibles h>ps://www.uxpin.com/interacIon-‐design-‐best-‐pracIces-‐tangibles.html

•  Interac9on Design Best Prac9ces: Mastering the Intangibles h>ps://www.uxpin.com/interacIon-‐design-‐best-‐pracIces-‐intangibles.html


Don’t forget the landing pages!

If your landing pages aren’t designed for mobile, even the best email is only going to get you so far. Landing pages – and websites – all need to be mobile friendly.


Don’t forget to preview before you send Email on Acid Preview in Pinpointe:


Email copywri9ng for mobile


Email body copy

•  Short •  Easy to understand –

5th grade level

•  Forma>ed to be easy to read

!  Headers !  bullet points !  1-‐line paragraphs


Bullet points versus no bullet points


An email in less than 15 words?

Buffer blog update: Headline & bu>on copy: 15 words! With the two lines of promo text below: 28 words


An email in less than 35 words? Botanical Interests email Logo and teaser copy: 11 words Add 9 words to explain the offer: 20 words Copyright & unsubscribe info: 14 words Bonus: See the CAN-‐SPAM rule broken here?


Word counts for other emails

Jeff Bullas blog update: 196 words


Compare to this:

Men’s Health promoIon: 268 words *This is also an example of fluid design


Email copy: subject lines

•  Shorter than for desktop emails.

35-‐60 characters generally okay.

•  45 characters for iPhone 6 verIcal; 84 characters horizontal

•  What’s visible will change

depending on the device


Don’t forget preheader text


Here’s how the inbox looks for different iPhone users

From the Litmus 2015 State of Email Report


Which companies are doing a great job with mobile emails?


Expedia

What’s good about them: •  Look good in one screen •  Look great both verIcal and

horizontal •  Images are very well

opImized •  NavigaIon is clickable •  Huge, super-‐easy to click calls

to acIon


Expedia

Each secIon of the email frames beauIfully in horizontal view


Expedia


Shopify

Like the free trial call to acIon in the header

Unusually long subject line

Would like to see these spaced out WAY more

63 words including call to acIon copy on bu>on


Same Shopify email, but in horizontal view 67 characters, including spaces. OpImal line length, according to Baymard InsItute, is 50-‐60 characters, though they also acknowledge that up to 75 characters is acceptable. Also note that the long hyperlink calls out one parIcular sentence of text AND makes clicking through much easier.


Copyhackers

•  Text-‐based emails. •  Ideal newsle>er to study

email copywriIng from •  Note the single-‐line

paragraphs •  Far longer than usual –

about 600-‐700 words •  Note the code in yellow


The Future: New devices Mobile use is spreading across different exisIng devices

-‐ Apple iWatch -‐ Google Glass -‐ The Internet of things


Wri9ng for the Apple Watch •  Include a text version or people will see

a default “can’t read” message •  Subject line, pre-‐headers and the first

1-‐2 lines of your email are key


Try Pinpointe’s Email Marke9ng Solu9on for FREE. Easily create automated campaign sequences. www.pinpointe.com/get-‐started Select program & enter code PPTWEBNR FREE MONTH of Pinpointe Service (limit 100K emails)

Thank You! We appreciate you taking the Ime to watch this today!

FOLLOW PINPOINTE for markeIng Ips & info CHECK OUT OUR BLOG

for more great markeIng content

h>p://www.pinpointe.com/blog/ @pinpointe

www.facebook.com/Pinpointe

www.linkedin.com/company/pinpointe

how to create amazing mobile emails

Marketing

soasofright now26

mobileoptimization hps