SlideShare a Scribd company logo
1 of 34
OPTIMIZING
EMAIL + MOBILE
Who am I?
                      • 5+ years in email
                        marketing
                      • Design & production
                      • A “left-brained” creative
                      • I’m a marketer, too!



Justine Jordan Marketing Director, Litmus
@meladorri + @litmusapp
Let’s talk about…
• What’s happening with email + mobile
• How each mobile OS handles email
• How to create usable and beautiful
 experiences in both mobile & desktop
 environments
KNOW YOUR
AUDIENCE
[Because knowledge is power!]
from




       to
Consider context
People check email…
  • In bed
  • At the gym
  • In the bathroom
  • While intoxicated
  • At their desk
  • To kill time
Knowing Your Audience
• 15% of opens are
  on a mobile device                                         Mobile
                                                              15%
• 2-20% on individual
  campaigns
• 30%+ for niche
                                                                      Desktop
  audiences                                            Webmail         53%
                                                        32%




http://litmus.com/blog/email-client-market-share-infograph
Mobile Opens by Platform
                                                             Other
                                                              1%
Majority of mobile opens
in Android, iOS (iPad +
iPhone)                                                      iPad
                                                             19%



                                                      Android        iPhone
                                                       17%            63%




http://litmus.com/blog/email-client-market-share-infograph
WHAT SHOULD
I DO ABOUT IT?
[My emails could use some optimization
help!]
Doing nothing is OK.
Not optimizing for mobile may be a valid
strategy when it doesn’t make sense for
your audience, brand, or business.

For instance:
  • Your mobile audience is very small
  • Resources aren’t available to implement
  • Quicker wins exist
The “aware” approach
Being mobile aware involves email designs that
consider the mobile experience but aren’t
specially constructed for it.

• Single column primary content
• Big images
• Big text
• Big buttons
• Skinny layout
One column primary content, and easy to press buttons. Visual style works
well on mobile without special setup.
Responsive email design
Using CSS3 @media queries to detect screen
size, displaying specific content or elements in
different types of viewing environments.

• Detects large vs. small screen size
• Rolls back to standard version when @media isn’t
  supported
• Hide or remove content on small screens
• Not for the faint of heart: CSS ninja skills required
Simple layout, selectively removing content & spacing adjustments create a
@media query case study.
The finger is the new mouse




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




Buttons can be traditional text buttons or image-based touch targets that link
back to content.
               Text Buttons                   Image “Buttons”
Bigger fonts are better
Beware minimum font sizes; automatic resizing

• Font sizes at 600px scaled to 320px are roughly
  50% smaller!
• Body copy < 13px will be resized
• Recommended minimums
  • Body copy: 14px
  • Headlines: 22px
• CSS fix: “-webkit-text-size-adjust: none;”
Bigger fonts are better




Too-small navigation will be negatively affected by text scaling on iPhone
and iPad.
Streamline
Single column layout; simplified content

• Short, direct copy: “Twitterize”
• Eliminate or hide low priority content
  • Links
  • Copy
  • Images
• Clear and direct calls to action
  • Make it obvious
Got apps?




When sending email regarding mobile apps, consider that users may be
reading email on mobile, too.
                     DO                          DON’T
Consider “mobile first”




Simple copy + big headlines = an email that is mobile aware will also be
more usable in a desktop environment
Consider “mobile first”




Featured products also serve as large, tappable buttons in a mobile
environment.
THINGS
TO SKIP
[AKA what NOT to do]
Lots of links create friction




Don’t give users a reason NOT to click by making text or other calls-to-
action impossible to tap.
The “mobile” version




Don’t waste clicks on a less-than-optimal text version when a mobile
          email
optimized website exists.       mobile version               web site
Mobile versioning
You can’t predict where users will open!

                         Distinctions between
                         environments –
               Android   mobile and desktop
    iPhone
    Version
               Version   – drive behavior
                         more than
                         distinctions between
                         email clients.

 Focus on viewing environment rather than
 specific devices or email clients.
First impressions still count




• What is recognizable, trustworthy and relevant?
• Does the subscriber have a relationship with a
  person, or the brand?
• Use language they are familiar with
SUPPORT FOR
MOBILE EMAIL
[How do mobile devices affect display?]
Display and support challenges
There are no mobile email standards!
OS                     Preview        HTML*       Images*       Alt text      Scale        Enlarge
                         text                                                               fonts
