10 Email Design Best Practices for a Mobile World

Standard email best practices were developed to optimize email for desktop users viewing through Web browsers or email clients. However, email is increasingly being read on mobile devices. According to Return Path, mobile email open rates increased 34 percent in the second half of 2011, while webmail and desktop opens declined. Which best practices still apply to designing email for a mobile world?

In fact, most email best-practice advice leads to designing emails that are scaled down and cleaner. Based on experience, a clean and simple design is one of the best solutions to overcoming spam filters for acquisition email marketing. The bonus is that it renders nicely on a mobile device too. Here are the 10 top email best practices when designing for mobile devices:

1. Aim for 450 too 500 pixel width if you want one template for both desktop and mobile users. Conventional emails are set to a fixed width between 550 and 600 pixels, which is ideal for average desktop computers. However, mobile screens are much smaller; the most common mobile email readers are in a range of 320 pixels.

iPhones allow for a 300-pixel width when held vertically and a 480-pixel width in landscape format. iPhones also resize emails to fit the screen, but many other smart phones don’t, so it makes sense to design for the lowest common denominator. The benefit is not only that you ensure the recipient sees as much of your email as possible, but also that it limits the aggravation of scrolling side to side when viewing on a mobile device.

2. Using images and alt tags: Image to text ratio is another factor to contend with when dealing with spam filters, so a 60/40 text to image ratio should be maintained for best results. Image file sizes need to be considered because a mobile device will not load images as fast as a desktop or laptop. Not to mention, they eat up those valuable limited data plans. Try to keep the size of each image at 20k or less. The overall file size of the email should not exceed 50k to 70k. Do not use Flash or gif animations, they won’t work and just add to the overall file size of the email.

Related Content
  • Justine Jordan

    "The use of darker-colored background tables will be removed by many email readers"

    I’ve been coding emails for 5+ years, and frequently use dark tables. Background IMAGES have mixed support, but background colors are well-supported by all email clients as long as HTML and HEX values are used.

  • Thorg Jorgenstorom

    .gif animations do in fact work on both desktop and mobile platforms.

  • ryanlowe123

    Thanks Christina,
    For providing a well-written and well-organized guide to the secrets of a successful email campaign that will capture the subscriber’s attention.

    Here are some other articles and guides that points out other unique techniques and proven methods that will guarantee to attract and keep new subscribers.

    Mobile Email Market Statistics – Don’t Ignore Mobile [Infographic]

    Mobile + Email Marketing Automation = Better Results

    Email Marketing Trend: Integrate Mobile and Social