Roast My Site
Back to Blog
UX & Design
Apr 7, 20264 min read

The Mobile-First Checklist Every Website Needs

EP
Enzo P.
Founder, Roast My Site

62% of all web traffic is mobile. Yet most websites are still designed on desktop monitors and "made responsive" as an afterthought. Here's the definitive checklist for a mobile experience that converts.

Typography

Minimum 16px base font size (below this, iOS auto-zooms, breaking your layout)
Line height 1.5-1.7 for body text (cramped lines are unreadable on small screens)
Headlines no larger than 2.5rem on mobile (prevent horizontal overflow)
Sufficient contrast — WCAG AA minimum (outdoor lighting is brutal)

Buttons & Tap Targets

Minimum 44x44px tap target size (Apple's HIG recommendation)
At least 8px spacing between adjacent tap targets
Primary CTA visible without scrolling on mobile viewport
No hover-only states (there's no hover on touch)

Forms

Correct input types (type="email", type="tel", type="number") to trigger appropriate keyboards
Autocomplete attributes on name and email fields
Form submit button visible when keyboard is open
Labels above inputs, not placeholder-only (placeholders disappear when typing)

Navigation

Hamburger menu or bottom navigation bar (max 5 items)
Logo links back to home (users expect this)
Search accessible from main nav
No dropdown menus that require hover

Performance

Images optimized and served in WebP format
Core Web Vitals: LCP under 2.5s on mobile network
No render-blocking scripts
Fonts subset to only characters used

Layout

Single column layout on viewport widths below 768px
No horizontal overflow (test by setting viewport to 320px)
Sticky header doesn't consume more than 10% of viewport height
No fixed-width containers exceeding viewport width

Testing Protocol

Don't just resize your browser. Test on a real device — or at minimum, use Chrome DevTools device emulation with a throttled connection. Test with your non-dominant thumb. If you can complete your primary conversion action (signup, purchase, contact) one-handed, you pass.

If you want a quick automated check of your mobile experience, run your URL through Roast My Site — mobile experience is one of the 7 scored dimensions.

Share

Enjoyed this article?

Get more brutal website advice every week.

Related Articles