ANATOMY OF THE PERFECT MOBILE EMAIL
As consumers use mobile devices more and more to read email, creating flawless designs that are readable and useful In both desktop and mobile environments can be quite a challenge. Below we have outlined the crucial elements in
creating beautiful and functional designs, as well as the pitfalls that can affect performance.
MOBILE FRIENDLY EMAIL
Content and usability play equally important roles.
In mobile settings, fonts should be set larger than in traditional emails; iOS has a minimum 13px font sire and will automatically adjust anything under that size. To avoid illegible fonts, strive for a body copy minimum of 14px and
headlines of 22px+.
CALL TO ACTION
The most crucial part of any effective email design is a strong and prominent call to action. Put the call to action front and center, and don't be afraid to make the button big: It should be obvious and "tappable," with a minimum size of
Image blocking isn’t a problem limited to desktop email clients. The only mobile OS that does not block images by default is iOS. In other devices, there will be a prompt to a How the user to turn images on. Use images carefully, and
be sure they are balanced by plenty of HTML text.
While newsletters are typically presented in a two- or three-column format, mobile-friendly emails should consider switching to a single-column template. This "skinny' approach accommodates smaller screens and can help increase
As touchscreens become widespread, the finger has replaced the mouse pointer. As a result, bigger has never been better. Increase font sizes, line spacing, button sizes, and white space to give your design breathing room and allow for
KNOW YOUR SCALE
While iOS devices zoom to fit your email to the width of the screen, most other mobile operating systems don't, leaving users to resize the email or scroll left and right to view your message. Consider trimming your emails to between
Remember: Less can be more. Screen real estate on a mobile device is rare and valuable, so consider simplifying complex preheaders, navigation bars, social sharing, and calls to action to keep your design clean and simple.
CUT TO THE CHASE
Evaluate the content in your email, and prune less useful or relevant links, copy, and images. Be short, concise, and to the point making sure the copy you use is direct but still approachable.
Users aren't mind-readers, and because mobile devices don't support hover states, you'll need to find creative ways to visually indicate that links and buttons are clickable. Try outlines, subtle shadows, and other effects.
Mobile users often hold their device in one hand and use their thumb to navigate. Since reaching across the screen can be uncomfortable, keep important buttons, images and other linkables within easy reach.
DISASTROUS MOBILE EMAILS
Here are some of the greatest mobile email pitfalls to avoid.
Although a condensed navigation bar may work on a website or in traditional email, it will most certainly fail on a mobile device. Most navigation bars break, are too small to tap, or simply aren't relevant to the content of the email.
It may seem like it is absolutely necessary to elaborate on the quality of the product your company is trying to sell, but your 10-sentence descriptive paragraph in 9px font size will end up auto-enlarged and out of whack.
Each mobile operating system will have standard Ul elements, such as the tray icons at the bottom of the screen. Placing buttons or other links near these standard icons can cause users to miss them completely or mis-tap the other
mobile email tool bar icons.
Stacking links or call to action buttons on top of each other can cause the user to tap the wrong link, dissuade them from tapping any link, or force them to resize and then tap the link. Avoid frustrating your users by accounting for
these areas of annoyance.
Combine tiny screens with dialed down brightness levels to save battery power, and you're left with poor contrast on many mobile devices. This makes more creative design choices, such as white text on gray backgrounds, less than
Users will view your email in ways you never imagined: in bed. at the gym, in the bathroom, while intoxicated... you get the point Knowing your audience will help you make decisions that account for user context and enhance rather
than detract from their experience.
Before you send your perfectly crafted email, it is important to familiarize yourself with how each mobile OS will handle your message.
HTML SUPPORTED IMAGES ON PREVIEW TEXT SUPPORTED AUTO-SCALE WIDTH FONT SCALING
SOURCES: STYLECAMPAIGN.COM I EMAILIMnKEIINGVOODOO.COM I MAnKEtlNGPROFS.COM I LITMUS.COM