Above the fold: what to put on your landing page's first screen
"Above the fold" is whatever a visitor sees before they scroll. Visitors do scroll, so it isn't the only part that matters. But it decides whether they bother to scroll: in the first few seconds they work out what this is, whether it's for them, and what to do next. If the first screen doesn't answer those three questions, the rest of the page rarely gets read.
The 6 elements of a first screen that converts
1. A headline that states the outcome
Say what the visitor gets, in their words, in 4–12 words. "Close your books in 2 days" works; "The future of finance operations" doesn't. Test drafts with the free headline analyzer, or borrow a structure from these headline examples.
2. A subheadline that says what it is and who it's for
One or two sentences: the product category, the audience, and how it works. "Accounting software for Shopify stores that reconciles payouts automatically." The headline sells; the subheadline explains.
3. One primary call to action
A single, high-contrast button whose text names the result ("Start my free audit", "Get my first report"), not the mechanics ("Submit"). A secondary link ("See how it works") is fine; three equal buttons aren't. See 60 CTA button examples.
4. Friction reducers next to the button
Short notes that answer the objection at the moment of the click: "No credit card", "Free for 14 days", "Takes 60 seconds", "Cancel anytime". Only write the ones that are true.
5. A visual that shows the product
A screenshot, a short loop of the product in use, or an example of the output. Stock photos of people pointing at laptops tell the visitor nothing. If the product is hard to show, show the result (the report, the dashboard, the finished thing).
6. One piece of credible proof
A real customer logo row, a specific number ("2,300 stores"), or one short real quote with a name. Early-stage with no customers yet? Skip fake proof; show the product instead and add proof as soon as you have it.
What to leave out of the first screen
- Carousels and sliders. Visitors see the first slide at most. Pick your best message and commit to it.
- Pop-ups on arrival. A newsletter modal before the visitor has read a word blocks the one thing you need them to see.
- Long navigation menus. Every link is an exit. On a landing page, keep the nav to a few items or remove it.
- Feature lists. Features belong below the fold, after the visitor knows why they should care.
- Heavy hero video that delays rendering. A slow first paint costs more than a pretty background earns.
Above the fold on mobile
On a phone, the first screen is roughly 390×700 pixels, and once the browser bar and a cookie banner take their share, much less. Check these on a real phone, not a resized desktop window:
- The headline is visible without scrolling and isn't wrapped onto five lines. Shorter headlines win here.
- The primary button is on the first screen, or at least sticky, and it's at least 44px tall.
- The cookie banner doesn't cover the headline or the button.
- Body text is at least 16px, so the visitor doesn't have to zoom.
- The hero image doesn't push everything else below the fold. On mobile it often should come after the text.
Common above-the-fold mistakes
| Mistake | Fix |
|---|---|
| Headline is a slogan ("Work, reimagined") | State the outcome and the audience |
| The button says "Learn more" | Name the next step: "Start free trial", "Get my report" |
| Hero image is a stock photo | Show the product or its output |
| Two or three competing buttons | One primary CTA, one quiet secondary link |
| Price or "free" only mentioned at the bottom | Put the friction reducer right under the button |
| The first screen looks fine on desktop and broken on mobile | Design the mobile first screen on purpose |
10-point above-the-fold checklist
- A stranger can say what you sell after 5 seconds.
- The headline states an outcome, not a category.
- The subheadline names who it's for.
- There's exactly one primary button.
- The button text names the result.
- A true friction reducer sits next to the button.
- The visual shows the product or its output.
- There's at least one piece of real proof, or none (never fake).
- Nothing pops up before the visitor has read the headline.
- All of the above also holds on a phone.
The rest of the page matters too: see the full 30-point landing page checklist and 17 landing page mistakes.
Free score plus your top 3 issues, with desktop and mobile screenshots. The full report is $19 if you want all of it.