Above The Fold
Above the fold is the portion of any landing page that loads in the initial browser window without requiring a scroll. On most desktop devices this means the top 800 to 1100 pixels though it varies by screen size and browser chrome. In the context of high converting landing pages this section carries the full weight of the attention layer. It must explain the offer filter the audience and compel the right visitor to keep reading all within a few seconds. The best implementations follow a strict four part formula. First a headline that passes the so what test by stating a clear value proposition like Stripes Financial infrastructure for the internet. Second a subheadline that spells out the outcome or transformation such as Linears promise to ship projects on time without the endless meetings. Third one primary CTA button with action focused language that removes ambiguity. Fourth a visual element whether a product screenshot live demo or outcome image that reinforces the claim without relying on stock imagery. This combination respects the non negotiable sequence of attention before trust before action. The term traces back to physical newspapers where the most newsworthy articles were positioned above the fold to maximize impact at the newsstand. On the web it determines if your carefully built trust elements and CTAs below will ever get seen.
It is not merely a pretty hero banner or an opportunity to flex creative muscles at the expense of clarity. Above the fold is not a container for cramming every marketing message feature benefit and social proof item into one chaotic viewport. It is not the place for clever but unclear headlines that require explanation or for subheadlines that simply reword the main claim. The section is not where you park complex navigation bars that compete with the value proposition or multiple CTAs that trigger decision paralysis. It fails when designers prioritize visual trends like oversized typography or animated elements that distract rather than support the conversion goal. It is not a set it and forget it element that you copy from competitor sites without adapting to your specific audience and offer. Most importantly it is not decorative. Every element must pull its weight toward earning attention or it becomes friction that increases bounce rates. Consider the typical failed startup page with a headline like Empowering innovative teams with AI driven collaborative solutions. That mess above the fold confuses more than it converts and sends qualified visitors straight to the back button.
Concrete examples from the strongest converting pages demonstrate these principles in action. Take Loom which in 2016 positioned an automatically playing video demo front and center above the fold. As visitors read about the simplicity of async video communication they simultaneously watch the product in use. This clever match of medium to message eliminates the typical gap between hearing a pitch and picturing implementation. The headline stays crisp the CTA says Try Loom for free and the video does the persuasive work. Contrast this with Stripes approach on their page refined through iterations since the 2011 launch. Their headline acts as an immediate audience filter. Developers get it right away while others move on. Below that but still above the fold sit live charts and API examples that function as proof by demonstration rather than empty claims. Institutional logos from companies like Amazon and Lyft reinforce credibility without overwhelming the design. Linear refined their page in 2024 to an almost brutal minimalism. The above the fold features a two line headline a single subheadline one CTA and a dominant screenshot of their polished interface. This screenshot is not decoration. It serves as social proof for an audience that values design excellence at a glance. The absence of clutter signals confidence in the product itself. Notion tackles the challenge of their flexible all in one workspace by pairing adaptable headlines with a prominent logo wall placed immediately after the hero copy. Companies like Pixar and major startups appear which converts initial skepticism into curiosity before the scroll. Vercel integrates a functioning deploy preview with real time code updates directly in the hero turning the above the fold into an interactive demonstration that outperforms any testimonial. Arc Browser bets on personality with a headline that evokes feeling over features supported by video that showcases a browser experience unlike anything else on the market. These examples from 2016 through 2024 show that the specific tactics vary but the discipline around the four elements and the attention job remains constant. Each page avoids the common traps and focuses every pixel on moving the visitor to the next layer. They map to the anatomy of attention at the top trust signals immediately below and action CTAs that feel inevitable once the first two layers succeed.
Use a disciplined above the fold section when your offer can be understood quickly when your visual assets genuinely demonstrate value and when data shows most visitors decide to stay or leave in under ten seconds. Deploy it for developer tools like Linear Vercel and Stripe where technical proof resonates immediately. Apply it to consumer facing products like Loom where the demo video creates instant understanding. It works particularly well for self serve SaaS products that rely on low friction sign ups rather than sales calls. Always test variations of the headline and visual here first since this real estate influences every other metric on the page. Conversion rate optimization research conducted between 2019 and 2023 consistently shows that improvements above the fold yield larger lifts than changes anywhere else. Avoid overloading the above the fold when selling complex enterprise platforms that require multiple proof points or when the buyer journey demands significant education before trust can form. Do not use it if your product visuals are weak or if your value proposition needs more than a few words to land. Skip the traditional approach when your audience consists of older demographics less comfortable with dense digital interfaces or when A B testing reveals that a longer form explanation converts better for your specific offer. Never fill this critical space with generic elements that could apply to any company in your industry.
Above the fold is your one shot to earn the scroll or lose the visitor forever.
Read the full guide
Related terms
Keep exploring
Hero Section
The hero section is the first full-width content block on a page, built to tell a visitor where they are, what they can get, and what to do next before they decide to scroll or bail.
Visual Hierarchy
The arrangement of design elements so the eye processes them in a deliberate order, controlled by size, contrast, color, spacing, and position.
CTA
Call to Action. A design element, usually a button or link, that prompts the user to take a specific action like signing up, buying, or downloading.