[Editor's Note: Cindy Krum of MobileMoxie.com was too ill to speak during the Nov. 28 "Website and Email Design for a Mobile World" webinar, which is now available on demand and features speaker Greg Hickman, founder of MobileMixed.com. Krum promised, however, to answer attendees' questions when she felt better. Her answers are below.]
Mobile email design is a bit of a misnomer, because there is really no such thing as an email that is only accessed on a mobile device. Mobile email design is simply the process of making our existing emails look better when they are opened on mobile devices.
Email design is already has the potential to be more complex than Web design, because there are so many different email clients that people could be using to access their email. In some cases, people use services like Gmail or Hotmail. And, in others, they are using an enterprise email solution provided by their company or something provided by their ISP.
All of these email hosts can be configured to display email on a mobile phone: in some cases through the native software on the phone, in other cases with a downloadable application for the email software and still in other cases, using Web-based email access on the phone. Whichever way the user is accessing your email could change how it displays—and this is true in both the desktop and mobile worlds.
1. Mobile Subject Line Best Practices
The most important thing to remember about the "subject" line on a mobile phone is that it is not as important as the "from" line on a mobile phone. In most mobile email clients, the "from" line is displayed MUCH more prominently than the "subject" line—bigger, and first. So start segmenting your communication with different "from" lines so that the recipients know what they are looking at right away. If you have a newsletter, a regular marketing email and a "deals" email, that should be conveyed in the "from" line.
The "subject" line is still important, but there are so many different mobile email clients and display settings that that could change; there is no way to accurately predict the number of characters that will be displayed on the phone. The best practice for mobile email is simply to put the most important information first, and don't repeat information that is already given in the "from" line.
Similarly, many mobile email clients will display the first line or so of an email as a preview, so make sure that it adds information that will make users want to open the email rather than delete it. It should be compelling and, again, should not be redundant with either the "from" line or the "subject" line. Consider each of these pieces of information a unique opportunity to cause the recipient to open the email.
2. Mobile Email Design and Coding Best Practices
Once the recipient opens the email, you don't want to disappoint. Designs that work well on both desktop computers and mobile phones are ones that are clean and simple, with a clear call to action. Featuring lot of products and prices may be daunting, especially when compressed on a tiny screen. Similarly, three columns often look too crowded on the mobile phone. It is best to stick to one hero image and call to action, then a few supplementary bits of information or marketing.
Your best chance at making an email render on the highest number of mobile devices without compromising the look of the email when it is on a desktop computer: This type of cross platform compatibility is best achieved with a flexible grid, responsive design—which essentially means that the email will adapt how it displays based on the screen size of the device that it is being displayed on. The difference between using responsive design on the Web and in email is the style sheets (CSS) must be embedded in the body of the email rather than pulled in from an external file.
Even if you do everything right, there is a chance your email will have some difficulty displaying correctly for some mobile users, so be sure to include the obligatory links at the top. If possible, it is best to link to a desktop version of the email and a separate, mobile version of the email. From the mobile link, you can use user-agent detection and redirection to identify what type of phone they are on, and possibly even record that information for future marketing efforts (like promoting device-specific mobile apps). Also, don't forget that these devices are phones, capable of calling. So if you are able to take questions or orders over the phone, make the phone number prominent and clickable in the email. You might even consider including a special tracking phone number, so you can make the correct attributions in your evaluations of the email.