Above the Fold: Il Segreto delle Conversioni (e della SEO)

Autore:

|

Data:

|

Home » Blog » Above the Fold: Il Segreto delle Conversioni (e della SEO)

Sai cosa si intende per Above the Fold? Sia che la tua risposta sia no che sì, leggi questo articolo perchè non hai fatto questa ricerca per caso, ti aiuteerà.

La parte Above the Fold, sezione pre-scrolling, è il biglietto da visita per il tuo sito, una parte del portale che potrebbe subito affascinare gli utenti e spingerli a voler esplorare meglio le varie pagine web. Qui entra in gioco l’importanza delle unità di misura relative nel web design, come “vh” (viewport height).

Quest’area del sito è importante per l’esperienza utente e per le conversioni (il fatturato) ma non solo: potrebbe avere ripercussioni lato SEO, quindi non devi affatto sottovalutarla. Cosa devi sapere sull’Above the Fold? Come puoi ottimizzare questa parte del sito? Facciamo insieme una panoramica, così che tu possa avere un quadro completo e comprendere quali sono i passaggi da fare per ottenere un sito di alta qualità, migliore rispetto ai tuoi competitor.

Above the Fold cosa significa

Ti porto in un piccolo viaggio immaginario. Oggi sto pensando di comprare una giacca nuova. Sblocco la schermata del mio cellulare, entro su Google e avvio la ricerca per “giacca donna alla moda 2025”. I primi risultati della SERP sono dei rich snippet, che mi mostrano una piccola foto della giacca, il prezzo, il sito, ecc. Clicco sul risultato di mio gradimento e si apre la pagina prodotto. Quello che vedo ora è l’Above the Fold di quella pagina prodotto, e sarà un elemento determinante nella mia decisione di acquistare o meno la giacca, oltre, naturalmente, al fatto che il prodotto mi piaccia o meno.

La traduzione letterale di Above the Fold è “Sopra la piega”: indica quell’area del sito web che un utente vede appena atterra su una pagina, senza aver bisogno dello scrolling. Ecco perché prima abbiamo definito questa sezione il biglietto da visita del sito, perché è la parte “d’impatto” che l’utente nota una volta visitato il tuo portale. 

La sua importanza è fondamentale: se un utente trova interessante l’Above the Fold, allora sarà spinto a leggere anche i contenuti “Below the Fold”, vale a dire quelli in bassi e che compongono in gran parte la pagina web. 

Inoltre, l’Above the Fold potrebbe anche essere utilizzato per far compiere delle azioni ai visitatori, attraverso il piazzamento strategico delle Call to Action (invito all’azione, pulsanti, elementi cliccabili). In alternativa, potrebbe stimolare la curiosità per portare l’utente a visitare altre sezioni del tuo sito. 

Ricorda che la soglia d’attenzione degli utenti del web è davvero bassa: secondo alcuni esperti è di circa 8 secondi. Dunque, è proprio in questo minimo lasso di tempo che “si gioca la partita”: dovresti impegnarti per rendere l’Above the Fold in grado di attrarre subito l’attenzione, senza annoiare il visitatore. 

processo di design above the fold

Le Unità di misura vh e vw

Nel web design, “vh” rappresenta l’altezza della finestra del browser in percentuale. 1vh equivale all’1% dell’altezza totale della viewport, quindi 100vh riempie esattamente lo schermo visibile in altezza. C’è naturalmente anche la misura della larghezza con 100 vw (viewport width). Queste unità si assicurano che la sezione Above the Fold occupi sempre lo spazio desiderato, indipendentemente dalla dimensione dello schermo dell’utente.

Utilizzare vh e vw permette di creare un layout più fluido e coerente su desktop e mobile, evitando problemi come contenuti tagliati, spazi vuoti indesiderati o scroll laterale. Impostando l’altezza dell’Above the Fold a 100vh e la larghezza a 100vw, puoi essere sicuro che l’utente vedrà sempre gli elementi più importanti della pagina senza bisogno di scrollare. Detta così sembra facile vero? Beh, per i tech-savvy come noi, lo è. Ti lascio il link sulle unità del CSS di W3C per approfondire l’argomento.

come puoi ottimizzare la sezione Above the Fold

Oltre a essere un elemento utile per la UX (User Experience), l’Above the Fold potrebbe contribuire anche alla SEO on-page. Dunque, come puoi ottimizzare tale sezione del sito web sotto questo punto di vista? 

Il primo è il contenuto principale che dovrebbe essere intrigante e adatto alle keyword primarie. Gli utenti notano sempre il contenuto che si trova nell’Above the Fold, trascorrendo circa il 57% del tempo di visualizzazione della pagina sopra la piega e il 74% nei primi due schermi, fino a 2160 pixel secondo uno studio del NN Group

Il secondo fattore che dovresti considerare è l’esordio della pagine che dovrebbe essere avvincente e spingere un utente all’azione. Ecco perché potresti considerare di inserire in questa porzione una CTA. 

Ricorda di ottimizzare anche le immagini presenti in questa sezione del sito. Queste ultime dovrebbero essere di dimensioni appropriate e di buona qualità. Attenzione anche ai loghi che per un’ottimizzazione eccellente dovrebbero essere in formato SVG, quello ideale per i vettoriali. 

Above the Fold nella SEO

Analizzando maggiormente l’argomento Above the Fold in SEO, ci sono ulteriori aspetti che dovresti ricordare. 

L’Above the Fold è uno dei fattori indiretti per il ranking Google. Dunque, dovresti valutare alcune caratteristiche. Per esempio, gli elementi in questa sezione dovrebbero caricarsi molto velocemente e non intasare la pagina web. 

Il font dovrebbe essere leggibile da qualsiasi dispositivo e delle dimensioni appropriate, permettendo all’utente di visionare il contenuto senza problemi. Ovviamente, ancora una volta dovresti ricordare di sistemare anche l’aspetto grafico delle immagini, formato e dimensioni. 

A proposito di dimensioni, solitamente quelle che suggeriamo per l’Above the Fold sono 1024×786. Per le immagini, potresti anche pensare di usare il summenzionato formato SVG per i loghi o le icone, mentre convertire le jpg in WebP per migliorare velocità di caricamento e diminuire il peso. 

Quando si parla di SEO copywriting e di strategie di marketing per l’Above the Fold, ricorda poi di mostrare una qualità imprescindibile se vuoi avere successo: la coerenza. Suggeriamo di mostrare per ogni pagina un Above the Fold che sia coerente con lo stile usato e con la tua identità. In questo modo, potresti creare brand awareness

Above the Fold per il cellulare

Come controlliamo dell’Above the Fold per Mobile? Implementa una struttura del tuo sito mobile-friendly. Se usi WordPress, i temi più recenti e popolari hanno già questa funzionalità programmata. Il tema si adatta alle dimensioni e alla tipologia di dispositivo utilizzato dall’utente per atterrare sul sito. I migliori SEO specialist consigliano di curare sempre la responsiveness, così da rimanere in linea con l’algoritmo di Google e il suo crawler, in continuo mutamento. 

Da qualche anno Google ha implementato il sistema di indicizzazione Mobile-First indexing. Dunque, dovresti sapere che il tuo sito dovrebbe essere pensato primariamente per la visualizzazione su dispositivi mobile. Ccurare l’Above the Fold per una corretta visualizzazione su smartphone o tablet aumenta le possibilità di convertire una grossa porzione di traffico.

Above the Fold plugin WordPress, i migliori per ottimizzarlo

A proposito di WordPress, il CMS più famoso al mondo offre diverse opzioni per ottimizzare l’Above the Fold delle pagine web. Infatti, su WordPress è possibile installare svariati plugin che permettono di fare proprio questo. Se vuoi sapere di più sulle strategie SEO per WordPress non perderti assolutamente l’articolo.

