Di Riccardo Esposito | Pubblicato il - Aggiornato il
L’above the fold – tradotto come sopra la piega – è la parte subito visibile della pagina web che si legge prima dello scrolling. È la parte più importante di una pubblicazione online dove devi chiarire subito i benefit e l’USP.
Cosa succede quando una persona atterra su un articolo del blog? Raccoglie informazioni per capire se è arrivato nel posto giusto. Sai quanto tempo hai per attirare la sua attenzione? Poco. Tutto si concentra nella sezione above the fold.
Qui devi dare il massimo. Devi far capire che hai lavorato bene, che hai racchiuso le notizie per rispondere a un’esigenza. Hai un piano editoriale, un calendario con i titoli da sviluppare. Hai pianificato la gestione della pagina Facebook e di Twitter.
Ora devi convincere il pubblico a rimanere sulle pagine. Quindi devi curare la leggibilità del testo, devi fare in modo che la fruizione sia semplice, leggera.
Il principio di Jakob Nielsen vale sempre: le persone non leggono, scannerizzano. Ma soprattutto lasciano le pagine web in breve tempo se non trovano quello che cercano. Ecco perché devi lavorare above the fold. Ma come?
Indice dei contenuti
Cos’è above the fold: definizione
Devi trovare una definizione. Cos’è above the fold? La prima parte di una pagina web, quella che appare sullo schermo nel momento in cui si apre il documento. Può essere una home page, un articolo, una scheda e-commerce: non fa differenza.
Cosa significa letteralmente above the fold in inglese? La traduzione di questo termine (sopra alla piega) deriva dal mondo della carta stampata.
Infatti, above the fold era la pagina che veniva mostrata al pubblico una volta piegati i fogli ed esposti dal giornalaio. Quindi, anche in un’epoca analogica la sezione above the fold era decisiva. Oggi c’è però un’attenzione particolare a questo tema.
Il concetto di above the fold è relativo, molto relativo se si prendono in considerazione i dispositivi mobile e desktop. Tutto quello che si trova sotto la linea del monitor rientra nel below the fold, che non deve essere ignorato.
Above the fold e below the fold
Nielsen suggerisce che l’80% del tempo speso da un utente è al di sopra di questa linea. In linea di massima, ovviamente. Ma ci sono delle soluzioni differenti. Molte pagine funzionano bene anche sotto, anche nello scrolling del mouse.
Ovvero come le performance di molte landing page con la call to action sotto il primo scrolling siano più performanti. Ma non è questo il punto: i tuoi post devono svilupparsi con armonia, e devi superare la regola dei 10 secondi.
Per approfondire: come creare un blog di successo
Perché migliorare above the fold?
Ecco il grafico di Jakob Nielsen: sull’asse verticale hai la probabilità di lasciare la pagina, mentre sulla parte orizzontale c’è il tempo trascorso sulla risorsa. Cosa puoi capire da questa sintesi? Suggerisco io: i primi 10 secondi sono decisivi.
Le parole che puoi leggere sul blog: “If the web page survives this first — extremely harsh — 10-second judgment, users will look around a bit. People continue to leave every second, but at a much slower rate than during the first 30 seconds”.
Più passa il tempo e maggiori sono le probabilità di mantenere il lettore. Che può abbandonare la risorsa in qualsiasi momento. Ma una volta conquistato rimane.
Come ottimizzare l’above the fold
Le persone scrollano se l’above the fold riesce a incuriosire, solo se promette qualcosa che le persone vogliono. Se i primi 10 secondi sono decisivi per il tuo blog, è nella sezione above the fold che viene trascorsa la maggior parte del tempo.
Poi le persone prendono una decisione, continuano a leggere e si ritrovano alla fine del post. Cosa significa? Devi curare l’above the fold, la parte che dà il benvenuto.
Qui le persone decidono se continuare o meno a leggere il post. Ma quali sono gli elementi decisivi? Come organizzare questa parte del sito? Scopriamolo insieme.
Cura l’header nell’above the fold
Il primo elemento da ottimizzare è l’header, che segue il lettore in ogni pagina (è uguale). E dà una serie di informazioni base relative ai contenuti e al brand.
L’header non deve essere troppo alto, altrimenti schiaccia i contenuti e non rende possibile la lettura. Deve essere comodo, non troppo corto. Ecco cosa inserire in questa sezione, oltre alla barra di navigazione con argomenti e pagine fisse:
- Nome del blog, la tua identità deve esserci sempre.
- Tagline, cosa prometti e cosa vuoi ottenere.
In qualche caso nell’header puoi trovare la ricerca interna. Spesso questo modulo si trova nella sidebar ma non è questo il punto: è situato nella parte alta del sito. Questi, comunque, sono gli elementi della testata che dà il benvenuto al lettore.
Poi ci sono gli elementi che caratterizzano il contenuto: headline, sottotitolo, immagine, primo paragrafo, elementi di connessione. Qui si concentra l’attenzione.
Dai il massimo sull’headline
Il titolo del post è l’elemento decisivo perché raccoglie la promessa che fai al lettore. Dai il massimo in questa fase perché le persone leggono il titolo e decidono. Spesso vanno oltre e condividono l’articolo solo grazie all’headline. Il grafico di The Verge:
Sull’asse verticale c’è la percentuale dei visitatori che condivide, su quella orizzontale il tempo trascorso sulla pagina. Cosa capisci? Le persone condividono all’inizio.
Ovvero quando ancora non hanno letto. Quindi è decisivo mettere i pulsanti di condivisione social above the fold, vicino al titolo. Ma devi anche curare l’headline, e fare in modo che sia potente, interessante. Le caratteristiche:
- Informativa.
- Emotiva.
- SEO friendly.
Il titolo deve informare, deve essere chiaro e diretto. Niente giri di parole o tentativi di fare click baiting selvaggio. D’altro canto, però, l’headline deve essere in grado di attirare l’attenzione con elementi persuasivi.
Nel frattempo deve soddisfare le esigenze di una ottimizzazione SEO on-page, e incontrare le richieste del tag title. Detto in altre parole, ecco cosa leggere:
L’aspetto da considerare: su WordPress puoi creare un titolo per l’above the fold e uno per la serp. Il primo è il tag H1, quello che puoi inserire nel primo spazio che trovi quando crei un post. Il secondo è il tag title, uno degli elementi che fanno la differenza in termini di copywriting e di ottimizzazione SEO.
Non dimenticare il sottotitolo
Dopo il titolo c’è il sottotitolo. Non sempre è presente, molti temi WordPress non hanno la possibilità di aggiungere il sottotitolo al post. Ma non è un problema.
Però ci sono dei plugin che risolvono il problema: il sottotitolo è decisivo perché consente di approfondire e di accompagnare il lettore dal titolo al primo paragrafo.
Il sottotitolo è uno snodo, un testo più dettagliato dell’headline ma ancora abbastanza snello e generico. Per i motori di ricerca si parla di meta description, elemento chiave per il CTR da monitorare con la search console.
Aggancia con il primo paragrafo
C’è un blocco di testo importante: primo paragrafo. Questo è il punto chiave dell’articolo, uno dei passaggi che determina il successo o l’insuccesso del lavoro svolto. Perché il primo paragrafo fa parte dell’area ottica centrale per l’uomo.
Se dai uno sguardo a questa immagine di vanseodesign.com capisci che l’attenzione del lettore si concentra in alto a sinistra. Proprio dove si trova il già citato titolo e il primo paragrafo. Cosa devi fare per ottimizzare questo step?
Usa questo blocco di testo per spiegare alle persone cosa c’è nell’articolo, cosa si trova e cosa possono scoprire i lettori quando continuano a leggere.
Ecco la piramide rovesciata: usa i contenuti più rilevanti all’inizio del post. Spiega qual è l’argomento più sostanzioso, indica il centro dell’articolo. Ma soprattutto devi spiegare perché è così rilevante il tuo lavoro: sottolinea sempre i tuoi benefit.
Tutto questo deve essere accompagnato da un linguaggio semplice, dei paragrafi semplici e snelli, una formattazione non pesante e invadente. Qui devi essere chirurgico, il primo paragrafo è un capolavoro di equilibrio e buon senso.
Scegli un buon visual
Ogni articolo nell’above the fold deve avere minimo una foto, e la più importante si trova all’inizio. Nella prima schermata del post. Anche in questo caso posso elencare una serie di elementi utili ti consentono di scegliere la migliore immagine.
- L’immagine occupa la larghezza del post.
- Scegli un visual di qualità.
- Deve essere bello ma leggero.
- Punta sull’ottimizzazione SEO dell’immagine.
Usa immagini belle ma leggere, non puoi appesantire il caricamento della pagina. Per questo ti consiglio i migliori strumenti per alleggerire immagini online e i plugin WordPress per comprimere le foto. Hai 10 secondi per colpire il lettore?
La pagina deve caricarsi nel minor tempo possibile: non dipende solo dalle immagini, questo è vero, ma il visual ha un ruolo decisivo in questo equilibrio.
Ovviamente il concetto dei 10 secondi è relativo: oggi si parla di N secondi, nel senso che la decisione avviene anche prima. Spesso bastano 3 secondi per decidere tutto, ecco perché è ancora più importante lavorare su questi punti.
Elementi di connessione
Ecco le particelle di testo che consentono di spingere il lettore verso il cuore dell’articolo. Se il primo paragrafo è perfetto per agganciare il lettore, quelli successivi devono anche proporre un continuo, un percorso per arrivare alla fine del tuo contenuto. E mi sembra il minimo per celebrare il lavoro svolto.
Le persone non leggono dall’inizio alla fine ma saltano da un punto all’altro. E tu devi essere in grado di agevolare la continuità della fruizione. Proprio come suggerisce questa immagine di Steve Krug sul libro Don’t Make Me Think.
Io di solito lavoro con lo storytelling: spiego lo stato attuale della situazione, individuo un problema e inizio a lanciare una serie di stimoli che acutizzano la situazione.
E che il pubblico identifica come elementi da risolvere. A questo punto propongo la soluzione: leggi il mio articolo. Ci sono diversi modi per iniziare un articolo, ma questo è uno di quelli che preferisco: è completo ed efficace.
Sono importanti anche le parole che usi per guidare il lettore. Ad esempio puoi usare le domande per attirare la curiosità, per coinvolgere il pubblico online.
Devi portarlo allo stesso livello dell’autore. Qualche esempio concreto: sei d’accordo? Proseguiamo? Vuoi scoprire come? Continua a leggere per scoprirlo. Questi elementi possono fare la differenza e lavorare a favore del tempo trascorso sul post.
Da leggere: immagini gratis per il tuo blog
Tu cosa fai per migliorare?
Esatto, adesso la domanda tocca a te: tu come migliori la sezione above the fold? In questo articolo trovi i passaggi che metto in pratica ogni giorno per migliorare la parte superiore degli articoli. Ma adesso voglio la tua opinione.
Qual è la tua esperienza personale: lasciala nei commenti, come sempre. Secondo te è possibile e necessario ottimizzare l’above the fold di ogni risorsa? Ti aspetto.
Categoria: Ottimizzazione siti
Ottimo articolo, come sempre. Ritengo anch’io che sia fondamentale catturare subito l’attenzione. Molti sbagliano riempiendo di immagini i propri articoli ma, così facendo, rischiano solo di allontanare l’utenza.
Piccola curiosità: qual è il plugin per i sottotitoli che tu utilizzi sul tuo wordpress?
Grazie in anticipo
Ciao! In effetti le immagini possono diventare facilmente un ostacolo alla lettura. Da mettere solo quando servono. Non uso plugin per questo, preferisco usare i campi personalizzati di WordPress.
Ciao Riccardo! Sai che non metto mai il sottotitolo? Forse dovrei fare una prova. Grazie!
Fondamentale. Può fare la differenza per dare al lettore delle informazioni in più.