Start with mobile in mind

Optimizing email campaigns for mobile deserves at least as much attention as desktop – about half of all emails are opened on mobile phones. A staggering 69% of users viewing emails on their mobile devices simply delete emails that don’t look good or don’t show up appropriately on their mobile device. So what do you need to look out for as you’re designing your emails? Basically, design your entire email campaign around the fact that half of your list will be viewing the campaign on mobile. That means right from the start, make design and development decisions that will work across both desktop and mobile. Here are a few things to look out for.

Fonts

A small font looks even smaller on mobile, so it’s typically recommended to use 14 point or bigger. In fact, any font smaller than 14 points will be automatically upscaled by iPhones, which could cause rendering errors in your layout. Also, keep in mind that many fonts don’t render at all across certain email clients. Choosing fonts that will render across all devices will ensure that viewers are seeing your emails exactly as you designed them. You can find a list of email-safe fonts here.

Layouts

Responsive layouts with lots of columns will require more development work (because “collapsing” the viewing space requires figuring out where to put all of those extra columns). Implementing a single column is therefore a mobile email best practice – it’s easier to develop, it renders more consistently, and it’s easier to do QA across a variety of mobile platforms.

You can also develop templates to ensure consistent mobile-readiness. Not only does this save time, it helps readers become familiar with the structure of your outreach. You want them to know where to jump for the important information. People are busy and if they have to “learn” a new email each time, they’re more likely to move on to the next message.

Images

Using images requires care.  Many email clients don’t allow image downloads, for load-time and security reasons. If an image is necessary, there are a few things to keep in mind. First, keep them simple. The bigger the image, the longer the load time and the more likely a user is to skip the email. Also, don’t place critical messages inside an image in case they don’t render. And don’t forget to use image ALT tags, which will provide text in place of an unrendered image.

Having said that, images can be used to enhance your messaging and engage your audience further. For example, using animated GIFs will make your email stand out from the crowd as long as the animation is simple and not overbearing.

Usability

The differences in interaction between desktop and mobile is another important consideration. For example, links stacked on top of one another may be easy to manage with a mouse, but trying to tap the right link when others are stacked right above or below it can be a hassle on mobile. The current best practice for tappable triggers is set at 44×44 pixels according to Apple’s Human Interface Guidelines.

Testing

The mobile market is pretty diverse. While 26% of mobile emails are opened on iOS, the rest of the mobile market is surprisingly diverse – the Android market alone is notoriously fragmented. That means that lots of testing is the most effective way to ensure that your emails are rendering properly. Many Email Service Providers (ESPs) have tools that let you see how your email template will render across various ESP platforms. If you’re looking for a third-party tool that is ESP-agnostic, check out Litmus.

That’s it for now. If you’d like to learn more about designing mobile-friendly email campaigns, get in touch with us. We’d love to help.