Quali sono i migliori? Alcuni dei plugin WordPress migliori per curare la zona Above the Fold sono:

  • Hummingbird Performance: un plugin che ti permette di migliorare la velocità delle pagine e di ottimizzare il caricamento dell’Above the Fold;
  • PageSpeed Ninja: anche questo plugin per WordPress potrebbe essere utilizzato per l’Above the Fold. In particolare, con quest’elemento aggiuntivo potrebbe essere possibile modificare il formato delle immagini e ridurre i tempi di caricamento, un grande vantaggio in termini SEO;
  • NitroPack: altro plugin che puoi considerare per l’installazione, così da ottimizzare le prestazioni, il font e il formato delle immagini per l’Above the Fold. Puoi anche modificare il CSS e i codici per migliorare altri aspetti del tuo sito. 

In linea di massima, i plugin menzionati sono semplici da utilizzare e potresti sperimentare le loro funzioni anche se non hai molta dimestichezza con gli strumenti web. Tuttavia, se non ti senti sicuro, non provare a modificare il tuo sito: potresti commettere qualche errore e penalizzare il tuo portale. 

Dunque, chiedi aiuto a un esperto SEO che può aiutarti con l’Above the Fold optimization e può fare per te un’analisi ROI SEO per comprendere dove migliorare. 

Gli elementi da inserire in questa sezione

Per fare un riassunto inerente all’ottimizzazione della zona Above the Fold, ecco quelli che sono gli elementi che non dovrebbero mai mancare in questa sezione: 

  • Header: sezione principale in alto che dovrebbe contenere il nome del sito, così da identificare la tua identità e la tagline, ovvero quello che prometti agli utenti atterrati sulla pagina;
  • Headline: è il titolo della pagina, quello che può fare la differenza sulla curiosità del lettore, spingendolo a esplorare ulteriormente il contenuto “below the fold”;
  • Sottotitolo: non tutti lo mettono e in effetti è opzionale. Tuttavia, potrebbe accompagnare il lettore nella lettura del primo paragrafo;
  • Elemento visual: un’immagine ottimizzata secondo le regole dette in precedenza, rispettando i consigli SEO per un caricamento veloce della pagina.

Above the Fold per ecommerce, quali elementi mettere in primo piano?

Se hai un ecommerce, dovresti curare maggiormente l’Above the Fold e cercare di considerare alcuni aspetti importanti. Difatti, con un sito simile, dovresti creare un Above the Fold che ti permetta di ottenere maggiori conversioni, limitando il tasso di rimbalzo. 

Come puoi fare ciò? Ci sono delle strategie che potresti applicare. Nel dettaglio, l’Above the Fold del tuo sito e-commerce dovrebbe portare l’utente a:

  • Visitare una determinata categoria del sito: scoprendo di più su tutti quei prodotti che si trovano all’interno della categoria;
  • Acquistare un prodotto in sconto: magari proponendo articoli scontati a causa di un periodo speciale come quello dei saldi o del Black Friday;
  • Comprendere quali sono i vantaggi dell’e-commerce: l’utente dovrebbe riuscire a comprendere quali sono i benefici che potrebbero esserci decidendo di acquistare sul tuo e-commerce, evitando di visitare altri risultati, limitando di conseguenza il tasso di rimbalzo. 

Ovviamente, valgono le regole per tutti gli altri siti web. Ciò significa che non dovrebbe mancare un heading chiaro e che rispecchi le keyword primarie del sito. Se non sai come utilizzare le giuste keyword, potresti richiedere un Audit SEO che ti permetta di comprendere esattamente le parole chiave da usare per ottimizzare le pagine dell’e-commerce, guadagnando posizioni su Google e su altri motori di ricerca. 

Pulsanti social, una risorsa da inserire in “alto”?

Che dire poi dei pulsanti social? Anche questi elementi dovrebbero essere inseriti nella zona pre-scroll dello schermo. Sono diverse le ragioni per le quali dovresti pensare di inserire le icone social in quest’area del tuo sito.

