What is above the fold?

Above the fold is whatever a visitor sees on a web page before they scroll. Everything below that line is “below the fold”.

The phrase comes from print. Newspapers were folded in half on the stand, so the stories on the top half had to sell the paper. Websites borrowed the idea for the first screen of a page.

Why above the fold matters for conversion

The first screen is where visitors decide whether to stay. If it doesn’t tell them what you do and who it’s for, many leave before they scroll.

It’s also where your call to action gets its first chance. Buyers who already know they want a demo should be able to find the button without reading the whole page.

The fold doesn’t stop people scrolling. It decides whether they want to.

What to put above the fold on a SaaS page

On most pages the hero section fills this space. Aim to fit:

A headline that says what the product does for the reader
A short subhead that adds who it’s for or how it works
One primary call to action
A real product visual
Some form of proof, like a logo bar, if there’s room

Navigation sits here too, so keep it light. A crowded header eats space the headline needs.

Above the fold on desktop vs mobile

The fold moves with the screen. Here’s how it tends to differ:

	Desktop	Mobile
Shape	Wide and short	Narrow and tall
What usually fits	Headline, subhead, CTA and a product visual side by side	Headline, subhead and CTA, with the visual pushed below
Common risk	Big empty space or a tall image pushing the CTA down	Long headlines wrapping onto five or six lines
Fix	Keep the hero height sensible and the CTA high	Shorter headlines and stacked content, CTA early in the order

Design for the screen sizes your analytics show, not just the one on your desk.

Above the fold vs hero section

These get mixed up. Above the fold is a measurement of what’s on screen. The hero section is a block you design.

On a large monitor the hero might sit fully above the fold with the next section peeking in. On a phone the fold often cuts the hero in half. That’s fine, as long as the headline and CTA come first.

Common above the fold mistakes

Cramming everything in. Trying to fit every feature on the first screen makes it harder to read, not more persuasive.
A huge image with no message. A full screen photo or video with a tiny headline makes visitors guess.
Slow loading content. The first screen usually holds the Largest Contentful Paint element, one of the Core Web Vitals. Heavy images and videos here slow everything down.
Cookie banners and popups covering it. If a banner hides the headline, the fold is wasted. Keep overlays small.
Designing only for one screen. Check the page on a small laptop and a phone, not just a large display.

Scroll maps from a heatmap tool show how far people actually get. Use them to check whether your key content sits where visitors look.

Questions about above the fold

How many pixels is above the fold?

There is no single number. It depends on the visitor's screen size, browser window and zoom level, so a laptop, a large monitor and a phone all have a different fold. Check your analytics for the most common screen sizes and design for those.

Do people scroll below the fold?

Yes. Most visitors scroll if the top of the page gives them a reason to. The fold matters because it decides whether they bother, not because nothing below it gets seen.

Should the CTA be above the fold?

On most SaaS pages, yes. Visitors who are ready to act should not have to hunt for the button. You can repeat the call to action further down for people who need more convincing first.