Anatomy of a Perfect Mobile Email

[ 46 By

Designing emails that look great no matter where they’re read can be quite the challenge. As more people read email on mobile devices, chances are your recipient might view your email both on a mobile phone as well as on their desktop.

Take the guesswork out of designing your next mobile-friendly email with this infograph. We’ve outlined ten important guidelines to an amazing mobile experience, as well as six things you’ll definitely want to avoid. You’ll also find our mobile compatibility chart at the bottom for easy reference.

Anatomy of a Mobile Email


Preview your email in all of the popular mobile clients (and desktop and webmail, too!) with Litmus to make sure you’re putting your best email foot forward. Sign up for a free 7-day Litmus trial today!

Start testing →

  • Nakata Kazue


  • Neil Berman

    Great image!

    • Justine, Litmus

      Thanks, Neil!

  • Jwallace

    Great infograph – but, somewhat ironically, I can’t read it on screen! Is there a print version?

    • Justine, Litmus

      Sorry about that, I know the type is a little small in the main post. Did you try clicking through on the image and going to this page:

      It’s full-width there, and a bit easier to read. If that doesn’t do the trick, shoot us an email ( and we’ll see if we can send you another version.

  • Melinda Albert


    • Justine, Litmus

      Thanks, Melinda!

  • Andy T

    This is quality! Being so visual, it really helps my brain build an image for using this. I’m thinking I could tweak the top left corner to this kind of view whist still keep the rest of the email desktop tastic!
    Might be a small challenge and would obviously be most helpful on single call to action emails.

    • Justine, Litmus

      Thanks so much, Andy! We’ve had a lot of positive feedback about the graph and we’re thrilled that it’s been useful for so many!

  • Techatlast

    This is a nice information shared in form of image because images speaks louder than the normal contents/ Thanks for sharing this tips

    • Justine, Litmus

      Thanks! We’re very glad you’ve found the graph helpful.

  • Vibrant Drive

    Nice infographics and very useful info.

    • Justine, Litmus

      Thanks so much! Very happy that the infographic is useful! :)

  • SheilaSuarezdeFlores

    Really nice but learned more from the text then the graphic. I would have put the explanations in plain accessible text, except for maybe the compatibility party.

    • Justine, Litmus

      Thanks for the feedback, Sheila! We agree that combining the graphics with live HTML text would have been ideal. Trouble is that an HTML file is much harder to share than a graphic.

  • Hector

    Thank so much!!! Great Job

    • Justine, Litmus

      Thanks, Hector!

  • Jeffrey Friend

    Great info. Another issue that I think should be addressed with email on mobile is full width graphic links. You have to scroll with your finger, and if a full width graphic is a link, you can only open the link, you can’t scroll past the image. I’ve thrown out a lot messages because of that frustration. Am I alone here?

    • Justine, Litmus

      Thanks, Jeffrey! Touchscreens can certainly be tricky, and I’ve also accidentally “clicked” an image after my finger lingered a bit too long while intending to scroll.

  • Justine, Litmus

    Hi Lance! I prefer to use pixels rather than ems. Campaign Monitor has an excellent post on the pros/cons. They also found that using pixels yields a more consistent result:

  • Justine, Litmus

    Thanks for the feedback, Mike! We do realize that the text is a bit small on the main post. We also link to a larger version of the graph on click-through. I hope that version is a bit easier to read!

  • David Oakley

    Very handy resource. I guess you could take these principles and apply them to designing a web app for mobile too.

  • TechGlobeX

    Its really a good info, Thanks for sharing this useful stats.

  • Jack

    Nothing really new to add, but just wanted to say that this was incredibly helpful. Thanks very much!

  • Christopher Telles

    Anatomy of a Perfect Mobile Email. Terrific information on creating friendly emails that can be read easily as mobile emails [INFOGRAPHIC]

  • Pingback: Anatomie de l’e-mail mobile idéal | Bonjour Emailing()

  • Eric | Negocios en Internet

    Excellent points, i totally agree !!

  • Dorian Douma

    How big do you think a message would have to be, I mean in kilobytes, including images… before it starts getting garbled or displaying some images and not others? Would this be a mobile carrier issue?

    I love your presentation, it’s very client-friendly!

    • Justine, Litmus

      Hi Dorian! I think you might be asking about the behavior of some phones to cut off a portion of the email and prompt the user to continue downloading the remaining portion — I’ve seen this happen in both iOS and Windows Phone 7.5. I’m not sure of the root cause as it seems to happen randomly on my own phone.

  • Pingback: What goes into designing the perfect mobile email? - Blog - Campaign Monitor()

  • hloom

    Love the infographics

  • Pingback: Inspiration: Dreamforce | E-mail Marketing Specialisten()

  • Eric Lepetit

    Nice post Justine, as usual!
    Just to answer your question about the email being cut off in iOs, I am pretty sure you now already know the fix but I wanted to share this with everybody:

    • Justine, Litmus

      Hi Eric, thanks for the feedback and link! Campaign Monitor has a more recent post that also found the issue in IMAP configurations on iOS as well — seems like it has more to do with the message size and connection type rather than the number of characters in the tag:

      • Eric Lepetit

        Even better! Awesome. Thanks Justine!

  • Joe Garite II

    This is great to use as an informative piece, which I plan to use to educate our creative department and some clients. You state that Windows Phone 7 is compatible with with mobile emails. However, they don’t support media queries. They also don’t support Auto-scaling. How, then, is Windows Phone 7 a practical target for mobile emails? It’s my understanding that only Windows Phone 7.5 is a practical target for mobile emails. What are your thoughts on this Justine?

  • Pingback: 20 Infographics With Smartphone Facts You Probably Didn’t Know |()

  • Pingback: Infografik: Anatomy of the Perfect Mobile Email | mobile zeitgeist()

  • Pingback: Infographic: Anatomy of the Perfect Mobile Email()

  • Pingback: 6 aspectos clave para un buen diseño en el email marketing - Beltius()

  • Pingback: Infographic: Anatomy of the Perfect Mobile Email |

  • Pingback: メールをスマートデバイス最適化する上で欠かせない5つのポイント | シナジーマーケティング公式ブログ()

  • Pingback: 6 aspectos clave para un buen diseño en email marketing | Beltius()

  • Pingback: 20 Infographics With Smartphone Facts You Probably Didn’t Know()

  • Pingback: 8 Extremely Effective Email Marketing Strategies | Andri on Blog()

  • Pingback: How Great Email Marketing leads to Sales()