In primo luogo, fanno comprendere ai visitatori la presenza sui social del tuo brand. Indirettamente, potresti ottenere nuovi follower, così da aumentare la community di utenti che ti segue ed è interessata ai contenuti che proponi. 

Inoltre, i pulsanti social potrebbero invogliare gli utenti a condividere un contenuto o un prodotto che hanno trovato interessante. Di conseguenza, ciò potrebbe aumentare la visibilità e farti mettere in contatto con altri utenti in modo indiretto. 

Comunque, quando si parla dei social buttons nell’Above the Fold, ricorda che dovresti sempre rispettare le direttive per gli altri elementi in questa sezione. Dunque, i pulsanti dovrebbero essere visibili, si dovrebbero adattare ai colori e allo stile grafico del tema che hai scelto, senza risultare invadenti o fastidiosi per gli utenti. 

Potresti utilizzare anche diversi plugin per ottimizzare al meglio i pulsanti social nel caso il tuo sito sia su WordPress, posizionandoli nell’Above the Fold in modo perfetto per le tue esigenze. 

Curare l’Above the Fold Nelle email

La zona a prima vista nel sito web è fondamentale come abbiamo ampiamente discusso, ma non si trova solo nei portali online. Per questa ragione, è importante fare una piccola digressione. Difatti, questa sezione potrebbe essere definita come il cuore pulsante delle email marketing

Anche nelle email c’è la sezione Above the Fold, in cui dovrebbero essere inseriti gli elementi essenziali per spingere un utente a compiere un’azione. Se l’Above the Fold nel design della newsletter è debole, allora la tua campagna di email marketing potrebbe avere scarsi risultati. 

Se vuoi realizzare delle campagne DEM (Direct Email Marketing) efficaci, allora dovresti ricordare di curare al massimo almeno tre fattori ovvero: 

  • Design mobile responsive: ancora una volta è importante creare una mail con un Above the Fold che si adatti al dispositivo dell’utente;
  • Design modulare: il messaggio mail dovrebbe essere facile da leggere e pratico anche per coloro che non vogliono dedicare molto tempo alla lettura;
  • Call to Action: l’elemento che spinge l’utente a compiere l’azione.

Tutti questi elementi sono importanti, ma consigliamo di scegliere sempre la giusta Call to Action. Come detto anche prima, la soglia di attenzione degli utenti è molto breve e una CTA adeguata potrebbe subito spingere i potenziali lettori a compiere un’azione, catturando la loro curiosità. 

La soluzione per l’ottimizzazione sicura di questa sezione: ecco cosa fare

Ti abbiamo mostrato l’importanza dell’Above the Fold nel tuo sito web. Hai visto come quest’elemento possa essere davvero vantaggioso se sfruttato nel migliore dei modi, attirando gli utenti a volerne sapere di più sul tuo sito, esplorando i contenuti below the fold. 

Comunque, se vuoi una soluzione concreta, che possa ottimizzare gli elementi dell’Above the Fold e darti un costante controllo sulla personalizzazione del tuo sito, richiedi una consulenza, offriamo un servizio di ottimizzazione seo continua che potrebbe interessart.

Siamo a tua disposizione per aiutarti a migliorare il sito, inserendo nell’Above the Fold gli elementi che possano rendere unico il tuo portale e ottimizzare il tutto per conquistare le prime pagine nei principali motori di ricerca. Possiamo anche aiutarti se vuoi lanciare una campagna mail e personalizzare l’Above the Fold nei messaggi da mandare ai potenziali clienti.

Contattaci ora e ti offriremo una prima consulenza gratuita, così da mettere le basi per una strategia vincente che possa portarti ad avere un Above the Fold, originale, efficiente e performante. 

Pubblicato da

in

Potrebbe interessarti Anche:

Lascia un commento

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

MODULO DI contattO

Compila il modulo senza impegno. Riceverai una pre-analisi gratuita e una strategia mirata per crescere il tuo business.