Mailbites · Issue 13
You're designing for a screen nobody uses
Most of your list opens on a phone. Most of your emails are built on a desktop. See the problem?
Anil Kumar
Founder & Principal Advisor
In today's Mailbites, we talk about mobile, the screen where most of your email is actually read, and the quiet mismatch between how emails are built and how they're seen.
Now, onto today's story.
The Story
Here's a small disconnect that costs brands real money. Your customers read your email on a phone. The majority of opens, for most stores, happen on a small screen held in one hand, scanned in a few seconds, often on the move. But the email was designed on a wide monitor, in a builder that shows a generous desktop preview, by someone giving it their full attention. The designer and the reader are looking at two completely different things.
What looks balanced and elegant at desktop width can fall apart on a phone. The three-column layout stacks into a confusing jumble. The clever side-by-side of image and text collapses. The text that was a comfortable size becomes tiny, or the line length becomes a single word per line. And the button, the one thing you wanted them to tap, ends up small, crowded, or pushed below a wall of preamble they'll never scroll past.
Designing mobile-first flips the priority. Instead of building for the big screen and hoping it survives the shrink, you build for the small screen and let it expand gracefully on desktop. In practice that means a few habits:
- One column. A single, simple column stacks predictably everywhere. Multi-column layouts are where most mobile breakage lives.
- Big enough to read and tap. Generous text, and a button large enough for a thumb, with space around it so it's not a game of precision tapping.
- The point, up top. Assume they'll see the first screen and maybe scroll once. Put the message and the main action where a quick glance will catch them, not buried beneath a tall header and a hero image.
- Short. A wall of text that looks fine on a monitor feels endless on a phone. Tighten it.
And then the simplest discipline of all: check it on an actual phone before you send. Not the desktop preview, not the builder's little mobile toggle, a real device in your real hand, the way your customer will hold it. You'll spot the cramped button and the broken column in two seconds, the same two seconds your customer would have spent before closing it.
Build for the screen that's actually in their hand, and the desktop version takes care of itself.
Until next week,
Ani