{"id":76084,"date":"2023-11-03T13:57:00","date_gmt":"2023-11-03T13:57:00","guid":{"rendered":"https:\/\/morningtrain.dk\/?p=76084"},"modified":"2026-11-03T13:57:28","modified_gmt":"2026-11-03T13:57:28","slug":"above-the-fold","status":"publish","type":"post","link":"https:\/\/morningtrain.dk\/en\/above-the-fold\/","title":{"rendered":"Above the fold: what should your visitors see before they scroll? How to check your first screen"},"content":{"rendered":"
\n
\n
\n

Lead generation<\/p>\n

\n 3. November 2023 ·<\/span> 7 min <\/p>\n

Above the fold: what should your visitors see before they scroll? How to check your first screen<\/h1>\n <\/div>\n

Above the fold is the part of a web page you can see without scrolling. The fold is not in the same place on mobile and desktop. See what moves it, and how to check and prioritise your own first screen. <\/p><\/div>

\"Above<\/figure>\n <\/div>\n<\/section>\n\n
\n
\n

\n Indhold\n <\/p>\n \n Why does the first screen matter, and what is it confused with?\n <\/a>\n \n What decides where the fold sits on your page?\n <\/a>\n \n How do you check and prioritise your own first screen?\n <\/a>\n \n What else do people ask about above the fold?\n <\/a>\n <\/div>\n

\n \n\n
\n

Above the fold<\/h3>\n\n\n\n

Above the fold is the part of a web page a visitor can see on their own screen without scrolling.<\/p>\n\n\n\n

Also called:<\/strong> Above-the-fold content, ATF<\/p>\n<\/div><\/div><\/div>\n\n\n\n

The term comes from newspapers. The most important headlines and images were placed above the physical fold on the front page, so they could be seen while the paper lay folded on the newsstand. On a web page, the fold is not a fixed line. It sits wherever the visitor\u2019s screen ends.<\/p>\n\n\n\n

Why does the first screen matter, and what is it confused with?<\/h2>\n\n\n\n

The first screen is the only part every visitor sees. It decides whether they understand what the page offers, and whether they keep scrolling or leave. That does not mean everything important has to be squeezed in at the top.<\/p>\n\n\n\n

Visitors are happy to scroll when they know what they are looking for and can see they have come to the right place. So the job above the fold is narrow: say what the page offers, and give one clear way forward. The rest can sit further down.<\/p>\n\n\n\n

Three misconceptions come up again and again:<\/p>\n\n\n\n

Misconception<\/th>What is actually true<\/th><\/tr><\/thead>
Everything important must be above the fold<\/td>Only the message and one call-to-action button belong there. If you squeeze everything in, it gets harder to see what the page is about.<\/td><\/tr>
The fold is a fixed line<\/td>The fold moves with screen size, browser, cookie banner and header height. It sits in one place on your computer and somewhere else on a customer\u2019s phone.<\/td><\/tr>
Visitors don\u2019t scroll<\/td>Visitors scroll if the first screen gives them a reason to. The problem is rarely scrolling. It is a top section that says nothing.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n

The exception: on a long article or a landing page with a single task, the fold matters less than on the homepage. The visitor has come to read or to do one thing, and expects to scroll.<\/p>\n\n\n\n

What decides where the fold sits on your page?<\/h2>\n\n\n\n

The fold sits where the visitor\u2019s screen ends, minus everything the browser and the page itself place at the top. Screen size, browser bars, cookie banners and pop-ups, header height and image size together push the content down.<\/p>\n\n\n\n

Take the homepage of a small plumbing company. On desktop, the visitor sees a large image, the slogan and the phone number. On a phone, the browser\u2019s address bar and the cookie banner fill the top, and the image takes the rest. The phone number and the Book a plumber<\/strong> button sit below the fold.<\/p>\n\n\n\n