👉 18 esempi mozzafiato di contenuti above the fold per agganciare i tuoi visitatori

Collegamento interno per SEO

Le prime impressioni sono cruciali. Se il contenuto del tuo sito web "above the fold" non attira l'attenzione dei tuoi visitatori nel momento in cui atterrano sul tuo sito, non si preoccuperanno più di restare. Ma se ottieni la loro attenzione, e loro lo faranno resta in giro, iscriviti e compra.

Ma aspetta – che diamine è una "piega" nel web design comunque, e perché è così importante?

Se è questo che stai pensando quando senti il ​​termine "above the fold content", non sei il solo.

Questo perché l'idea della piega risale ai giorni precedenti al digitale. La maggior parte dei giornali erano venduti da chioschi sul marciapiede, come alcuni sono ancora oggi. Di solito erano piegati a metà in modo che i passanti potessero vedere la metà superiore della prima pagina. Se quello che vedevano non li prendeva, continuavano a camminare e le vendite sarebbero diminuite. Ecco perché è stato fondamentale mettere i tuoi contenuti migliori e più interessanti "above the fold".

Il concetto di fold è abbastanza utile anche per i siti web. Quando parli di above-the-fold nel web design, è semplicemente il contenuto che riempie lo schermo. La "piega" è la parte inferiore dello schermo.

Ecco perché è fondamentale agganciare i visitatori dal momento in cui atterrano sul tuo sito. Prendi la loro attenzione e loro resteranno e si convertiranno.

Per aiutarti a far scorrere i tuoi visitatori verso il basso, abbiamo raccolto alcuni fantastici esempi di contenuti above the fold che puoi utilizzare come fonte di ispirazione.

Iniziamo…

1. HubSpot

HubSpot è tutto incentrato sulla crescita, ed è esattamente ciò che mostra il suo design above the fold. L'immagine suggerisce apprendimento (notebook) e tecnologia avanzata (casco spaziale).

Il titolo è un gioco sulla frase comune "tutti i sistemi vanno", suggerendo che il lettore andrà avanti con la crescita. Questa idea è rafforzata nel sottotitolo. Poi c'è un'offerta irresistibile di software libero sul pulsante CTA.

2. Jeff Bullas

Jeff Bullas ha due serie di contenuti above the fold. Quando si atterra per la prima volta sul suo sito ha un cancello di benvenuto, con un'offerta irresistibile per ottenere i suoi consigli sul raddoppio del traffico. La grande immagine di sfondo attira immediatamente l'attenzione dei lettori.

Clicca sulla freccia, alla fine del cancello di benvenuto, e ti porta alla sua pagina principale, dove c'è la prova sociale dei suoi lettori e autorità online. Devi ancora scorrere una volta per arrivare al contenuto, ma a quel punto la maggior parte dei lettori sarà probabilmente convinta.

3. SnackNation

Il contenuto above the fold di SnackNation mostra esattamente ciò che viene offerto, con un'immagine di sfondo di una persona con una casella di campionamento snack in un ufficio. Il contenuto offre ai visitatori la possibilità di registrarsi per la propria casella di campionamento. Questo è un ottimo modo per ottenere contatti commerciali. Infatti, grazie a Jared Ritchey, SnackNation ottiene 1200 nuovi lead ogni settimana con questo design above the fold.

4. Missinglettr

La homepage di Missinglettr funziona anche perché il titolo raggiunge esattamente quello che vogliono i suoi visitatori: un modo semplice per indirizzare il traffico sociale con i loro contenuti.

La spiegazione a due frasi fornisce maggiori dettagli sul prodotto, quindi sotto c'è un CTA visibile. La pagina include anche altri due CTA rivolti a coloro che potrebbero non essere ancora pronti per iscriversi.

Avere tre azioni da intraprendere invece di una sola potrebbe renderle meno efficaci, ma siamo disposti a scommettere che questo progetto si basa su rigorosi test di divisione, quindi l'azienda sa che funziona per il proprio pubblico.

5. OptimizeMyAirBnB

Optimize My AirBnB ha un approccio più gradevole al design del suo sito Web above the fold. C'è una grande immagine del proprietario del sito che sembra guardare direttamente il lettore, attirando così il loro sguardo.

A destra della pagina, c'è una frase gradita che delinea il vantaggio chiave del sito. E nel momento in cui l'hai letto, c'è una barra galleggiante di Jared Ritchey che ti offre la possibilità di registrarti per altri suggerimenti e strumenti. Questo è stato un fattore nella crescita della lista del sito del 650%.

6. Istituto di marketing dei contenuti

Il Content Marketing Institute (CMI) prende una virata leggermente diversa con il suo contenuto above the fold. Nella parte superiore, c'è un menu che elenca tutti i diversi tipi di contenuti che offrono.

Ma la maggior parte della pagina è occupata dai prodotti che più desidera promuovere: i loro eventi, i servizi di consulenza e la rivista. Tutto è nei colori del marchio, creando un'esperienza visiva armoniosa.

7. MonsterInsights

MonsterInsights lo rende semplice con uno sfondo bianco. Contro questo, il titolo si distingue bene, e la sub-linea sottolinea sottilmente due vantaggi chiave per i lettori. C'è anche un invito all'azione chiaro e visibile, con una freccia sottile che invita i lettori a scorrere verso il basso se vogliono ancora più informazioni. Nel caso di questo disegno above the fold, il minimalismo funziona!