Android 2.3               ✗                                        --           ✗
Android Gmail             ✗                         ✗                           ✗
iOS 5                                                              --
                                                                                                ‡
Symbian                   ✗                         ✗             ✗             ✗
                                                                                                ‡
Windows Phone 7                                     ✗             ✗             ✗
                                                                                                ‡
Blackberry 6              ✗                         ✗                           ✗

*HTML or images enabled by default
‡ inconsistent wrapping and scaling of text
 Blackberry HTML email is not on by default in 4.5/5. The ability to download images automatically is
an option. Blackberry 6 has webkit support and displays HTML email by default, but a prompt
appears to download external images
Display and support challenges




Plan for an “images off” environment in most mobile operating systems. on
       Android alt text          Symbian images off      Symbian images
Android supports alt text.
Display and support challenges




Windows Mobile 7 blocks images, butimages off
       WinMo Preview          WinMo
                                    offers preview text and many on
                                                      WinMo images
opportunities to download images.
Blackberry 6 supports HTML email well, but doesn’t zoom or display images
by default.
Resources
litmus.com/blog
stylecampaign.com/blog
campaignmonitor.com/blog
Thanks!
           Justine Jordan
           Marketing Director, Litmus
           @meladorri + @litmusapp




  Presentation available at www.slideshare.net/litmusapp

More Related Content

What's hot

Developing for Mobility
Developing for MobilityDeveloping for Mobility
Developing for MobilityScotty Logan
 
Information Architecture in Mobile
Information Architecture in MobileInformation Architecture in Mobile
Information Architecture in MobileLazar Petrakiev
 
The Mobile Platform World
The Mobile Platform WorldThe Mobile Platform World
The Mobile Platform WorldMatt Evans
 
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...Paul Brown
 
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...affilinet
 
All The Screens: Cross Platform Design Strategies
All The Screens: Cross Platform Design StrategiesAll The Screens: Cross Platform Design Strategies
All The Screens: Cross Platform Design StrategiesTheresa Neil
 
Johnson stephanie mobile_presentation
Johnson stephanie mobile_presentationJohnson stephanie mobile_presentation
Johnson stephanie mobile_presentationStephanie Johnson
 
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...Why the iPad UI matters, And how it differs from the Tablet PC, but also from...
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...Fabien Marry
 
Dreamforce - mobility in the enterprise
Dreamforce  - mobility in the enterpriseDreamforce  - mobility in the enterprise
Dreamforce - mobility in the enterpriseDoug Maloney
 
Dnx Mobile Marketing Golden Rules
Dnx Mobile Marketing Golden RulesDnx Mobile Marketing Golden Rules
Dnx Mobile Marketing Golden RulesAdam Troman
 
Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)BraveNewCode Inc.
 
Learning interactions on mobile slideshare
Learning interactions on mobile   slideshareLearning interactions on mobile   slideshare
Learning interactions on mobile slideshareRaptivity
 
Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...auexpo Conference
 
Making a More Powerful Point
Making a More Powerful PointMaking a More Powerful Point
Making a More Powerful PointBrooke Novak
 
Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)
Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)
Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)Mirko Lorenz
 
Road to mobile w/ Sinatra, jQuery Mobile, Spine.js and Mustache
Road to mobile w/ Sinatra, jQuery Mobile, Spine.js and MustacheRoad to mobile w/ Sinatra, jQuery Mobile, Spine.js and Mustache
Road to mobile w/ Sinatra, jQuery Mobile, Spine.js and MustacheBrian Sam-Bodden
 
Mobile First by Sparks Grove
Mobile First by Sparks GroveMobile First by Sparks Grove
Mobile First by Sparks GroveBrooke Novak
 
Building mobile website with Joomla - Joomla!Days NL 2010 #jd10nl
Building mobile website with Joomla -  Joomla!Days NL 2010 #jd10nlBuilding mobile website with Joomla -  Joomla!Days NL 2010 #jd10nl
Building mobile website with Joomla - Joomla!Days NL 2010 #jd10nlJoomla!Days Netherlands
 
A research on i pad device & experience design
A research on i pad   device & experience designA research on i pad   device & experience design
A research on i pad device & experience designVinny Wu
 

What's hot (20)

Developing for Mobility
Developing for MobilityDeveloping for Mobility
Developing for Mobility
 
Information Architecture in Mobile
Information Architecture in MobileInformation Architecture in Mobile
Information Architecture in Mobile
 
