Above the fold

Wat is Above the Fold?

Above the fold is het deel van een pagina dat zichtbaar is in het browserscherm voordat de gebruiker scrollt. De term is afkomstig van gedrukte kranten, waarbij de bovenste helft van de voorpagina zichtbaar was in de krantenkiosk. Op het web is er geen vaste “vouw”: de grens hangt af van de schermgrootte, het apparaat en het browserscherm van de bezoeker, waardoor wat zichtbaar is op desktop, scrollen kan vereisen op mobiel.

Waarom is Above the Fold belangrijk?

Dit is de plek waar u een paar seconden de tijd hebt om te laten zien wat u verkoopt en wat de volgende stap is. Eye-trackingonderzoeken van de Nielsen Norman Group tonen aan dat gebruikers het overgrote deel van hun aandacht boven de vouw besteden, ook al scrollen ze wel. Een duidelijke waardepropositie en een zichtbare CTA boven de vouw is daarom een klassieke hefboom voor het conversiepercentage van een online winkel.

Veelvoorkomende toepassingen

• Homepage hero. Toon uw belangrijkste boodschap, aanbieding of categorie zonder te scrollen op zowel mobiel als desktop.
• Productpagina. Zorg ervoor dat de prijs, “In winkelwagen” en de productafbeelding direct zichtbaar zijn.
• Campagnepagina’s. Plaats de aanbieding en CTA boven de vouw, zodat advertentieverkeer niet naar de actie hoeft te zoeken.
• Core Web Vitals. Het grootste element boven de vouw is vaak het LCP-element, dus een zware hero-afbeelding kan uw LCP vertragen.

Shopify-perspectief

In Shopify wordt het gedeelte boven de vouw beheerd door de secties en blokken in de thema-editor. Een veelgemaakte fout is het lazy-loaden van de hero-afbeelding: wanneer dit de LCP-kandidaat is, vertraagt dat het laden en schaadt het de Core Web Vitals. Stel in plaats daarvan loading="eager" (of fetchpriority="high") in op de hero-afbeelding en houd de bovenste sectie licht. Test altijd op een echte telefoon — niet alleen op desktop — omdat de vouw op kleine schermen veel hoger ligt.