Inhoudsopgave
Above the fold is alles wat een bezoeker ziet zonder te scrollen: de eerste viewport van je pagina. Geen vaste pixelmaat, maar het deel van je scherm dat direct in beeld verschijnt zodra iemand jouw website opent. Dat eerste beeld beslist of een bezoeker verder leest of wegklikt.
Doe de mobiele quick check: open je site op je telefoon en beoordeel wat zichtbaar is zonder scrollen
Controleer of je headline in één oogopslag duidelijk maakt wat je aanbiedt
Zorg dat er precies één primaire actieknop zichtbaar is, geen concurrerende opties
Wat betekent above the fold precies?
De term komt uit de krantenwereld: de kop boven de vouw moest de lezer overtuigen de krant te kopen. Online werd het scherm de nieuwe vouw. Vandaag bestaat er geen vaste hoogte meer: de fold wordt bepaald door de viewport en die verschilt per apparaat. Vergeet dus de oude 600-pixelregel. De bruikbare definitie: de eerste viewport moet de bezoeker overtuigen om door te scrollen. Verleiden, niet volproppen.
Waarom is above the fold nog steeds belangrijk?
Het eerste scherm blijft het moment waarop bezoekers een relevantiebeslissing nemen: gaat deze pagina over wat ik zoek? Tot zo’n 57% van de aandacht concentreert zich op het eerste zichtbare scherm. De fold hoeft niet alles te bevatten, maar wel genoeg om de scroll te verdienen. Bij betaalde campagnes en mobiele bezoekers weegt de fold het zwaarst; bij een kennisartikel is de druk lager.
Pro tip
Test niet alleen óf mensen scrollen, maar ook hoe snel. Een trage, aarzelende scroll wijst op twijfel; een snelle, directe scroll duidt op interesse.
Hoe verandert de fold per apparaat?
Er bestaan honderden folds, afhankelijk van schermgrootte en browser. Google indexeert primair op de mobiele versie, waardoor de mobiele fold het belangrijkste vlak op je hele website is. Let op: de adresbalk kan tot 15% van de zichtbare hoogte innemen en een toetsenbord duwt de helft van het scherm weg. Test dus altijd op fysieke toestellen, minimaal een kleine telefoon, een tablet en een laptop.
De vijf elementen die boven de vouw horen
Headline: “Wij bouwen websites die klanten opleveren, niet alleen bezoekers”
Subhead: maakt de belofte concreter voor je doelgroep
Eén primaire CTA: bijvoorbeeld “Plan een gratis kennismaking”, als enige knop
Bewijzende visual: een echte klantwebsite, geen stockfoto
Trust-anker: een Google-beoordeling, klantlogo of aantal jaren ervaring
Wat je vooral moet vermijden: te veel elementen die om aandacht strijden. Twee even grote knoppen dwingen de bezoeker tot een keuze die hij niet wilde maken, met als resultaat dat hij geen van beide aanklikt.
Heb je onze hulp nodig?
Neem gerust contact op voor vragen of advies over jouw project.
Moet de call-to-action altijd boven de fold staan?
Niet altijd. Op een landingspagina voor een campagne is de bezoeker al warm: daar hoort de CTA in de fold. Op een informatief blogartikel wil de lezer eerst begrijpen en overtuigd worden; een teaser boven de fold met een herhaalde CTA verderop werkt daar beter. Mobiele bezoekers verdienen extra prioriteit vanwege hun kortere aandachtsspanne.
Hoe test en meet je wat werkt?
Heatmaps: visueel inzicht in klikgedrag en aandachtsgebieden
Sessierecordings: begrijpen waarom iemand precies afhaakt
A/B-testen: hard bewijs bij twee headline- of CTA-varianten
Scroll-diepte-analyse: hoeveel procent komt voorbij de fold?
Meet ook begripssnelheid: vraag iemand die je site nooit zag binnen vijf seconden te zeggen wat het bedrijf doet. Lukt dat niet, dan schiet je headline tekort. En schakel lazy loading uit voor afbeeldingen boven de vouw, zodat je hero direct laadt.
Welke fouten ondermijnen je above the fold?
Te veel willen zeggen: drie boodschappen, twee knoppen en een carrousel verwarren in plaats van overtuigen
Generieke headlines als “welkom op onze website” beantwoorden de klantvraag niet
Geen message match: de advertentiebelofte moet boven de fold bevestigd worden
Een extra knop “voor de zekerheid” voegt geen kans toe, maar keuzestress
Hoe ZazouTotaal above the fold aanpakt
Bij ons begint elke boven-de-vouw-beslissing niet bij design, maar bij boodschap: het uitgangspunt van de StoryBrand-methode. Eerst de kernboodschap scherp, dan de copy (headline en subhead), pas daarna de visuele laag met één heldere actieknop. Vervolgens testen we grondig op mobiel en itereren we op echt bezoekersgedrag. Twijfel je of jouw eerste scherm de scroll verdient? Vraag een gratis website analyse aan.
Veelgestelde vragen
Wat is above the fold op een website?+
Het deel van een webpagina dat een bezoeker ziet zonder te scrollen, ook wel de eerste viewport. Dit gebied verschilt per apparaat; er bestaat geen vaste pixelhoogte.
Is above the fold nog steeds relevant?+
Ja: de fold blijft het moment waarop bezoekers beslissen of ze verder scrollen of wegklikken. De rol is verschoven van “alles erin proppen” naar het overtuigend presenteren van vijf kernelementen.
Moet de call-to-action altijd boven de fold staan?+
Op een landingspagina met campagnedoel wel; op een informatief artikel werkt een teaser boven de fold met een herhaalde CTA verderop vaak beter.