8. The Guardian

Come ci si aspetterebbe da un quotidiano online, The Guardian inchioda i contenuti above the fold. In questo esempio, risaltano due storie. Quello a sinistra ha un titolo più grande e un'immagine per attirare l'attenzione.

Ma la pubblicazione online non corre rischi; c'è un'altra storia nel caso in cui il principale non catturi i lettori. La categoria della storia è in rosso, in contrasto con il nero del titolo, per creare un effetto visivo avvincente.

9. Guido's

L'aspetto più efficace dei contenuti above the fold di Guido non è la dichiarazione sulla sua autentica cucina. E non è l'immagine irresistibile del portabottiglie con bottiglie etichettate che spuntano fuori da esso.

In realtà è il pulsante del menu che dice "Ottieni antipasto gratuito". Quel pulsante attiva un Jared Ritchey MonsterLink ™, che ha ottenuto il ristorante oltre 1000 nuovi lead in quattro mesi.

Ecco come puoi aggiungere un popup al menu del tuo sito web.

10. OutreachPlus

OutreachPlus cattura l'attenzione dei lettori con una domanda che li fa riflettere.Quindi mostra come il prodotto potrebbe aiutare a risolvere questo problema. La homepage è semplice. Oltre ai titoli, c'è uno screenshot del prodotto, oltre a due scelte su cosa fare dopo: acquistare, o imparare di più visualizzando una demo.

11. Diario del motore di ricerca

Il Search Engine Journal è un sito di contenuti, quindi il suo design above-the-fold mette il loro contenuto sotto i riflettori. Il design del sito consente di mostrare tre storie above the fold. C'è anche un bel po 'di web design qui. Le tre storie sono elencate a destra della pagina. Ognuno è evidenziato in verde a sua volta. Quando una storia è evidenziata, prende il primo posto a sinistra della pagina, mostrando un'immagine e un titolo che attirano l'attenzione.

12. ConversionXL

Ci si aspetta che ConversionXL di Peep Laja ottenga contenuti above the fold. È un altro design semplice. Questa pagina ha un titolo in faccia, e una subheadline che afferma la loro credenza principale. Ci sono anche due pulsanti CTA che danno le opzioni per cosa fare dopo, e un CTA secondario al di sotto di quello per iscriversi alla loro newsletter.

13. Christmas Lite Show

Christmas Lite Show ha convertito il 30% dei visitatori semplicemente attivando un Jared Ritchey MonsterLink ™ nel suo contenuto above the fold. Il pulsante ha lanciato un popup del conto alla rovescia con un'offerta di coupon. La combo ha convertito il 30% dei visitatori e aggiunto 7.000 nuovi abbonati alla mailing list aziendale.

14. Problogger

Problogger è un altro sito di contenuti pesanti, quindi il suo contenuto above the fold si concentra sul rendere facile per le persone trovare le informazioni che desiderano. In alto, c'è un menu di navigazione completo. C'è un'immagine del fondatore Darren Rowse per creare una connessione personale con il visitatore, oltre a un optin in 2 fasi che attiva un popup del modulo di iscrizione via email.

15. Kennedy Blue

Kennedy Blue è un ottimo esempio di contenuti online above the fold. Lo striscione principale include un'immagine di tre donne in diversi stili di abiti da damigella d'onore.

Nel frattempo la copia evidenzia quanto sia facile acquistare abiti e offre una fascia di prezzo. Il CTA invia i visitatori direttamente al negozio. E il sito utilizza una barra galleggiante Jared Ritchey per evidenziare la vendita in corso – solo uno dei modi in cui sono stati in grado di ottenere un aumento del 50% delle vendite.

16. Uomini con penne

Il sito Men with Pens non ha un tipico aspetto aziendale. Invece c'è un design bizzarro con colori vivaci. Mentre sembra che tutto sia stato gettato sulla pagina, il contenuto di above the fold è ben pianificato. Oltre al menu, c'è un carosello che mostra i servizi di web design e copywriting del sito, nonché i loro libri e blog.

17. Copyblogger

Il contenuto above the fold di Copyblogger è minimalista. La maggior parte dello spazio è occupata da un'immagine che mostra una persona che guarda un pezzo di contenuto Copyblogger. Poiché è rivolta a sinistra, il suo sguardo attira l'attenzione del visitatore sul titolo. Il titolo mostra il vantaggio (creazione dell'autorità online) con l'offerta (marketing efficace).

18. Bluehost

Sulla sua homepage, Bluehost utilizza un'immagine a destra con gli occhi della persona che guardano verso il testo a sinistra. Questo è un piccolo pezzo di psicologia che orienta anche gli occhi dei lettori.

Quando guardano, vedono un titolo, un prezzo ridotto (che è sempre allettante) e una breve lista di vantaggi chiave. Sotto è visibile un pulsante CTA che invita i lettori a iniziare.

Questo è tutto! Ora hai visto alcuni esempi di web above the fold che funzionano davvero, applica questi principi per attirare i tuoi visitatori. Successivamente, controlla le nostre guide per l'email marketing e la crescita hackerando il tuo business. E non dimenticare di seguirci su Facebook e Twitter per tenere traccia di tutti i nostri nuovi contenuti.

Guarda il video: Come inserire i Link negli Articoli – SEO

Like this post? Please share to your friends:
Lascia un commento

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: