With smartphone and tablets quickly outselling computers, the rush is on to optimize Email Marketing campaigns for all the different screen sizes.
Watch this brief presentation to learn what you can do to help make your Email Marketing look great on smartphone screens.
As always, we welcome your feedback so please get in touch with us via email at info@realemail.ca
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Designing Email for Smartphones
1.
2. Agenda
Who Is Real Email Consulting?
The Right Message at the Right Place
Do Smartphone Numbers Justify the Extra Effort?
9 Tips for Smartphone Email Design.
In Summary
3. Who is Real Email Consulting?
We help clients understand how well their emails perform.
Internal and Industry Benchmarks
Email Program Audit
Program Strategy and Program Development
Real Estate Analysis
Email Score Card
We help clients learn more about their database.
Database Reporting
Identify groups that over/under perform within the larger database
Discover which groups are not responding, and take action to spur interest
4. Who is Real Email Consulting?
We help clients optimize their Email Marketing.
How to Structure Your Email Campaigns
Does the Creative work for all readers of email? Images off?
Subject Line Testing
Creative Testing
Time/Day Testing
Redeployment strategies
We help clients decide what emails to send.
The Importance of the Welcome newsletter
Are there other programs that should be sent?
What do competitors deploy?
Automated campaigns for consideration
7. The Right Message at the Right Place
Smartphones have changed how Email is delivered.
Early innovators in Mobile Email Marketing typically included a link to “View on a
Mobile Device” but those efforts are not effective or practical as more email moves to
smaller screens.
8. Do Smartphone Numbers Justify the Extra Effort?
The short answer is Yes!
Nielsen reports that 31% of US mobile phone owners have a smartphone as of
December 2010, and expect smartphones to become the majority by the end of
2011 .
Figures for 2010 released by Gartner, show that smartphone sales increased 72.1%
from 2009.
Gartner expects US sales of smartphones to become the highest-selling consumer
electronic device category .
Morgan Stanley estimates sales of smartphones will exceed those of PCs in 2012.
Nearly half (45%) of smartphone users check their email “constantly” throughout
the day versus a quarter (28%) of non-smartphone users.
9. View on Mobile
• Most email today includes a “view on mobile” link in the pre-header
of the email that links to a text or an HTML “light” version.
• Typically includes an image of the marketer’s logo and maybe a small
hero image, but minimizes other image elements.
• At a minimum, this is essential for accommodating mobile users.
• The experience is less than exceptional.
10. Get The Skinny
320 px
480 px
• Reduce the overall width of an email; for iPhones, the maximum
width is 320 pixels when held up-right, and most smartphones range
between 320 and 480 pixels.
• To strike a balance between mobile and computer readers of email,
try to build emails that are 640 pixels or less.
• At 640 pixels, a mobile user can zoom out at 25% and get a good feel
for what the email covers.
11. Be Flexible
• Email can be designed to adapt to the width of the
viewers screen.
• This method works best for email layouts that are
simplified both in structure (basic layouts) and in
design (limited graphics).
• By adding the following code, you can set a custom
device width: <meta name = “viewport” content =
“width = 650″>.
• Try to create variable templates; consider the
following variable image code: <IMG
style="width:90%; max-width:550px">.
• If images must be hardcoded, use as small an image
as possible.
12. Be Reasonable
• Text, link and button sizes need to be increased
to accommodate for small screens and fat
fingers.
• In Apple’s Human Interface Guidelines (HIG) a
“View Online” link/button should be “about 44 x
44 points” so touchscreen users can click it.
• The image to the right shows what a typical
finger looks like on a touchscreen. It becomes
difficult to click a “view on mobile” link.
• When a user clicks the “wrong” link, it can
produce frustration.
13. Keep To The Left
• Referencing the iPhone once more, remember
that blocks of text over 320px wide can be
difficult to read, as they force users to pan
back and forth.
• If you click to “Show content” in Hotmail on an
iPhone via the web, only a 320px wide section
is displayed, so left justify the mobile link.
• Out of sight, out of mind. If it’s out of sight on
the first screen, users won’t look for it.
14. Title Goes Here
• Hotmail has taken the lead with mobile
viewing by displaying the coded Title in an
email preview.
• By displaying the HTML title within the preview
text, Hotmail has allowed senders to provide
context of the email independent of the layout
of the email content.
• Using the title allows much more text without
crowding the preheader space.
15. Keep It Short and Simple
• Follow the (slightly modified) KISS rule, and
Keep it Short and Simple.
• Avoid long subject lines, which can push
content further down an already-small mobile
screen.
• If a mobile reader doesn’t understand what a
marketer is trying to communicate in the
shortened subject line, they may not engage
with the content.
16. Just Ask!
• The easiest way to determine the impact of
mobile is to simply ask, or to measure.
• Consider asking about smartphone usage and
email when customers sign-up, and you may
have subscribers that self-identify.
• Measure how many subscribers click on the
“mobile” or “online” versions to see if and how
this metric is trending up.
• You can determine the necessity and the
effectiveness of your mobile modifications.
17. In Summary
Mobile email is taking a larger role in marketing as consumers move their
email habits to smartphones.
With the huge rise in smartphone usage, the increased frequency of checking
of email, and smaller screen sizes, marketers must take new approaches to
ensure their subscribers engage with email.
1. Create a “mobile version” for every email and host online.
2. Reduce the overall width of the email.
3. Use variable sizing code for images and template width.
4. Use as small an image as possible if the image must be hardcoded.
18. In Summary
5. Links to a “mobile version” should be a minimum of 44 pixels X 44 pixels.
6. Left-justify the “mobile version” links.
7. Use the “Title” tag to provide additional email detail.
8. Keep Subject Lines short.
9. Measure how many subscribers request a mobile version, through sign-
up or through clicks on the mobile email link.