14 Responsive Email Best Practices [Infographic]

Earlier this week we looked at how mobile is taking over global commerce, and not to be forgotten is mobile-friendly email. This week’s infographic comes from EmailMonks which includes 14 tips for responsive emails.


Click to enlarge infographic

tweet infographic


  • 67% of email was opened on a smartphone or tablet in Q4 2014 Tweet this
  • Mobile email opens have grown 180% over the last 3 years Tweet this
  • Email client support for responsive email has grown 70% in the last 2 years Tweet this
  • 50% of Google searches come directly from mobile devices Tweet this
  • 75% that receive un-optimized emails on mobile devices will just delete it Tweet this

Responsive email tips

1. Design in a single column so that it looks flawless even on clients like Gmail app.

2. Design with finger targets in mind. Keep the width to a minimum of 320 to 550 pixels, especially for small screen optimization.

3. Keep the CTA easily tappable with a minimum size of 44 pixels.

4. Use white-space wherever possible so that readers can skim through the content easily.

5. Keep the header clean. Put the navigation (if any) in the footer. This will let users see the main information in the first scroll.

6. With increasing Apple loyal readership, make sure your mobile email is optimized for retina devices.

7. Don’t crowd links together and if possible keep text links in different rows and convert them to buttons for mobile view.

8. Provide tappable (call to function) phone numbers for mobile letting the users call whenever they need directly from a single tap

9. Limit subject lines to 30 characters or less

10. For the desktop view, use image width of minimum 480 pixels so that when the same is scaled on mobile it doesn’t get blurred.

11. If you’re a beginner, don’t just scale images but swap in your media queries.

12. Restrict the height of your emails, as subscribers like to skim through shorter emails else they skip reading.

13. Keep all the important CTAs above the fold.

14. Test your responsive email design and make sure it’s compatible across the major email clients.

Interested in more responsive design tips? The New Customer Journey: A Convergence of Content, Context, Channels and Commerce, the first in a series discussing experience-driven commerce across touchpoints.


Related Posts