What Is Above the Fold?
Above the fold refers to the portion of a web page visible without scrolling. The term originates from newspaper printing — the top half of a folded newspaper that faces up on a newsstand. In web design, above-the-fold content is what users see the moment a page loads, before any interaction. It's the most important real estate on a page because it determines first impressions and scroll-through rates.
Why above the fold matters
Research consistently shows that users spend 80% of their attention above the fold. Content below the fold receives far less attention — and the further down the page, the less it's seen. This makes above-the-fold design critical for conversions: your headline, primary CTA, and key value proposition must all be visible without scrolling.
The fold is different on every device
There is no fixed fold height. On a 1080p desktop monitor, the fold might be at 900px. On a 13-inch laptop, it's closer to 700px. On a typical mobile phone, it's around 600–750px. This is why testing above-the-fold content on multiple device sizes matters, and why responsive design using viewport-relative units (vh, vw) is valuable.
Above the fold SEO considerations
Google's Page Layout algorithm penalises pages with too many ads or intrusive interstitials above the fold. Your primary content (not just a large image or banner) should be visible above the fold. From a Core Web Vitals perspective, the Largest Contentful Paint (LCP) — your main above-the-fold element — must load in under 2.5 seconds to score well.
Above the Fold & Canvas Builder
Canvas Builder generates hero sections sized to keep the CTA above the fold on common screen sizes — using Bootstrap 5's viewport-relative utilities and min-height classes.
Try Canvas Builder →