Above the Fold
L'above the fold è ciò che gli acquirenti vedono senza scorrere: spesso decide se i visitatori restano o abbandonano il negozio.
Che cos’è l’Above the Fold?
L’above the fold è la parte di una pagina visibile nella finestra del browser prima che l’utente scorra (scroll). Il termine deriva dai giornali cartacei, dove la metà superiore della prima pagina era visibile in edicola. Sul web non esiste un “fold” (piega) fisso: il confine dipende dalle dimensioni dello schermo del visitatore, dal dispositivo e dalla finestra del browser, quindi ciò che è visibile su desktop potrebbe richiedere lo scorrimento su mobile.
Perché l’Above the Fold è importante?
Qui è dove hai pochi secondi per mostrare cosa vendi e qual è il passo successivo. Gli studi di tracciamento oculare (eye-tracking) del Nielsen Norman Group mostrano che gli utenti trascorrono la stragrande maggioranza della loro attenzione above the fold, anche se effettivamente scorrono la pagina. Una proposta di valore chiara e una CTA visibile above the fold sono quindi una classica leva per il tasso di conversione in un negozio online.
Casi d’uso comuni
- Hero della homepage. Mostra il tuo messaggio chiave, l’offerta o la categoria senza scorrere sia su mobile che su desktop.
- Pagina del prodotto. Assicurati che il prezzo, “Aggiungi al carrello” e l’immagine del prodotto siano immediatamente visibili.
- Pagine della campagna. Posiziona l’offerta e la CTA above the fold in modo che il traffico proveniente dagli annunci non debba andare a caccia dell’azione da compiere.
- Core Web Vitals. L’elemento più grande above the fold è spesso l’elemento LCP, quindi un’immagine hero pesante può rallentare il tuo LCP.
La prospettiva di Shopify
In Shopify, l’area above the fold è controllata dalle sezioni e dai blocchi del tema nell’editor del tema. Un errore comune è il lazy-loading dell’immagine hero: quando è il candidato LCP, ciò ritarda il caricamento e danneggia i Core Web Vitals. Invece, imposta loading="eager" (o fetchpriority="high") sull’immagine hero e mantieni la sezione superiore leggera. Fai sempre dei test su un telefono reale — non solo su desktop — poiché il “fold” si trova molto più in alto sugli schermi piccoli.