Blog

Email design that survives real inboxes

·5 min read

Email rendering is roughly two decades behind the web. Outlook on Windows still uses Microsoft Word as its rendering engine. Gmail strips out parts of your stylesheet. Dark mode is applied inconsistently and often without asking. Designing for email means designing for the worst client your list uses, not the best one.

Keep the layout simple

A single column is the safest structure and, on phones, usually the best-looking one too. Multi-column rows work, but every column you add is another thing that can stack unexpectedly. If you use two columns, check the stacked mobile order still makes sense — an image above its caption reads fine, a caption above a missing image does not.

Assume images are blocked

Many clients block remote images until the reader opts in, and some readers never do. If your entire message is one big image, those people see nothing at all. Write alt text on every image, and make sure the email still communicates its point with all images turned off. A good test: disable images in your own client and re-read your draft.

One message, one action

A single obvious call to action outperforms several competing ones. If you find yourself adding a third button, that is usually a sign the email is really two emails. Make the button label describe the destination — "See the March report" tells the reader more than "Click here", and it is better for screen readers too.

Respect the fold, but do not obsess

People do scroll. What matters more is that the first screenful establishes who the message is from and why it is worth reading. A large logo eating the entire preview area works against you; a clear headline works for you.

Type and contrast

  • Body text at 14–16px. Smaller looks refined on your monitor and unreadable on a phone in daylight.
  • Stick to widely available fonts. Custom web fonts silently fall back in most email clients, so design assuming the fallback.
  • Keep strong contrast between text and background — and check how it looks inverted, because some clients force dark mode on you.
  • Generous line height, around 1.5 to 1.6, makes long paragraphs far easier to get through.

Always send yourself a test

No preview, including the one in this editor, is a substitute for the real thing. Send a test to yourself and open it on a phone and a desktop client before the real send. This is the single habit that catches the most problems.

Make unsubscribing easy

A working, obvious unsubscribe link is legally required for commercial email in most jurisdictions, and it is also just good practice. Hiding it does not keep subscribers — it converts them into people who mark you as spam, which damages your deliverability for everyone else on your list.