Email Designs That Click: 9 CTR Principles Every Ecommerce Brand Should Steal

73% of ecommerce email opens happen on mobile. Your primary CTA must be visible inside the first 600 vertical pixels — that is roughly the iPhone 14 viewport with the keyboard hidden. Anything below that competes with thumbs and attention spans that are already gone.

If your hero image is 600x400 with a 100px logo and a 60px headline above it, your button has already lost the fight before the email loads.

We A/B tested 1-CTA versus 3-CTA versions of the same email across 80 stores. The 1-CTA versions earned 32% more clicks on average — even when the 3-CTA versions had identical primary buttons.

Three CTAs feel like three decisions. One CTA feels like one obvious action. If you must offer secondary options, make them quiet plain-text links — never buttons.

• Minimum 44px tall — Apple's tap-target guideline, and the line below which mobile CTR drops sharply
• Full-width on mobile, max 320px wide on desktop
• Solid background (never gradient — they break in dark mode)
• Contrast ratio of at least 4.5:1 against the background
• Bulletproof button HTML — render correctly even with images off

Pick one hero image, one headline, one supporting paragraph, one button. Stack everything else below the fold. The eye should travel: image → headline → button, in under two seconds.

Every additional element you add above the fold steals 4–7% of CTR from the primary button. That is the cost of "just one more" badge.

Button copy

Lead with a verb. Name the outcome. Skip "click here" and "learn more" — they tell the reader nothing about what happens next.

• "Shop the restock"
• "Finish checking out"
• "See the new colors"
• "Claim your free sample"

Headline copy

Specific beats clever. Tell people what they will get if they click — not how you feel about your product.

Gmail clips messages over ~102KB and hides everything below the fold behind a "[Message clipped] View entire message" link. Your unsubscribe footer gets cut. Your tracking pixel may not fire. CTR craters.

Aim for under 90KB of HTML (images do not count toward the limit). Milgo measures every email before send and one-click compresses if you're close to the line.

• Test in Apple Mail dark mode and Outlook dark mode — they invert colors differently
• Logos: use transparent PNGs with a soft glow or a forced background color
• Buttons: solid colors only; gradients invert to mud
• Body text: avoid pure black (#000) — it disappears against dark backgrounds in some clients

Accessibility isn't only about screen readers — every accessibility fix is also a CTR fix because it improves how legible your email is for tired thumbs in low light.

• Body text ≥14px (16px preferred)
• Line height 1.4–1.6
• Alt text on every image (Gmail blocks images by default for new senders)
• Plain-text version, always

1. 01Primary CTA visible above the 600px fold
2. 02Only one dominant CTA in the email
3. 03Button ≥44px tall, ≥4.5:1 contrast
4. 04Hero image under 200KB, with alt text
5. 05Total HTML under 90KB
6. 06Renders in Apple Mail dark mode
7. 07Plain-text version included
8. 08Personalisation tokens have a fallback
9. 09All links use UTMs

Milgo runs every one of these checks automatically and shows a single "ready to send" score before you copy the HTML to your ESP.