The Mobile Platform World
The Mobile Platform WorldThe Mobile Platform World
The Mobile Platform World
 
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
 
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking Gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
 
All The Screens: Cross Platform Design Strategies
All The Screens: Cross Platform Design StrategiesAll The Screens: Cross Platform Design Strategies
All The Screens: Cross Platform Design Strategies
 
Johnson stephanie mobile_presentation
Johnson stephanie mobile_presentationJohnson stephanie mobile_presentation
Johnson stephanie mobile_presentation
 
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...Why the iPad UI matters, And how it differs from the Tablet PC, but also from...
Why the iPad UI matters, And how it differs from the Tablet PC, but also from...
 
Dreamforce - mobility in the enterprise
Dreamforce  - mobility in the enterpriseDreamforce  - mobility in the enterprise
Dreamforce - mobility in the enterprise
 
Dnx Mobile Marketing Golden Rules
Dnx Mobile Marketing Golden RulesDnx Mobile Marketing Golden Rules
Dnx Mobile Marketing Golden Rules
 
Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)
 
Learning interactions on mobile slideshare
Learning interactions on mobile   slideshareLearning interactions on mobile   slideshare
Learning interactions on mobile slideshare
 
Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
Striking gold! How Mobile Marketing Pioneers are Winning the Hearts & Minds o...
 
Making a More Powerful Point
Making a More Powerful PointMaking a More Powerful Point
Making a More Powerful Point
 
Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)
Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)
Open Data in the Newsroom: What's the story? (Talk from OK Con 2011 in Berlin)
 
Road to mobile w/ Sinatra, jQuery Mobile, Spine.js and Mustache
Road to mobile w/ Sinatra, jQuery Mobile, Spine.js and MustacheRoad to mobile w/ Sinatra, jQuery Mobile, Spine.js and Mustache
Road to mobile w/ Sinatra, jQuery Mobile, Spine.js and Mustache
 
Mobile First by Sparks Grove
Mobile First by Sparks GroveMobile First by Sparks Grove
Mobile First by Sparks Grove
 
Building mobile website with Joomla - Joomla!Days NL 2010 #jd10nl
Building mobile website with Joomla -  Joomla!Days NL 2010 #jd10nlBuilding mobile website with Joomla -  Joomla!Days NL 2010 #jd10nl
Building mobile website with Joomla - Joomla!Days NL 2010 #jd10nl
 
Mobile first. Luke Wroblewski
Mobile first. Luke WroblewskiMobile first. Luke Wroblewski
Mobile first. Luke Wroblewski
 
A research on i pad device & experience design
A research on i pad   device & experience designA research on i pad   device & experience design
A research on i pad device & experience design
 

Viewers also liked

Mobile Web & Social Media
Mobile Web & Social MediaMobile Web & Social Media
Mobile Web & Social MediaMartin Ringlein
 
Mobile & UX - In the Eye of the Perfect Storm
Mobile & UX - In the Eye of the Perfect StormMobile & UX - In the Eye of the Perfect Storm
Mobile & UX - In the Eye of the Perfect StormJared Spool
 
Email + Mobile Webinar
Email + Mobile WebinarEmail + Mobile Webinar
Email + Mobile WebinarLitmus
 
Uncle Sam Wants You (To Optimize Your Content For Mobile)
Uncle Sam Wants You (To Optimize Your Content For Mobile)Uncle Sam Wants You (To Optimize Your Content For Mobile)
Uncle Sam Wants You (To Optimize Your Content For Mobile)Karen McGrane
 
Grid Systems
Grid SystemsGrid Systems
Grid SystemsBas Leurs
 

Viewers also liked (7)

Mobile Web & Social Media
Mobile Web & Social MediaMobile Web & Social Media
Mobile Web & Social Media
 
Getting Shit Done
Getting Shit DoneGetting Shit Done
Getting Shit Done
 
Designing Design Teams
Designing Design TeamsDesigning Design Teams
Designing Design Teams
 
Mobile & UX - In the Eye of the Perfect Storm
Mobile & UX - In the Eye of the Perfect StormMobile & UX - In the Eye of the Perfect Storm
Mobile & UX - In the Eye of the Perfect Storm
 
Email + Mobile Webinar
Email + Mobile WebinarEmail + Mobile Webinar
Email + Mobile Webinar
 
