You spend an entire weekend building what you’re convinced is the perfect landing page. On your 27-inch monitor, it looks incredible. Then you pull it up on your phone while waiting for coffee and the headline is tiny, the hero photo is still loading, and the CTA button sits somewhere below the fold.
That’s a landing page size problem. It quietly kills conversions every single day.
I’ve built (and, honestly, broken) dozens of these over the past decade, for my own campaigns and for clients. This is the sizing playbook I wish someone had handed me back then, plus the builders that handle most of it for you.
## Key Takeaways
– **Desktop design width:** 1440px, with a centered **1140-1200px safe zone** for content
– **Mobile design width:** 375px
– **Total page weight:** under 1MB, under 500KB if you’re running cold paid traffic
– **Hero image:** compressed to 100-200KB in WebP
– **Load time:** under 3 seconds on mobile, or roughly half your visitors leave
– **Tools that handle sizing:** Unbounce (best overall), Leadpages (budget pick), Instapage (teams)
## Two Different Things Called “Landing Page Size”
People use the phrase to mean two separate things:
1. **Dimensions**, the pixel width and height of your design
2. **Page weight**, the total file size a visitor’s browser has to download
Wrong dimensions? The layout breaks on half the screens out there. Wrong weight? It loads like it’s 2009. Either way, you’re paying for traffic that doesn’t convert.
## Standard Landing Page Dimensions by Device
### Desktop: Design at 1440px
**1440px** is the industry-standard canvas width. Some designers work at 1920px. I’ve tried both, and 1440px fits the most common screens better.
Here’s the part most people miss: keep text, logos, and CTA buttons inside a centered **1140-1200px safe zone**. A visitor on a 1366px laptop (still one of the most common resolutions) sees roughly that much once browser chrome and the scrollbar take their cut. Anything outside the safe zone risks getting clipped.
### Height: Respect the Fold
No fixed height exists, since pages scroll. But after toolbars grab their share, a typical laptop shows only about **650-700px** of vertical space.
My rule: headline, value proposition, and primary CTA all live above that line. Every scroll you demand costs attention, and attention is the whole game.
### Mobile: Design at 375px
About **60%** of landing page traffic comes from phones. That number alone should set your priorities.
Design mobile-first at **375px**, the iPhone standard. Android screens run 360-412px, so 375 lands in the middle of the range.
Non-negotiables I’ve learned the hard way:
– Tap targets at least 44x44px
– Body text at 16px minimum. Anything smaller and iOS auto-zooms form fields on focus, which drives people up the wall
– Full-width buttons. Small centered ones get missed constantly
– Export hero images at 750px wide (2x) so they stay crisp on retina screens
### Tablet: 768px, But Don’t Overthink It
Portrait tablets sit at 768px. Most modern builders scale for this automatically. Preview once before launch, fix anything that looks off, and move on.
## Landing Page File Size: The Number That Actually Costs Money
Google’s research found that **53%** of mobile visitors abandon a page that takes longer than 3 seconds to load. Separate studies put the conversion cost of a one-second delay at around 7%.
For context: the average web page today weighs over 2MB. Way too heavy for something whose only job is converting.
In my experience, these targets keep pages alive on paid traffic:
– **Total page weight:** under 1MB, ideally under 500KB
– **Hero image:** 100-200KB, WebP format
– **Largest Contentful Paint (LCP):** under 2.5 seconds, Google’s Core Web Vitals line in the sand
– **Fonts:** two typefaces, maximum
### 5 Ways I Trim Page Weight
1. **Convert images to WebP.** It typically cuts file size 25-35% versus JPEG with no visible quality loss. Squoosh.app is free and takes seconds. The catch: it handles one image at a time, so batching twenty screenshots gets tedious.
2. **Lazy-load everything below the fold.** Nobody needs testimonial screenshots downloaded before they’ve scrolled.
3. **Kill unused scripts.** Every chat widget, pixel, and tag adds weight. Audit ruthlessly. I find dead Facebook pixels on client sites constantly.
4. **Host video off-page.** Embed from YouTube or Vimeo instead. A 20MB background video will tank your scores.
5. **Limit fonts to two.** Each family is another download before your headline renders.
## Landing Page Builders That Handle Size for You
You can hand-code a perfectly sized page. I’ve done it, and it’s slow. When I’m shipping campaigns fast, I use builders. The good ones handle responsive sizing and fast hosting automatically.
We recently ran all three of these through hands-on testing for BriskPick. These notes come from real campaigns, not marketing pages.
### 1. Unbounce: Best Overall
I’ve run client campaigns on Unbounce for years. It’s the tool I open first when conversions genuinely matter.
**What I like:**
– True mobile-specific editing. You rearrange elements per device instead of relying on auto-scaling
– Fast CDN delivery. My pages routinely score 90+ on mobile PageSpeed
– Built-in A/B testing and AI copy generation
– AMP landing pages for Google Ads speed requirements
**What I don’t like:** pricing climbs quickly once you add traffic, and the entry plan is tight. The AI copy is hit or miss too, fine for drafts but not for final headlines.
### 2. Leadpages: Budget Pick
If money’s tight, Leadpages gets you most of the way there for a fraction of the cost. Templates are mobile-responsive out of the box, so basic sizing takes care of itself.
The tradeoff is control. You get auto-scaling rather than per-device editing, and fine-tuning how a section reflows on a phone takes more workarounds than it should. A fair number of templates also look dated. To be frank, none of that matters much for a first campaign or a low-budget offer.
### 3. Instapage: Best for Teams
Instapage is built for collaboration. Multiple people can edit the same page in real time, and reusable blocks (Instablocks) keep headers and footers consistent across dozens of campaigns. Loading speeds are excellent thanks to their CDN setup.
Honestly, the price stings if you’re a solo marketer. This one makes sense when several people touch every page, or when an agency manages clients at scale. Otherwise, one of the first two tools will serve you better.
## Quick Pre-Launch Checklist
– Designed at 1440px desktop, 375px mobile
– Content inside the 1140-1200px safe zone
– Headline and CTA above the ~700px fold line
– Total weight under 500KB for paid traffic (1MB otherwise)
– Hero compressed to 100-200KB WebP
– LCP under 2.5 seconds, full load under 3
– Two fonts max
– Tested on an actual mid-range phone, not just a browser emulator
## The Bottom Line
Sizing sounds boring. It’s also one of the few things on a landing page you control completely, once, and it pays off on every visitor afterward. Fix the canvas and cut the weight, then spend your energy on the offer, because no pixel width rescues weak copy.