Cosa significa esattamente “Above the fold“? Quanto è importante per la progettazione del sito internet?

La storia della piega (above the fold)

Il concetto di piega ha avuto origine dall’era dei giornali. I giornali sono stampati su grandi fogli di carta che vengono poi piegati. Questo porta solo alla metà superiore del foglio visibile ai lettori.

Questa nozione ha portato l’industria giornalistica a progettare questo spazio con il massimo dell’attenzione, con titoli accattivanti, contenuti e immagini che catturano l’attenzione nella metà superiore della pagina. Lo stesso principio si applica ai contenuti digitali. Tuttavia, l’unica differenza è che i siti web non hanno alcuna piega fisica. La piega, in questo caso, indica l’altezza del browser.

Le cose che sono immediatamente visibili senza scrollare in basso il sito web sono considerate above the fold. Tutto ciò che richiede lo scorrimento è considerato al di sotto della piega.

web design above the fold

Importante anche per la SEO?

Il contenuto posizionato sopra la piega ha un altissimo valore per il posizionamento del nostro sito. I nostri contenuti devono essere scelti con cura e strategia.

Qui voglio affrontare il tema della slide “a tutti i costi”. Tutte le analisi dimostrano che i nostri utenti non scelgono quasi mai di sfogliare e di leggere le varie slide in testa ai nostri siti. Se pensiamo a quanta altezza occupano ci rendiamo subito conto di quanto spreco esse comportino. L’utente non è interessato alle slide, poi di solito sono mal gestite sui mobile, a mio modesto parere creano più danni che utilità ed è importante valutare ogni dettaglio in fase progettuale.

Come progettare al meglio i contenuti above the fold

Concentrarsi sull’usabilità

Il contenuto deve attirare l’attenzione, convincere e incoraggiare gli utenti a continuare a esplorare ulteriormente il sito web scorrendo o facendo clic su ciò che gli viene fornito. Deve essere pertinente e convincere gli utenti che si trovano nel posto giusto. Oltre a questo, è il posto migliore per la CTA primaria. Vendi un servizio e vuoi farlo provare? Vuoi far scaricare un pdf? Lo spazio sopra la piega è il posto più idoneo.

Ricordiamoci sempre che oltre alle info di base deve esserci la barra di ricerca.

Non esagerare con troppe informazioni

Ricordiamoci sempre che anche in questo spazio vige la regola del less is more, scegliamo con strategia quali informazioni mostrare e che chiamate all’azione poter mostrare all’utente.

Considera un caso in cui hai circa 4-5 messaggi simili nello stesso spazio. I tuoi utenti saranno confusi su quale pulsante dovrebbero fare clic. Non inserire troppi contenuti nel above the fold. Raggruppalo in blocchi gestibili, distribuiscili con gerarchia e spazi bianchi adeguati.

Racconta la tua storia

Il contenuto tenuto sopra la piega dovrebbe essere un’anteprima delle informazioni fornite nel resto della pagina. Possiamo avvalerci di un video, un’immagine, colori e parole per raccontarci al meglio.

Poi per incoraggiare i tuoi utenti a scorrere verso il basso per ulteriori informazioni ed esplorare il resto del sito puoi utilizzare la freccia che punta in basso che invoglia a scrollare in verticale.

Sito web usabile Modena

 

Il sito www.unfold.no ha utilizzato sia la freccia sia una porzione del contenuto sottostante e il risultato porta l’utente a scrollare verso il basso.

Le dimensione contano

Secondo Optimizely , una linea di piega media che tutti i web designer hanno concordato è larga circa 1000 pixel e alta 600 pixel. Questo è lo scenario medio in cui la risoluzione dello schermo è 1024 x 768 pixel.

Esistono molti strumenti online per progettare al meglio questo spazio, uno di questi è una mappa di calore. Così una volta che abbiamo chiaro quali aree sono le più attive possiamo gestirle al meglio.

Mouseflow: Session Replay, Heatmaps, Funnels, Forms & User Feedback

Con la mappa di calore puoi avere un’idea di dove i tuoi visitatori trascorrono la maggior parte del loro tempo e da dove iniziano a scorrere.

Concludendo

Il concetto di piega (above the fold) non è per niente superato anzi, è uno spazio che va progettato con attenzione creando un design coinvolgente.

Discussion

Leave a reply

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *