Tablet adoption rates have already outpaced smartphones! And they are growing even more quickly in the U.S. market. Now more than ever, it's important to ensure that your messages are clear and adaptable to multiple screens. I've compiled ten tips to help you optimize for tablet viewing. You'll find the first five below and stay tuned for Part 2 next month!
Follow the K.I.S.S. principle
Keep it simple, stupid! The key to an email that performs well when viewed on a tablet is making sure the user experience is easy and seamless. Think of a standard message that you would design for a desktop – now remove 80-90% of the clutter. That was easy, wasn’t it?
Work to convert
In the same vein as above, make sure that you are concise but also very compelling! Conversion on tablets is typically lower than on desktops and some of that may be attributed to a variety of factors, including but not limited to a poor user experience on mobile devices versus the full desktop version, as well as users getting comfortable with the security of purchasing via mobile. One of the biggest things that you can do to improve conversion is to really focus on your landing pages. Use the email to get their attention with a brief description of what they need to know, then send them to a compelling landing page that seals the deal! Keep in mind the same tablet-friendly email principles for your landing pages when it comes to design, and make the purchase process as easy as possible – think one-click order buttons and forms with very few fields. Above all, ensure that you have a clear CTA (call-to-action) that makes it extremely easy for the subscriber to discern what you want them to do.
Smaller is better… in this instance
Loading an email riddled with weighty images can leave the user hanging when they’re subjected to less-than-lightning-fast WiFi connections. If it takes too long, you run the risk that they’ll get fed up and just delete your message. So aim for a message that’s as lightweight as possible. Making sure your message is no larger than 70 kb total will ensure a speedier load time. As a rule of thumb, make your images fall in a range between 15 kb – 20 kb each. Then consider the text-to-image ratio. A general best practice around this is sticking to 60% text and 40% images – adhering to this, as well as the size limits outlined above, should help you stay within that 70 kb weight limit.
Forget traditional layouts
When viewing an email on a tablet, three and even two-column layouts can be inconvenient or even irritating. A single-column, “ladder” approach will allow your email to function well across all devices. Consider how narrow these devices are compared to a traditional desktop. The iPad, for example, is 760 px wide in portrait mode and 1020 px wide in landscape. Therefore, you should aim to keep your messages between 550 px – 600 px wide. This will scale nicely and reduce the amount of “crunch” you experience when viewing on a smaller screen.
Pad your pixels
A finger needs more room to click than a mouse pointer. Make sure it’s easy for your subscriber to click instead of an irritation. This means that you should put padding around all of your links, text as well as buttons. This is commonly referred to as pixel padding. For every clickable region in your message, leave 10 px padding on all sides. This makes it less likely that a subscriber will accidentally click the wrong link. Also keep in mind the padding that you should have around the entire message. On a desktop screen, it’s free-floating but for a tablet, your fingers gripping the screen may eclipse outlying areas, so build in a padded border of about 30 px. Also consider the size of your buttons. They need to be large enough that they are comfortable to click via touch. 45 px wide is usually a good dimension for a button link on an iPad.
Here's this month's example of an email I received that was pretty smooth when viewed on a tablet: The spacing is generous and the layout is clean and simple to use within the limited space. this also demonstrates how important it is to be concise with the subject line and preheader text, as you can see that it pushes content below the fold.
Have you tried any of these ideas so far? Is optimizing for viewing on tablets a priority for your team in 2013? Let us know by commenting below! And be sure to check back next month for Part 2, with five more tips to get your messages optimized.
Anna Pfeiffer
Marketing Strateigst at Bronto