Uncle Sam Wants You (To Optimize Your Content For Mobile)
Uncle Sam Wants You (To Optimize Your Content For Mobile)Uncle Sam Wants You (To Optimize Your Content For Mobile)
Uncle Sam Wants You (To Optimize Your Content For Mobile)
 
Grid Systems
Grid SystemsGrid Systems
Grid Systems
 

Similar to Social Fresh: Optimizing Email for Mobile Audiences

The Mobile Experience Through Email
The Mobile Experience Through EmailThe Mobile Experience Through Email
The Mobile Experience Through EmailDemac Media
 
Strategies, Tactics and Design Tips for Mobile Email Success
Strategies, Tactics and Design Tips for Mobile Email SuccessStrategies, Tactics and Design Tips for Mobile Email Success
Strategies, Tactics and Design Tips for Mobile Email SuccessLitmus
 
Mobile email: strategies and how-tos for the small screen
Mobile email: strategies and how-tos for the small screenMobile email: strategies and how-tos for the small screen
Mobile email: strategies and how-tos for the small screenLitmus
 
3sixty Live Boston: Designing for the Mobile Inbox
3sixty Live Boston: Designing for the Mobile Inbox3sixty Live Boston: Designing for the Mobile Inbox
3sixty Live Boston: Designing for the Mobile InboxLitmus
 
Introduction to iPhone App Development - midVentures DESIGN+DEVELOP
Introduction to iPhone App Development - midVentures DESIGN+DEVELOPIntroduction to iPhone App Development - midVentures DESIGN+DEVELOP
Introduction to iPhone App Development - midVentures DESIGN+DEVELOPKeyLimeTie
 
Fundamentals of Mobile-Friendly Emails
Fundamentals of Mobile-Friendly EmailsFundamentals of Mobile-Friendly Emails
Fundamentals of Mobile-Friendly EmailsLitmus
 
Email for Mobile Devices | Stream:20 Best Practice
Email for Mobile Devices | Stream:20 Best PracticeEmail for Mobile Devices | Stream:20 Best Practice
Email for Mobile Devices | Stream:20 Best PracticeStream20consultants
 
