[{"data":1,"prerenderedAt":298},["ShallowReactive",2],{"navigation":3,"\u002Fblog\u002Fabove-fold-vs-below-fold":4,"\u002Fblog\u002Fabove-fold-vs-below-fold-surround":287},[],{"id":5,"title":6,"authors":7,"badge":13,"body":15,"date":274,"description":275,"extension":276,"image":277,"meta":279,"navigation":280,"path":281,"seo":282,"stem":285,"__hash__":286},"posts\u002F3.blog\u002F10.above-fold-vs-below-fold.md","Above the Fold vs. Below the Fold: What to Put Where (and Why It Matters)",[8],{"name":9,"to":10,"avatar":11},"Cedric Isubol","https:\u002F\u002Ftwitter.com\u002Fhomepageauditor",{"src":12},"\u002Fhomepage-auditor-ceo.png",{"label":14},"UX Design",{"type":16,"value":17,"toc":255},"minimark",[18,22,25,30,33,41,48,52,55,81,84,88,91,94,100,106,112,115,119,122,125,130,133,137,144,148,151,155,158,162,165,169,172,176,182,188,194,200,204,207,219,222,231,235],[19,20,21],"p",{},"The concept of \"the fold\" comes from newspapers — the content above the physical fold was the most visible, most valuable real estate on the page. When the web emerged, the metaphor transferred: above the fold meant what visitors saw without scrolling.",[19,23,24],{},"Decades later, designers still argue about whether the fold matters. The honest answer: it does — but probably not in the way you think.",[26,27,29],"h2",{"id":28},"what-the-fold-actually-means-in-2025","What \"The Fold\" Actually Means in 2025",[19,31,32],{},"There is no single fold. Screen sizes, resolutions, browser chrome, and zoom levels mean every visitor has a slightly different viewport. A layout that's entirely above the fold on a 27-inch desktop monitor might cut your headline in half on a 13-inch laptop.",[19,34,35,36,40],{},"Despite this, the fold remains meaningful as a concept because ",[37,38,39],"strong",{},"scroll behavior is not uniform",". Research consistently shows that the first screenful gets disproportionately more attention than anything below it — regardless of screen size.",[19,42,43,44],{},"The implication isn't \"cram everything above the fold.\" It's ",[45,46,47],"em",{},"\"your most important content earns attention in inverse proportion to how far down the page it lives.\"",[26,49,51],{"id":50},"what-the-data-shows-about-scroll-behavior","What the Data Shows About Scroll Behavior",[19,53,54],{},"Eye-tracking and heatmap studies reveal a consistent pattern:",[56,57,58,66,72,75],"ul",{},[59,60,61,62,65],"li",{},"The average visitor spends ",[37,63,64],{},"57% of their viewing time"," in the first screenful",[59,67,68,69],{},"Content in the second screenful gets roughly ",[37,70,71],{},"17% of attention",[59,73,74],{},"Below the second screen, engagement drops off sharply",[59,76,77,80],{},[37,78,79],{},"Scrolling is earned, not automatic"," — visitors scroll only when the above-fold content gives them a reason to",[19,82,83],{},"The implication for homepages is significant. If you lead with weak content, most visitors never see your stronger arguments further down the page. The fold isn't a cutoff — it's a filter.",[26,85,87],{"id":86},"what-belongs-above-the-fold","What Belongs Above the Fold",[19,89,90],{},"The above-fold section has one job: make the visitor want to scroll.",[19,92,93],{},"To do that, it needs to answer three questions instantly:",[19,95,96,99],{},[37,97,98],{},"1. What is this?","\nYour headline must communicate your core value proposition clearly and specifically. \"Marketing software for B2B SaaS startups\" beats \"Grow your business faster\" every time — because the specific version confirms to the right visitor that they're in the right place.",[19,101,102,105],{},[37,103,104],{},"2. Is this for me?","\nThe supporting copy, imagery, and any social proof signals should reinforce who this is for. If you serve small businesses, show small businesses. If you serve enterprise, the visual language, logos, and positioning should reflect that.",[19,107,108,111],{},[37,109,110],{},"3. What do I do next?","\nA single, clear primary CTA — visible without scrolling — gives the visitor a next step. \"Start for free,\" \"Book a demo,\" \"Get my audit.\" One action, not five.",[19,113,114],{},"Everything else — pricing, feature details, FAQ, testimonials, team bios — belongs below the fold.",[26,116,118],{"id":117},"what-belongs-below-the-fold-and-in-what-order","What Belongs Below the Fold (And in What Order)",[19,120,121],{},"Once a visitor decides to scroll, they're evaluating. They're not yet convinced, but they're interested. Below the fold is where you answer the objections that interest raises.",[19,123,124],{},"A high-performing homepage typically follows this sequence below the fold:",[126,127,129],"h3",{"id":128},"social-proof-anchor","Social Proof Anchor",[19,131,132],{},"The first section below the hero should reinforce trust — logo bar, review score, or customer count. This catches visitors who scrolled past the hero but are still skeptical.",[126,134,136],{"id":135},"the-problem-you-solve","The Problem You Solve",[19,138,139,140,143],{},"Before you list features, establish that you understand the visitor's pain. A brief section that names the problem creates alignment: ",[45,141,142],{},"\"Yes, that's me.\""," This is often the most overlooked section on SaaS homepages.",[126,145,147],{"id":146},"how-it-works-features","How It Works \u002F Features",[19,149,150],{},"Now you can show the product. Keep it outcome-focused: not \"real-time alerts\" but \"know the moment something breaks.\" Each feature should map to a visitor benefit.",[126,152,154],{"id":153},"testimonials-case-study-results","Testimonials \u002F Case Study Results",[19,156,157],{},"Proof that the features deliver on the promise. This is where specific outcomes (\"went from 2.1% to 6.8% conversion in 8 weeks\") do more work than any copy you could write.",[126,159,161],{"id":160},"pricing-or-cta-section","Pricing or CTA Section",[19,163,164],{},"A secondary conversion opportunity for visitors who read this far. They've already qualified themselves — don't make them scroll back to the top.",[126,166,168],{"id":167},"faq","FAQ",[19,170,171],{},"Preemptively answer the top 4–6 objections. Good FAQ copy kills the last remaining hesitation before the visitor bounces.",[26,173,175],{"id":174},"the-most-common-above-the-fold-mistakes","The Most Common Above-the-Fold Mistakes",[19,177,178,181],{},[37,179,180],{},"Putting too much above the fold."," Founders try to say everything in the hero — headline, subheadline, feature list, testimonials, CTA, product screenshot, team photo. The result is visual chaos that says nothing.",[19,183,184,187],{},[37,185,186],{},"Prioritizing visuals over clarity."," A beautiful full-bleed video background with an abstract tagline fails the \"what is this?\" test. Aesthetics serve clarity; they don't replace it.",[19,189,190,193],{},[37,191,192],{},"Hiding the CTA."," If your primary action button is below a long hero section, or styled as a ghost button that blends into the background, you're burying your main conversion goal.",[19,195,196,199],{},[37,197,198],{},"Forgetting mobile."," On mobile, \"above the fold\" is approximately 600–700px. That often means only your headline and a button fit — which is fine, as long as those two elements are doing their job.",[26,201,203],{"id":202},"how-to-evaluate-your-own-above-fold-section","How to Evaluate Your Own Above-Fold Section",[19,205,206],{},"Pull up your homepage on three devices: a desktop, a laptop, and a phone. For each one, ask:",[208,209,210,213,216],"ol",{},[59,211,212],{},"Without scrolling, can I tell in 5 seconds what this product does and who it's for?",[59,214,215],{},"Is there a clear, visible call to action?",[59,217,218],{},"Is there at least one trust signal in view?",[19,220,221],{},"If the answer to any of those is \"no,\" you've found your highest-priority fix.",[19,223,224,225,230],{},"If you want a systematic evaluation across your entire page — not just above the fold — ",[226,227,229],"a",{"href":228},"\u002F","HomepageAuditor"," analyzes your homepage against 13 conversion factors and tells you exactly where attention is being lost. Most audits surface 3–5 specific changes that meaningfully move the needle.",[26,232,234],{"id":233},"key-takeaways","Key Takeaways",[56,236,237,240,243,246,249,252],{},[59,238,239],{},"The fold isn't a fixed line — it's a reminder that attention diminishes with scroll depth",[59,241,242],{},"Visitors spend 57% of their time in the first screenful; content below the second screen gets very little",[59,244,245],{},"Above the fold must answer: what is this, is it for me, and what do I do next",[59,247,248],{},"Below the fold follows a logical sequence: trust → problem → solution → proof → CTA → FAQ",[59,250,251],{},"The most common above-fold mistakes are information overload, aesthetics over clarity, and a hidden or missing CTA",[59,253,254],{},"Test your above-fold section on desktop, laptop, and mobile — they often tell three very different stories",{"title":256,"searchDepth":257,"depth":257,"links":258},"",2,[259,260,261,262,271,272,273],{"id":28,"depth":257,"text":29},{"id":50,"depth":257,"text":51},{"id":86,"depth":257,"text":87},{"id":117,"depth":257,"text":118,"children":263},[264,266,267,268,269,270],{"id":128,"depth":265,"text":129},3,{"id":135,"depth":265,"text":136},{"id":146,"depth":265,"text":147},{"id":153,"depth":265,"text":154},{"id":160,"depth":265,"text":161},{"id":167,"depth":265,"text":168},{"id":174,"depth":257,"text":175},{"id":202,"depth":257,"text":203},{"id":233,"depth":257,"text":234},"2025-12-17","The 'fold' is still one of the most debated concepts in web design. Here's what the data actually shows about how visitors read your homepage — and how to structure your content accordingly.","md",{"src":278},"https:\u002F\u002Fpicsum.photos\u002Fid\u002F48\u002F640\u002F360",{},true,"\u002Fblog\u002Fabove-fold-vs-below-fold",{"title":283,"description":284},"Above the Fold vs. Below the Fold: Homepage Structure Guide | HomepageAuditor","Learn what content belongs above vs. below the fold on your homepage, backed by real data on visitor scroll behavior and attention patterns.","3.blog\u002F10.above-fold-vs-below-fold","oNmaPfoYGs7PReRRnp4CedQ9XTB2Kb-djDMnTllxCuc",[288,293],{"title":289,"path":290,"stem":291,"description":292,"children":-1},"Your Homepage Has 3 Seconds to Impress: What the Science Actually Says","\u002Fblog\u002Fthree-seconds-rule","3.blog\u002F1.three-seconds-rule","Neuroscience research shows visitors form lasting judgments about your website in milliseconds. Here's what actually happens in those critical first seconds — and how to win them.",{"title":294,"path":295,"stem":296,"description":297,"children":-1},"7 Homepage Copy Mistakes That Are Quietly Killing Your Conversions","\u002Fblog\u002Fhomepage-copy-mistakes","3.blog\u002F11.homepage-copy-mistakes","Most homepage copy problems aren't obvious — they're subtle. Here are the seven mistakes that show up in nearly every audit, why they hurt, and how to fix each one.",1781562359524]