By Joyce Sunila
These days the big buzz in e-marketing is mobile design. Tablets and smartphones are flying off the shelves while desktop computer buys are limping off into the shadows. Statistics show a sharp spike in people checking e-mail on their phones. The race is on to find an optimal e-mail design for mobile viewing.
But this is tricky. Each smartphone is different. They all have different screen sizes and rules about what they can and can’t render from your e-mail. Factors include the type of device, the e-mail software program, the service provider, and the operating system that the phone uses.
As if those variables weren’t enough, the most dizzying parameter is posed by the continuing existence of the desktop. Smartphone-enabled e-mail still needs to provide a satisfying experience for desktop readers. Despite trends, desktop viewers can’t be written off yet.
Given the exponential design challenges of the mobile revolution, it will be a while before you can order up a template that serves on all devices. So if you’re a DIY e-marketer, you need to start thinking ahead. Here are five general suggestions for tweaking future e-mails so they don’t become obsolete in 2013.
1) Pixel width.
A good rule of thumb for the tiny screen is to stay between 500 and 600 pixels wide. A few phones, like the Blackberry display at 320 px width. Either width will look silly on desktops, so you’ll need “responsive” html code for your text that expands and shrinks horizontally, matching margins to the receiving device. Place all of your text in responsive code.
A no-brainer: Adjust to narrow screens by switching to a single column if you’re currently using 2-column template.
2) The all-important top of the e-mail.
Eliminate header graphics in the beginning of your e-mail. Mobile readers may see nothing but a bunch of empty boxes with undisplayed links when they open your mail. Even after they hit “Show Pictures,” the load time may discourage them. They could delete your e-mail.
Place your logo or other images below the first few lines of text. Write this text in your best “teaser” prose to lure readers into the body of the e-newsletter or e-blast.
Also, don’t waste valuable top text space on links like forward-to-a-friend or website pages. Move these links to the bottom of the template.
3) Use bigger font.
The 10- and 12-point fonts common to e-newsletters and e-blasts are too small for smartphone reading. Enlarge to 14 points or above. Desktop readers won’t mind bigger text, but smartphone readers will abhor the microscopic messages.
4) Create giant buttons for important links (eg, “Buy Now”).
The mouse and cursor are precision instruments compared to the clumsy finger. If you want your links to get clicks, they can’t be difficult to access or hard to see. Make your links visible and accessible by designing call-to-action buttons that even the clumsiest smartphone user can deploy. Leave big spaces between buttons.
Include a “click-to-call” button. A mobile reader may want to call your office for more information. At work or at home she could check your website, but that’s clumsy if not impossible from a smartphone. Having a click-to-call button available makes it easy to reach out to you directly.
5) Keep your body content concise.
This is a rule of thumb for all e-mail communication, but it gains added relevance on mobile phones. Mobile e-mail readers are likely to skim e-mail for relevant details and make a mental note about whether to check the mail again at their desks. Make sure you have all of your important information up top. Use bullet points to telegraph them.
It may comfort you to know that even the best designers are scratching their heads over this issue – how to design for two vastly different screens in the same e-mail? Don’t be discouraged if you drop a few plates when you start. The field is evolving, and we’ve all got to evolve with it.
Joyce Sunila is the president of Practice Helpers, providing e-newsletters, blogs and social media services to aesthetic practices. You can contact Joyce at email@example.com or visit the Practice Helpers website at www.practicehelpers.com