(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All Devices(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All DevicesLitmus
 
Understanding the Complex Mobile Landscape
Understanding the Complex Mobile Landscape Understanding the Complex Mobile Landscape
Understanding the Complex Mobile Landscape R2integrated
 
Secrets to Email Creative Success in a ‘Mocialized’ World
Secrets to Email Creative Success in a ‘Mocialized’ WorldSecrets to Email Creative Success in a ‘Mocialized’ World
Secrets to Email Creative Success in a ‘Mocialized’ WorldEngauge
 
Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...
Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...
Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...Greg Hickman
 
Mobile Blast - Mobile strategy for developers
Mobile Blast - Mobile strategy for developersMobile Blast - Mobile strategy for developers
Mobile Blast - Mobile strategy for developersJohn Jardin
 
The mobile traveler experience
The mobile traveler experienceThe mobile traveler experience
The mobile traveler experienceKevin May
 
Making the most of mobile in B2B
Making the most of mobile in B2BMaking the most of mobile in B2B
Making the most of mobile in B2BOgilvy
 
Emerge 2012: Keys to Email Creative Success
Emerge 2012: Keys to Email Creative SuccessEmerge 2012: Keys to Email Creative Success
Emerge 2012: Keys to Email Creative SuccessAlex Williams
 
Mobile Web vs. Native apps
Mobile Web vs. Native appsMobile Web vs. Native apps
Mobile Web vs. Native appsSoDA Speaks
 
Email Design for All Devices
Email Design for All DevicesEmail Design for All Devices
Email Design for All DevicesSilverpop
 
Beyond the Desktop: Sites and Apps for Phones and Tablets
Beyond the Desktop: Sites and Apps for Phones and TabletsBeyond the Desktop: Sites and Apps for Phones and Tablets
Beyond the Desktop: Sites and Apps for Phones and TabletsWebvanta
 

Similar to Social Fresh: Optimizing Email for Mobile Audiences (20)

Justine Jordan
Justine JordanJustine Jordan
Justine Jordan
 
The Mobile Experience Through Email
The Mobile Experience Through EmailThe Mobile Experience Through Email
The Mobile Experience Through Email
 
Strategies, Tactics and Design Tips for Mobile Email Success
Strategies, Tactics and Design Tips for Mobile Email SuccessStrategies, Tactics and Design Tips for Mobile Email Success
Strategies, Tactics and Design Tips for Mobile Email Success
 
Mobile email: strategies and how-tos for the small screen
Mobile email: strategies and how-tos for the small screenMobile email: strategies and how-tos for the small screen
Mobile email: strategies and how-tos for the small screen
 
3sixty Live Boston: Designing for the Mobile Inbox
3sixty Live Boston: Designing for the Mobile Inbox3sixty Live Boston: Designing for the Mobile Inbox
3sixty Live Boston: Designing for the Mobile Inbox
 
Introduction to iPhone App Development - midVentures DESIGN+DEVELOP
Introduction to iPhone App Development - midVentures DESIGN+DEVELOPIntroduction to iPhone App Development - midVentures DESIGN+DEVELOP
Introduction to iPhone App Development - midVentures DESIGN+DEVELOP
 
Fundamentals of Mobile-Friendly Emails
Fundamentals of Mobile-Friendly EmailsFundamentals of Mobile-Friendly Emails
Fundamentals of Mobile-Friendly Emails
 
Email for Mobile Devices | Stream:20 Best Practice
Email for Mobile Devices | Stream:20 Best PracticeEmail for Mobile Devices | Stream:20 Best Practice
Email for Mobile Devices | Stream:20 Best Practice
 
(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All Devices(UK Version) Email Design Approaches That Work for All Devices
(UK Version) Email Design Approaches That Work for All Devices
 
Responsive email design guide
Responsive email design guideResponsive email design guide
Responsive email design guide
 
Understanding the Complex Mobile Landscape
Understanding the Complex Mobile Landscape Understanding the Complex Mobile Landscape
Understanding the Complex Mobile Landscape
 
Secrets to Email Creative Success in a ‘Mocialized’ World
Secrets to Email Creative Success in a ‘Mocialized’ WorldSecrets to Email Creative Success in a ‘Mocialized’ World
Secrets to Email Creative Success in a ‘Mocialized’ World
 
Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...
Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...
Target Marketing Magazine Webinar - Keys To Success On The Mobile Web and How...
 
Mobile Blast - Mobile strategy for developers
Mobile Blast - Mobile strategy for developersMobile Blast - Mobile strategy for developers
Mobile Blast - Mobile strategy for developers
 
The mobile traveler experience
The mobile traveler experienceThe mobile traveler experience
The mobile traveler experience
 
Making the most of mobile in B2B
Making the most of mobile in B2BMaking the most of mobile in B2B
Making the most of mobile in B2B
 
Emerge 2012: Keys to Email Creative Success
Emerge 2012: Keys to Email Creative SuccessEmerge 2012: Keys to Email Creative Success
Emerge 2012: Keys to Email Creative Success
 
Mobile Web vs. Native apps
Mobile Web vs. Native appsMobile Web vs. Native apps
Mobile Web vs. Native apps
 
Email Design for All Devices
Email Design for All DevicesEmail Design for All Devices
Email Design for All Devices
 
Beyond the Desktop: Sites and Apps for Phones and Tablets
Beyond the Desktop: Sites and Apps for Phones and TabletsBeyond the Desktop: Sites and Apps for Phones and Tablets
Beyond the Desktop: Sites and Apps for Phones and Tablets
 

More from Litmus

Litmus Live 2018 Workshop: Reinvent Your Email Workflow
Litmus Live 2018 Workshop: Reinvent Your Email WorkflowLitmus Live 2018 Workshop: Reinvent Your Email Workflow
Litmus Live 2018 Workshop: Reinvent Your Email WorkflowLitmus
 
The Trends Transforming the Email Service Provider Landscape
The Trends Transforming the Email Service Provider LandscapeThe Trends Transforming the Email Service Provider Landscape
The Trends Transforming the Email Service Provider LandscapeLitmus
 
Engaging Users with High-Performance Design
Engaging Users with High-Performance DesignEngaging Users with High-Performance Design
Engaging Users with High-Performance DesignLitmus
 
Litmus Live 2018: Reinvent Your Email Workflow
Litmus Live 2018: Reinvent Your Email WorkflowLitmus Live 2018: Reinvent Your Email Workflow
Litmus Live 2018: Reinvent Your Email WorkflowLitmus
 
Email Workflows that Work: 5 Trends to Help You Build Better Emails Faster
Email Workflows that Work: 5 Trends to Help You Build Better Emails FasterEmail Workflows that Work: 5 Trends to Help You Build Better Emails Faster
Email Workflows that Work: 5 Trends to Help You Build Better Emails FasterLitmus
 
The State of Email in 2018: 5 Insights from the Litmus Marketing Team
The State of Email in 2018: 5 Insights from the Litmus Marketing TeamThe State of Email in 2018: 5 Insights from the Litmus Marketing Team
The State of Email in 2018: 5 Insights from the Litmus Marketing TeamLitmus
 
The Best of the 2017 State of Email Survey Research Series
The Best of the 2017 State of Email Survey Research SeriesThe Best of the 2017 State of Email Survey Research Series
The Best of the 2017 State of Email Survey Research SeriesLitmus
 
5 Embarrassing Subject Line Mistakes to Avoid
5 Embarrassing Subject Line Mistakes to Avoid5 Embarrassing Subject Line Mistakes to Avoid
5 Embarrassing Subject Line Mistakes to AvoidLitmus
 
Email Tactics Customers Hate and Why Marketers Continue to Use Them
Email Tactics Customers Hate and Why Marketers Continue to Use ThemEmail Tactics Customers Hate and Why Marketers Continue to Use Them
Email Tactics Customers Hate and Why Marketers Continue to Use ThemLitmus
 
Email Marketing Kickoff for 2018
Email Marketing Kickoff for 2018Email Marketing Kickoff for 2018
Email Marketing Kickoff for 2018Litmus
 
The Top 5 Opportunities for Improving Your Email Creative
The Top 5 Opportunities for Improving Your Email CreativeThe Top 5 Opportunities for Improving Your Email Creative
The Top 5 Opportunities for Improving Your Email CreativeLitmus
 
20 Things Successful Email Marketing Programs Do
20 Things Successful Email Marketing Programs Do20 Things Successful Email Marketing Programs Do
20 Things Successful Email Marketing Programs DoLitmus
 
The Root of Poor Email Deliverability
The Root of Poor Email DeliverabilityThe Root of Poor Email Deliverability
The Root of Poor Email DeliverabilityLitmus
 
Troubleshooting Email Like a Pro
Troubleshooting Email Like a ProTroubleshooting Email Like a Pro
Troubleshooting Email Like a ProLitmus
 
Troubleshooting Email Like a Pro
Troubleshooting Email Like a ProTroubleshooting Email Like a Pro
Troubleshooting Email Like a ProLitmus
 
8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making Them
8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making Them8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making Them
8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making ThemLitmus
 
Troubleshooting Email Like a Pro
Troubleshooting Email Like a ProTroubleshooting Email Like a Pro
Troubleshooting Email Like a ProLitmus
 
Building Successful Email Workflows
Building Successful Email WorkflowsBuilding Successful Email Workflows
Building Successful Email WorkflowsLitmus
 
Webinar: State of Email 2017
Webinar: State of Email 2017Webinar: State of Email 2017
Webinar: State of Email 2017Litmus
 
Everything You Need to Know About Gmail Rendering
Everything You Need to Know About Gmail RenderingEverything You Need to Know About Gmail Rendering
Everything You Need to Know About Gmail RenderingLitmus
 

More from Litmus (20)

Litmus Live 2018 Workshop: Reinvent Your Email Workflow
Litmus Live 2018 Workshop: Reinvent Your Email WorkflowLitmus Live 2018 Workshop: Reinvent Your Email Workflow
Litmus Live 2018 Workshop: Reinvent Your Email Workflow
 
The Trends Transforming the Email Service Provider Landscape
The Trends Transforming the Email Service Provider LandscapeThe Trends Transforming the Email Service Provider Landscape
The Trends Transforming the Email Service Provider Landscape
 
Engaging Users with High-Performance Design
Engaging Users with High-Performance DesignEngaging Users with High-Performance Design
Engaging Users with High-Performance Design
 
Litmus Live 2018: Reinvent Your Email Workflow
Litmus Live 2018: Reinvent Your Email WorkflowLitmus Live 2018: Reinvent Your Email Workflow
Litmus Live 2018: Reinvent Your Email Workflow
 
Email Workflows that Work: 5 Trends to Help You Build Better Emails Faster
Email Workflows that Work: 5 Trends to Help You Build Better Emails FasterEmail Workflows that Work: 5 Trends to Help You Build Better Emails Faster
Email Workflows that Work: 5 Trends to Help You Build Better Emails Faster
 
The State of Email in 2018: 5 Insights from the Litmus Marketing Team
The State of Email in 2018: 5 Insights from the Litmus Marketing TeamThe State of Email in 2018: 5 Insights from the Litmus Marketing Team
The State of Email in 2018: 5 Insights from the Litmus Marketing Team
 
The Best of the 2017 State of Email Survey Research Series
The Best of the 2017 State of Email Survey Research SeriesThe Best of the 2017 State of Email Survey Research Series
The Best of the 2017 State of Email Survey Research Series
 
5 Embarrassing Subject Line Mistakes to Avoid
5 Embarrassing Subject Line Mistakes to Avoid5 Embarrassing Subject Line Mistakes to Avoid
5 Embarrassing Subject Line Mistakes to Avoid
 
Email Tactics Customers Hate and Why Marketers Continue to Use Them
Email Tactics Customers Hate and Why Marketers Continue to Use ThemEmail Tactics Customers Hate and Why Marketers Continue to Use Them
Email Tactics Customers Hate and Why Marketers Continue to Use Them
 
Email Marketing Kickoff for 2018
Email Marketing Kickoff for 2018Email Marketing Kickoff for 2018
Email Marketing Kickoff for 2018
 
The Top 5 Opportunities for Improving Your Email Creative
The Top 5 Opportunities for Improving Your Email CreativeThe Top 5 Opportunities for Improving Your Email Creative
The Top 5 Opportunities for Improving Your Email Creative
 
20 Things Successful Email Marketing Programs Do
20 Things Successful Email Marketing Programs Do20 Things Successful Email Marketing Programs Do
20 Things Successful Email Marketing Programs Do
 
The Root of Poor Email Deliverability
The Root of Poor Email DeliverabilityThe Root of Poor Email Deliverability
The Root of Poor Email Deliverability
 
Troubleshooting Email Like a Pro
Troubleshooting Email Like a ProTroubleshooting Email Like a Pro
Troubleshooting Email Like a Pro
 
Troubleshooting Email Like a Pro
Troubleshooting Email Like a ProTroubleshooting Email Like a Pro
Troubleshooting Email Like a Pro
 
8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making Them
8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making Them8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making Them
8 Embarrassing Preview Text Mistakes + 4 Tips on How to Avoid Making Them
 
Troubleshooting Email Like a Pro
Troubleshooting Email Like a ProTroubleshooting Email Like a Pro
Troubleshooting Email Like a Pro
 
Building Successful Email Workflows
Building Successful Email WorkflowsBuilding Successful Email Workflows
Building Successful Email Workflows
 
Webinar: State of Email 2017
Webinar: State of Email 2017Webinar: State of Email 2017
Webinar: State of Email 2017
 
Everything You Need to Know About Gmail Rendering
Everything You Need to Know About Gmail RenderingEverything You Need to Know About Gmail Rendering
Everything You Need to Know About Gmail Rendering
 

Recently uploaded

How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 

Recently uploaded (19)

How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 

Social Fresh: Optimizing Email for Mobile Audiences

  • 2. Who am I? • 5+ years in email marketing • Design & production • A “left-brained” creative • I’m a marketer, too! Justine Jordan Marketing Director, Litmus @meladorri + @litmusapp
  • 3. Let’s talk about… • What’s happening with email + mobile • How each mobile OS handles email • How to create usable and beautiful experiences in both mobile & desktop environments
  • 5. from to
  • 6. Consider context People check email… • In bed • At the gym • In the bathroom • While intoxicated • At their desk • To kill time
  • 7. Knowing Your Audience • 15% of opens are on a mobile device Mobile 15% • 2-20% on individual campaigns • 30%+ for niche Desktop audiences Webmail 53% 32% http://litmus.com/blog/email-client-market-share-infograph
  • 8. Mobile Opens by Platform Other 1% Majority of mobile opens in Android, iOS (iPad + iPhone) iPad 19% Android iPhone 17% 63% http://litmus.com/blog/email-client-market-share-infograph
  • 9. WHAT SHOULD I DO ABOUT IT? [My emails could use some optimization help!]
  • 10. Doing nothing is OK. Not optimizing for mobile may be a valid strategy when it doesn’t make sense for your audience, brand, or business. For instance: • Your mobile audience is very small • Resources aren’t available to implement • Quicker wins exist
  • 11. The “aware” approach Being mobile aware involves email designs that consider the mobile experience but aren’t specially constructed for it. • Single column primary content • Big images • Big text • Big buttons • Skinny layout
  • 12. One column primary content, and easy to press buttons. Visual style works well on mobile without special setup.
  • 13. Responsive email design Using CSS3 @media queries to detect screen size, displaying specific content or elements in different types of viewing environments. • Detects large vs. small screen size • Rolls back to standard version when @media isn’t supported • Hide or remove content on small screens • Not for the faint of heart: CSS ninja skills required
  • 14. Simple layout, selectively removing content & spacing adjustments create a @media query case study.
  • 15. The finger is the new mouse Design for tappable touch targets; not text links 44 x 44px minimum
  • 16. Create touch targets Buttons can be traditional text buttons or image-based touch targets that link back to content. Text Buttons Image “Buttons”
  • 17. Bigger fonts are better Beware minimum font sizes; automatic resizing • Font sizes at 600px scaled to 320px are roughly 50% smaller! • Body copy < 13px will be resized • Recommended minimums • Body copy: 14px • Headlines: 22px • CSS fix: “-webkit-text-size-adjust: none;”
  • 18. Bigger fonts are better Too-small navigation will be negatively affected by text scaling on iPhone and iPad.
  • 19. Streamline Single column layout; simplified content • Short, direct copy: “Twitterize” • Eliminate or hide low priority content • Links • Copy • Images • Clear and direct calls to action • Make it obvious
  • 20. Got apps? When sending email regarding mobile apps, consider that users may be reading email on mobile, too. DO DON’T
  • 21. Consider “mobile first” Simple copy + big headlines = an email that is mobile aware will also be more usable in a desktop environment
  • 22. Consider “mobile first” Featured products also serve as large, tappable buttons in a mobile environment.
  • 24. Lots of links create friction Don’t give users a reason NOT to click by making text or other calls-to- action impossible to tap.
  • 25. The “mobile” version Don’t waste clicks on a less-than-optimal text version when a mobile email optimized website exists. mobile version web site
  • 26. Mobile versioning You can’t predict where users will open! Distinctions between environments – Android mobile and desktop iPhone Version Version – drive behavior more than distinctions between email clients. Focus on viewing environment rather than specific devices or email clients.
  • 27. First impressions still count • What is recognizable, trustworthy and relevant? • Does the subscriber have a relationship with a person, or the brand? • Use language they are familiar with
  • 28. SUPPORT FOR MOBILE EMAIL [How do mobile devices affect display?]
  • 29. Display and support challenges There are no mobile email standards! OS Preview HTML* Images* Alt text Scale Enlarge text fonts Android 2.3 ✗ -- ✗ Android Gmail ✗ ✗ ✗ iOS 5 -- ‡ Symbian ✗ ✗ ✗ ✗ ‡ Windows Phone 7 ✗ ✗ ✗ ‡ Blackberry 6 ✗ ✗ ✗ *HTML or images enabled by default ‡ inconsistent wrapping and scaling of text Blackberry HTML email is not on by default in 4.5/5. The ability to download images automatically is an option. Blackberry 6 has webkit support and displays HTML email by default, but a prompt appears to download external images
  • 30. Display and support challenges Plan for an “images off” environment in most mobile operating systems. on Android alt text Symbian images off Symbian images Android supports alt text.
  • 31. Display and support challenges Windows Mobile 7 blocks images, butimages off WinMo Preview WinMo offers preview text and many on WinMo images opportunities to download images.
  • 32. Blackberry 6 supports HTML email well, but doesn’t zoom or display images by default.
  • 34. Thanks! Justine Jordan Marketing Director, Litmus @meladorri + @litmusapp Presentation available at www.slideshare.net/litmusapp

Editor's Notes

  1. JJ
  2. JJ + CS
  3. JJ
  4. JJ
  5. JJ
  6. Appropriate b/c audience is technical and they expect it
  7. Add desktop examples &amp; iPhone chrome
  8. Add desktop examples
  9. When is each situation appropriate?
  10. What is OW? RT? BR Store Event? Who is Brian and what is ROMI?
  11. Snapshot of the challenges and diversity of devicesNokia Remote Device Access is a great way to experience Symbian first hand.
  12. Snapshot of the challenges and diversity of devicesNokia Remote Device Access is a great way to experience Symbian first hand.
  13. Snapshot of the challenges and diversity of devicesNokia Remote Device Access is a great way to experience Symbian first hand.
  14. New blackberry shots from deviceanywhere?