Above the fold

A management consulting firm's hero shows: 'Revenue leaks cost you millions. We find them.' Subheadline: 'Average client recovers $500K in first 90 days.' Image shows a dashboard with metrics. This above-the-fold section clearly states the problem, the outcome, and proof. Visitors immediately understand who this is for.

Lead with your value proposition

Don't assume visitors know what you do. Your headline should answer the most important question: 'What does this company do and why should I care?' Avoid jargon. Generic statements like 'We help companies grow' waste above-the-fold space. Specific statements like 'Help your sales team close 20% more deals using AI-powered insights' convert better.

Use visual hierarchy strategically

Readers scan pages top to bottom. Draw attention to the most important elements: headline, subheadline, primary CTA. Use whitespace, size, and colour to guide the eye. Cluttered above-the-fold design encourages scrolling away, not scrolling down.

Place your primary CTA above the fold

Don't hide your conversion goal. Your main call-to-action (book a demo, start free trial, download guide) should be visible without scrolling. Many websites place buttons only at the bottom of the page, forcing users to consume all content before they can act. Instead, make it visible early for those already convinced.

Optimise for mobile first

Test your page on a 375px wide mobile viewport (standard smartphone). Does your headline fit? Is your CTA button clickable? Can users understand your offer? If not, your mobile above-the-fold experience is broken.

"Above the fold" is the part of a webpage someone sees the instant it loads, before they touch the scroll wheel. The phrase comes from print newspapers: the big stories went on the top half of the page, above the physical fold, because that's all you saw on the newsstand. The web borrowed the idea wholesale.

There's no fixed pixel line. A wide desktop monitor shows far more than a phone, and browser chrome eats into it. So don't obsess over a magic number. The real question is simpler: can a first-time visitor work out what you do and why they should care within about two seconds, without scrolling? If not, your above-the-fold space is being wasted.

That space is your only guaranteed impression. People decide whether to stay or bounce almost instantly, so this is where your value proposition, your strongest proof, and your main call-to-action belong. Certifications, long case studies, and detailed explanations can wait until you've earned the scroll. On mobile the stakes are higher still, because the visible area is so much smaller, so lead with one clear headline and a tappable button.

The practical trap is that you can't eyeball this. You think your headline and CTA are visible; on a real 375px phone, half of it is below the fold. So measure it.

Examples

Say you're building a landing page for a new offer in Unbounce. The temptation is to stack a logo, a vague headline ("Software that scales with you"), and a hero image, then put the "Book a demo" button way down the page. Instead, pull the button up so it sits above the fold next to a specific headline and one line of proof. The whole reason to use a builder like this is that you can move blocks around and A/B test which above-the-fold arrangement actually converts, rather than guessing.

Say you've launched a page and want to know whether anyone is even reaching your CTA. Drop Microsoft Clarity on it and look at the scroll-depth heatmap. If most visitors never scroll past the hero, then everything you buried below the fold, your pricing, your testimonials, your form, is invisible to them. That tells you to move the important stuff up, not to write more of it.

Say you're running a mobile-heavy traffic source and conversions are flat. Record real sessions with Hotjar and watch what a phone visitor actually sees on load. You'll often catch the headline wrapping onto four lines and pushing the button clean off-screen, the kind of thing that never shows up on your big desktop monitor but quietly kills your mobile conversion rate.

A fintech company tested their desktop hero on mobile and found it showed only a logo and first three words of their headline. They restructured to: single-line headline, icon-based features visible immediately, and a full-width CTA button. Scroll depth increased 35%, suggesting more users engaged because above-the-fold clarity encouraged them to explore further.

First impressions determine bounce rate

Users typically spend under two seconds on a page before deciding to continue or leave. Your above-the-fold content is the only real estate you have to stop the bounce. A confusing headline, generic value proposition, or poor visual design above the fold sends people away before they see what you actually do.

Affects mobile conversion rates

Mobile devices show 40-50% less content than desktop. On mobile, above the fold is even more critical because users have to scroll further to see context. A mobile visitor might see only your logo and a confusing headline before scrolling. This is why mobile-first design prioritises clarity and immediate relevance.

Influences content strategy

Understanding above the fold shapes what content you prioritise. Industry certifications, case study results, and complex value propositions belong below the fold (after you've earned the scroll). Emotional hooks, clear differentiation, and a reason to care belong above the fold.

A project management tool's homepage headline is: 'Reduce project delays by 40% with automated task scheduling.' Subheadline: 'Used by 2,000+ tech teams.' Immediately visible is the benefit (delay reduction), the specific mechanism (automation), and social proof. The CTA 'Start free 14-day trial' is visible without scrolling. First-time visitors understand the offer in seconds.