What should be above the fold on a SaaS homepage?

Four things in order: what it does in the customer's own words, who it is for, something actually showing the product, and one action. Not three actions -- a signup, a demo booking and a newsletter is a menu, and a menu gets closed.

Should a hero use a screenshot or a demo?

A short interactive demo, if you have one -- a hero-sized screenshot is usually captured on a large monitor and displayed small, with text below the size it resolves at, so it reads as decoration. If you use a screenshot, crop hard to one meaningful part.

How do you test a hero section?

Show it to someone who does not know what you do, for five seconds, then ask what it is and who it is for. If they cannot say, nothing further down the page will fix it.

← Back to blog

What Belongs Above the Fold on a B2B SaaS Site

August 25, 2026

The first screen decides whether anyone sees the second. For a B2B product bought by a busy person, it has one job: let them work out whether this is for them without reading.

Four things do that, and there is a right order.

The four, in order

What it does, in their words. Not "the modern platform for" — the actual job. If your support inbox uses different words from your homepage, the inbox is right.
Who it is for. One clause. Being narrow here loses nobody who was going to buy and saves everyone else the scroll.
Something showing the product. A real screen, not an abstract illustration. This is the single most-skipped item.
One action. Not three. A signup and a "book a demo" and a newsletter is a menu, and a menu gets closed.

What to cut from it

Logo bars of companies nobody recognises, awards, a rotating carousel of value propositions, and any sentence containing "leverage", "seamless" or "unlock". They occupy the space that should carry evidence.

The test is whether a sentence could appear on a competitor's site unchanged. If it could, it is not doing anything.

The product shot is the hard one

A static screenshot at hero size is usually unreadable — captured on a large monitor, displayed small, with text below the size at which it resolves. It reads as decoration.

A short interactive demo works better because the viewer controls the pace and can actually read a step. If you use a screenshot, crop it hard to one meaningful part rather than showing the whole application.

Test it the only way that works

Show the first screen to someone who does not know what you do, for five seconds, then ask them what it is and who it is for. If they cannot say, no amount of scrolling will fix it.

This is uncomfortable and takes ten minutes, and it is worth more than any amount of rewriting on your own.

Frequently asked questions

What should be above the fold on a SaaS homepage?: Four things in order: what it does in the customer's own words, who it is for, something actually showing the product, and one action. Not three actions -- a signup, a demo booking and a newsletter is a menu, and a menu gets closed.
Should a hero use a screenshot or a demo?: A short interactive demo, if you have one -- a hero-sized screenshot is usually captured on a large monitor and displayed small, with text below the size it resolves at, so it reads as decoration. If you use a screenshot, crop hard to one meaningful part.
How do you test a hero section?: Show it to someone who does not know what you do, for five seconds, then ask what it is and who it is for. If they cannot say, nothing further down the page will fix it.

Keep reading

This is what Demorta does

Click through it — the same kind of demo you can record of your own product.

Try it on your own product

Record your first interactive demo free.

Five demos on the free plan, forever. No credit card, no trial countdown, no sales call. Install the Chrome extension, click through your product once, and you have a shareable link in about ten minutes.

Start free →