Wat “boven de vouw” betekent op een website, en waarom het je conversies bepaalt

Waar de term vandaan komt

De term komt uit de krantenwereld. Een krant ligt gevouwen in het rek, dus alleen de bovenste helft van de voorpagina is zichtbaar. Redacties zetten het verhaal dat de krant moest verkopen boven die vouw. Al de rest wachtte tot de lezer de krant oppakte.

Websites namen het idee over. De vouw werd de onderrand van het browservenster: de lijn waar het eerste scherm stopt en het scrollen begint. Erboven staat wat elke bezoeker ziet. Eronder staat wat maar een deel van de bezoekers bereikt.

Waar de vouw vandaag ligt op een website

Er is geen enkele vaste vouw meer. De lijn verschuift met het scherm, de browserbalken en het zoomniveau. Een bezoeker op een groot scherm ziet ongeveer 900 pixels paginahoogte. Een bezoeker op een telefoon ziet ongeveer 650 tot 750 pixels, en veel minder breedte. Dezelfde pagina, een ander eerste scherm.

Daarom lees je "boven de vouw" beter als een vraag dan als een pixelwaarde: wat ziet een nieuwe bezoeker voor hij een vinger beweegt? Ontwerp voor het kleinste scherm dat telt voor je publiek, controleer de andere, en behandel elke pixel in dat eerste scherm als duur.

Toestel	Typisch eerste scherm	Wat er meestal in past
Laptop, 1366 × 768	ongeveer 650 px paginahoogte	navigatie, kop, één regel tekst, één knop
Monitor, 1920 × 1080	ongeveer 950 px paginahoogte	de herosectie plus een glimp van het volgende blok
Telefoon, 390 × 844	ongeveer 700 px, in één kolom	kop, twee korte regels, één knop

De hoogtes zijn bij benadering. Browserbalken, cookiebanners en meldingsbalken snoepen er allemaal van af.

Waarom boven de vouw nog altijd je conversies bepaalt

Mensen scrollen wel. Ze scrollen alleen niet voor ze oordelen. Nielsen Norman Group mat met eyetracking waar de aandacht op een pagina naartoe gaat en vond dat 57 procent van de kijktijd boven de vouw valt, en 74 procent in de eerste twee schermen. In 2010 was het aandeel boven de vouw 80 procent, dus er wordt meer gescrold, maar het eerste scherm krijgt nog altijd meer dan de helft van alle aandacht.

Het oordeel zelf gaat sneller dan lezen. Lindgaard en collega’s toonden aan dat bezoekers in ongeveer 50 milliseconden een stabiele mening over een pagina vormen. Daarna zoeken mensen redenen om te bevestigen wat ze al voelen. Het eerste scherm zet de toon voor alles wat volgt.

Leg die twee bevindingen naast elkaar en de vouw is geen designdetail meer. Het is het moment waarop een bezoeker beslist of je pagina een scroll verdient. Zegt het eerste scherm niet wat je aanbiedt, voor wie, en wat de volgende stap is, dan ziet het grootste deel van je bezoekers nooit het bewijs dat je lager hebt gezet.

Kort gezegd Boven de vouw is het enige deel van je pagina dat elke bezoeker ziet. Besteed het aan duidelijkheid, niet aan decoratie.

Wat boven de vouw hoort

Een nieuwe bezoeker loopt in die eerste seconden een paar vragen af, meestal zonder het te merken. De vouw moet ze beantwoorden.

1. Wat is dit? Een kop in gewone woorden. Geen slogan, geen woordspeling. Kan een onbekende na één keer lezen niet herhalen wat je aanbiedt, herschrijf hem dan. Deze voorbeelden van herosecties tonen wat slaagt.
2. Is het voor mij? Noem het publiek of de situatie. "Facturatie voor freelance designers" wint van "Slimmer financieel beheer".
3. Waarom zou ik nu? Eén concreet resultaat of één stuk bewijs: een cijfer, een klant met naam, een uitkomst.
4. Wat doe ik nu? Eén primaire call-to-action. Eén. Een tweede knop met hetzelfde gewicht splitst de aandacht en verlaagt ze allebei.
5. Klopt het beeld? Een afbeelding die het product of het resultaat toont. Een stockfoto van lachende mensen achter een laptop zegt niets en kost de ruimte van drie zinnen.
6. Is er meer? Laat de volgende sectie net over de rand piepen. Een pagina die precies op een strakke lijn onderaan het scherm eindigt, lijkt af, en bezoekers stoppen met scrollen. Nielsen Norman Group noemt dit een valse bodem.

Wat niet boven de vouw hoort

• Een carrousel. Roterende banners splitsen je ene boodschap in vijf zwakke, en de meeste bezoekers zien toch alleen de eerste slide.
• Automatisch afspelende video zonder woorden. Beweging trekt het oog, maar een bezoeker heeft nog altijd tekst nodig om het aanbod te begrijpen.
• Drie knoppen die met elkaar concurreren. "Start gratis proefperiode", "Boek een demo" en "Bekijk video" naast elkaar zijn drie beslissingen voor de eerste is genomen.
• Een cookiemuur die de boodschap bedekt. Toestemmingsbanners zijn vaak verplicht, maar ze mogen de kop op een telefoon niet verbergen.
• Je bedrijfsgeschiedenis. "Opgericht in 1998" beantwoordt geen van de zes vragen. Dat hoort op de over-ons-pagina.

Zo test je je vouw in vijf seconden

De klassieke methode is een 5-secondentest. Toon je eerste scherm vijf seconden aan iemand die de pagina nooit zag, haal het weg en vraag: wat doet dit bedrijf, voor wie is het, en waar zou je klikken? Zijn de antwoorden vaag, dan doet de vouw haar werk niet.

Dat kan met een collega en een stopwatch. Je kunt ook een AI de pagina laten lezen zoals een onbekende dat doet: de gratis 5-secondentest op 5sec.io toetst de zes vragen hierboven aan je live pagina en citeert het bewijs dat hij vond. Voor een volledige site scoort de Above the Fold Audit, een conversieoptimalisatie-audit van het eerste scherm, ongeveer vijftien belangrijke pagina’s op dezelfde manier en herschrijft hij de vijf zwakste.

Hoe dan ook: test voor je herontwerpt. De meeste problemen boven de vouw zijn tekstproblemen, en tekst is goedkoop om te fixen.