Above the Fold
Above the fold refers to the portion of a webpage visible without scrolling. It originated in print journalism. On the modern web, its meaning has shifted dramatically due to mobile devices, infinite scroll, and varied screen sizes. What matters is not a fixed pixel line but the first impression users form in the first few seconds.
§ 1 Definition
Above the fold is the content area users see immediately after a page loads, before any scrolling. The term comes from newspapers, where the most important story was placed on the upper half of the front page, above the physical fold. On the web, the fold is not a fixed line. It depends on screen size, browser chrome, device orientation, and operating system. The core principle survives: the first screen of content must capture attention, communicate value, and guide the user toward the next step.
§ 2 The Mobile-First Reality
The fold varies wildly across devices. A 27-inch desktop monitor shows vastly more 'above the fold' than an iPhone SE. Modern responsive design makes the fold a spectrum, not a line. The 600px rule of thumb is dead. Design for the critical content that must be visible on the smallest expected viewport, then progressively enhance for larger screens.
§ 3 What the Fold Myth Gets Wrong
The old belief that 'nothing important should go below the fold' has been debunked by eye-tracking studies and scroll maps. Users do scroll. They scroll more when they trust that more content is worth seeing. The fold is not a wall. It is a threshold. The real sin is putting everything above the fold, creating a cluttered, overwhelming first view that makes users leave before they scroll.
§ 4 Modern Above-the-Fold Strategy
Three things must live above the fold: (1) A clear value proposition that answers 'What is this and why should I care?' (2) A visible primary CTA. (3) Trust signals that reassure the user they are in the right place. Everything else can scroll. The hero section evolved precisely to handle this balance.
§ 5 Note
§ 6 In code
<!-- Responsive hero section that respects the fold -->
<section class="hero">
<div class="hero-content">
<h1>Audit Your Site. Find Leaks. Increase Revenue.</h1>
<p class="hero-subtitle">Get a free CRO audit in 48 hours.</p>
<a href="/audit" class="cta-button">Claim Your Free Audit</a>
</div>
</section>
<style>
.hero {
min-height: 100vh; /* Fills the viewport regardless of screen size */
min-height: 100dvh; /* dynamic viewport height for mobile browsers */
display: flex;
align-items: center;
padding: 2rem;
}
.hero-content {
max-width: 640px;
}
</style>§ 7 Common questions
- Q. Is the fold still relevant in 2026?
- A. The concept is relevant. The fixed pixel measurement is not. The first impression still matters enormously. But the fold is dynamic, device-dependent, and less important than the overall page narrative.
- Q. Do users scroll below the fold?
- A. Yes. Multiple studies show 70-80% of users scroll. The key is giving them a reason to scroll: progressive disclosure, clear visual hierarchy, and compelling content that builds on the above-the-fold promise.
- Q. Should I put everything above the fold?
- A. No. That is the fastest way to create a cluttered, confusing page. Prioritize three things: value proposition, CTA, and trust signals. Let the rest flow below.
- The fold is device-dependent, not a fixed pixel line
- Users do scroll. Give them a reason to scroll with progressive disclosure
- Clutter above the fold destroys conversions more than content below the fold
- Prioritize: value proposition, CTA, and trust signals above the fold
Atomic Glue audits your above-the-fold content for clarity, speed, and conversion impact. We analyze scroll maps and session recordings to optimize the first impression. Conversion Optimization services
Get in touchAbove the fold refers to the portion of a webpage visible without scrolling. It originated in print journalism. On the modern web, its meaning has shifted dramatically due to mobile devices, infinite scroll, and varied screen sizes. What matters is not a fixed pixel line but the first impression users form in the first few seconds.
Category: Cro (also: Design, UX)
Author: Atomic Glue Research Team
## Definition
Above the fold is the content area users see immediately after a page loads, before any scrolling. The term comes from newspapers, where the most important story was placed on the upper half of the front page, above the physical fold. On the web, the fold is not a fixed line. It depends on screen size, browser chrome, device orientation, and operating system. The core principle survives: the first screen of content must capture attention, communicate value, and guide the user toward the next step.
## The Mobile-First Reality
The fold varies wildly across devices. A 27-inch desktop monitor shows vastly more 'above the fold' than an iPhone SE. Modern responsive design makes the fold a spectrum, not a line. The 600px rule of thumb is dead. Design for the critical content that must be visible on the smallest expected viewport, then progressively enhance for larger screens.
## What the Fold Myth Gets Wrong
The old belief that 'nothing important should go below the fold' has been debunked by eye-tracking studies and scroll maps. Users do scroll. They scroll more when they trust that more content is worth seeing. The fold is not a wall. It is a threshold. The real sin is putting everything above the fold, creating a cluttered, overwhelming first view that makes users leave before they scroll.
## Modern Above-the-Fold Strategy
Three things must live above the fold: (1) A clear value proposition that answers 'What is this and why should I care?' (2) A visible primary CTA. (3) Trust signals that reassure the user they are in the right place. Everything else can scroll. The hero section evolved precisely to handle this balance.
## Note
The 'fold' is not a universal line. Stop optimizing for a 1024x768 desktop fold in a mobile-first world. Use CSS dvh units and responsive design. Test on real devices. The fold is wherever your user's screen ends.
## In code
<!-- Responsive hero section that respects the fold -->
<section class="hero">
<div class="hero-content">
<h1>Audit Your Site. Find Leaks. Increase Revenue.</h1>
<p class="hero-subtitle">Get a free CRO audit in 48 hours.</p>
<a href="/audit" class="cta-button">Claim Your Free Audit</a>
</div>
</section>
<style>
.hero {
min-height: 100vh; /* Fills the viewport regardless of screen size */
min-height: 100dvh; /* dynamic viewport height for mobile browsers */
display: flex;
align-items: center;
padding: 2rem;
}
.hero-content {
max-width: 640px;
}
</style>## Common questions
Q: Is the fold still relevant in 2026?
A: The concept is relevant. The fixed pixel measurement is not. The first impression still matters enormously. But the fold is dynamic, device-dependent, and less important than the overall page narrative.
Q: Do users scroll below the fold?
A: Yes. Multiple studies show 70-80% of users scroll. The key is giving them a reason to scroll: progressive disclosure, clear visual hierarchy, and compelling content that builds on the above-the-fold promise.
Q: Should I put everything above the fold?
A: No. That is the fastest way to create a cluttered, confusing page. Prioritize three things: value proposition, CTA, and trust signals. Let the rest flow below.
## Key takeaways
- The fold is device-dependent, not a fixed pixel line
- Users do scroll. Give them a reason to scroll with progressive disclosure
- Clutter above the fold destroys conversions more than content below the fold
- Prioritize: value proposition, CTA, and trust signals above the fold
## Related entries
- [Hero Section](atomicglue.co/glossary/hero-section)
- [Scroll Depth](atomicglue.co/glossary/scroll-depth)
- [Value Proposition](atomicglue.co/glossary/value-proposition)
- [Landing Page](atomicglue.co/glossary/landing-page)
Last updated July 2026. Permalink: atomicglue.co/glossary/above-the-fold