Above the Fold Checker
Preview how your landing page looks above the fold on different screen sizes. Test desktop, tablet, and mobile viewports to ensure critical elements are visible without scrolling.
Common Viewport Sizes
- 1920 x 1080Full HD
- 1440 x 900MacBook Pro
- 1366 x 768Most common
- 1024 x 768iPad landscape
- 768 x 1024iPad portrait
- 428 x 926iPhone 14 Pro Max
- 390 x 844iPhone 14 Pro
- 375 x 667iPhone SE
Above the Fold Optimization Guide
"Above the fold" refers to the portion of your webpage that's visible without scrolling. This term comes from newspapers, where the most important stories appeared above the physical fold. On the web, it's the content visitors see immediately when your page loads.
Why Above the Fold Matters
First impressions: Visitors form opinions about your site in 50 milliseconds. What they see first determines whether they stay or bounce.
Conversion impact: CTAs placed above the fold can convert 20-30% better than those requiring scroll.
Quality Score: Google evaluates landing page experience partly based on how quickly users find what they need.
Mobile priority: With smaller screens, above-fold real estate is even more precious on mobile devices.
Critical Elements Above the Fold
1. Clear headline: Your value proposition should be immediately visible and understood within 5 seconds.
2. Primary CTA: The action you want visitors to take should be visible without scrolling.
3. Supporting visual: A relevant hero image or video that reinforces your message.
4. Trust indicator: At least one trust signal (logos, testimonial, badge) to build immediate credibility.
Common Above the Fold Mistakes
- Giant hero images: Oversized images that push content below the fold.
- Vague headlines: Clever but unclear headlines that don't communicate value.
- Hidden CTAs: Buttons that blend in or are placed below the initial viewport.
- Too much content: Cramming everything above fold creates visual clutter.
- Ignoring mobile: Testing only on desktop when 50%+ traffic is mobile.
Screen Size Distribution
| Device Type | Common Sizes | Traffic Share |
|---|---|---|
| Desktop | 1366x768, 1920x1080, 1440x900 | ~45% |
| Mobile | 375x667, 390x844, 428x926 | ~50% |
| Tablet | 768x1024, 1024x768 | ~5% |
Testing Recommendations
Test all major breakpoints: Check desktop (1366+), tablet (768-1024), and mobile (320-428) viewports.
Use real devices: Browser dev tools are helpful, but test on actual phones and tablets when possible.
Check analytics: Review your site's actual device/screen distribution to prioritize testing.
Consider browser chrome: Remember that browser toolbars reduce visible height, especially on mobile.
Mobile-First Considerations
Thumb zone: On mobile, CTAs in the lower portion of the screen are easier to tap with thumbs.
Viewport height: Mobile browsers have varying chrome heights that affect the fold line.
Touch targets: Buttons should be at least 44x44 pixels for easy tapping.
Sticky CTAs: Consider sticky headers or footers to keep CTAs always visible.
Need Help Optimizing Your Landing Pages?
Our team designs and optimizes high-converting landing pages for PPC campaigns. We handle responsive design, A/B testing, and continuous optimization.
Book Your Strategy Call