Websites · Glossary

What does above the fold mean?

Above the fold means the part of a web page that is visible without scrolling when the page first loads. The term comes from newspapers, where the top half above the fold had the headline. On websites the fold moves with each screen size, but the first screen still decides whether visitors stay and scroll.

People do scroll, but they decide whether to scroll from what they see first. That is why the first screen carries more weight than any other.

· Co-founder

3 min read · Published

Where the fold is

There is no single fold. On a phone it might be 650 pixels down, on a laptop 700, on a large monitor much more. Design for the first screen of a typical phone first, since that is where most small business visitors arrive, then check it on desktop.

What belongs above the fold

What you do and for whom, in one heading; a line that adds the key detail such as location or the offer; the main action as a button; and a visual that shows the real thing. Visitors should understand the page and know their next step without scrolling.

What does not need to be there

Everything. Research on scrolling shows people read further down when the first screen gives them a reason. Cramming services, reviews and a form into the first screen makes it unreadable. Use it to earn the scroll, then let the page continue.

Common mistakes

A full screen photo with no words, a slider that rotates messages faster than anyone can read, a cookie banner and a pop up covering most of the first screen, and a hero so tall that the heading sits below the fold on phones.

Where it shows up in OneCraft

The first section on a generated page is always a hero, with the heading, a supporting line and the main button. Hero layouts include a statement over colour or a photo, copy beside a photo, a photo filling the screen with copy in a corner, and a heading with proof numbers. The builder preview switches between 375, 768 and 1280 pixel widths to check the first screen.

Questions people ask

Do people still scroll?

Yes. Studies of real browsing show most visitors scroll, especially on phones, but attention drops further down the page. The first screen still gets the most attention, which is why it must make visitors want to continue rather than try to say everything.

Should my contact form be above the fold?

Usually not on a general page; a clear button that jumps to the form works better and keeps the first screen readable. On a short landing page with one simple action, such as a waitlist sign-up, a compact form in the first screen can work well.

How tall should a hero section be?

Tall enough to hold the heading, a line and a button with a strong visual, but short enough that a hint of the next section shows on common phone screens. That glimpse signals there is more and invites scrolling, while a hero filling every screen can hide it.

Does above the fold content affect SEO?

Search engines look at whether the main content is easy to find and not buried under ads or pop ups. A clear heading and introduction near the top help both readers and search engines understand the page, though content lower down is still read and counted.

What is the fold on mobile?

The bottom edge of the phone screen before scrolling, usually around 600 to 750 pixels of page height, minus the browser bars. It varies by device, so check the first screen on a real phone rather than relying on a single number.

Make one with websites

The button opens the generator with this use case already described. Change the wording to match your own.

Create a website with OneCraft

Related questions

Sources

Written and checked by the OneCraft team. Last checked .