Come usare lo schema a F nel web design

Cos'è lo schema a F?

Alla fine dell'Ottocento, Louis Émile Javal scoprì per primo che, mentre leggiamo, gli occhi non si muovono in modo continuo lungo una riga di testo, ma fanno dei piccoli salti e si fermano in alcuni punti di ogni riga, chiamati fissazioni.

Facciamo un salto al 2006: uno studio della società di consulenza Nielsen-Norman Group ha scoperto che le persone non leggono le pagine web parola per parola, dall'inizio alla fine, ma le leggono seguendo uno schema a forma di F.

In questo modo di scorrere la pagina, la maggior parte delle fissazioni si concentra in alto e a sinistra. Gli utenti prima leggono con movimenti orizzontali, che formano le barre in alto della F, e poi scorrono il lato sinistro del contenuto con un movimento verticale, che forma l'asta della F.

Cosa significa questo schema:

• Le prime righe di testo di una pagina ricevono più fissazioni delle righe successive della stessa pagina.
• Le prime parole a sinistra di ogni riga ricevono più attenzione delle parole che seguono sulla stessa riga.

Perché le persone scorrono le pagine a forma di F?

Le persone scorrono una pagina a forma di F quando ci sono tutti e tre questi elementi:

1. La pagina contiene testo con poca o nessuna formattazione per il web. Per esempio, non ha sottotitoli, elenchi puntati o parti in grassetto, quindi forma un unico blocco di testo.
2. L'utente cerca di essere il più rapido possibile su quella pagina.
3. L'utente non è molto concentrato o interessato a leggere ogni parola.

Gli ultimi due elementi descrivono quasi tutto il comportamento sul web: la maggior parte degli utenti preferisce fare quello che deve nel modo più veloce e con il minimo sforzo. Di solito non vuole approfondire e preferisce trovare una risposta rapida.

Come usare lo schema a F nel web design

1. Dai priorità al testo e formattalo in modo da portare gli utenti verso quello che vuoi fargli vedere e verso quello che sai che vogliono vedere.
2. Metti i punti più importanti nei primi due paragrafi della pagina.
3. Usa titoli e sottotitoli. Fai in modo che gli utenti li riconoscano subito, rendendoli più importanti e più visibili del testo normale.
4. Metti le parole che danno più informazioni all'inizio dei titoli e dei sottotitoli. Gli utenti dovrebbero capire di cosa parla la sezione leggendo solo le prime due parole.
5. Raggruppa visivamente piccole parti di contenuto collegate tra loro: per esempio, puoi circondarle con un bordo o usare uno sfondo diverso.
6. Metti in grassetto le parole e le frasi importanti.
7. Fai in modo che i link contengano parole che danno informazioni (invece dei soliti "vai", "clicca qui" o "altro"). Questa tecnica aiuta anche gli utenti che ascoltano i link letti ad alta voce, invece di scorrere il contenuto con gli occhi.
8. Usa elenchi puntati e numerati per mettere in evidenza le voci di una lista o i passaggi di un processo.
9. Togli i contenuti che non servono.

Un esempio di design a F in pratica

Lo schema a F vale anche sui dispositivi mobili?

Alcuni commentatori citano uno studio di Google per sostenere che lo schema a F non vale sui dispositivi mobili. Questo studio si concentra sull'effetto dei risultati di ricerca che danno subito una risposta, quelli che arrivano da Knowledge Graph e Google Instant.

Visto che le persone ottengono la risposta senza cliccare su un link, il numero di clic non dice con precisione quanto gli utenti siano soddisfatti e quanto i risultati siano utili. Per questo i ricercatori hanno studiato dove guardavano gli utenti sullo schermo dello smartphone e hanno scoperto che:

"...il 68 per cento dell'attenzione va alla metà superiore dello schermo e l'86 per cento dell'attenzione va ai due terzi superiori dello schermo."

Questi risultati, però, valgono solo per le pagine dei risultati di ricerca e non per altri tipi di pagine. Quindi, per ora, lo schema a F vale ancora per la maggior parte dei contenuti web, qualunque sia il dispositivo.

Ma le cose stanno cambiando. Si stanno sviluppando nuove tecnologie che "permettono al testo di sapere se e come viene letto", unendo l'intelligenza artificiale alla tecnologia che segue il movimento degli occhi. Un testo che reagisce a come lo leggiamo potrebbe cambiare del tutto il nostro modo di leggere online.

Altri modi di scorrere una pagina

Lo schema a F non è l'unico modo in cui scorriamo una pagina. Ce ne sono molti altri, come quelli elencati qui sotto:

• Lo schema a torta a strati consiste nel leggere i titoli e i sottotitoli e saltare il testo normale che c'è sotto. La mappa di calore di questo comportamento sembra una torta a strati.
• Lo schema a macchie si ha quando gli occhi saltano grandi blocchi di testo e scorrono la pagina come se cercassero qualcosa di preciso, per esempio un link, dei numeri, una certa parola o un gruppo di parole con una forma particolare (come un indirizzo o una firma).
• Lo schema a segnalibro consiste nel tenere gli occhi fermi in un punto mentre il mouse o il dito fa scorrere la pagina. Succede più spesso sui dispositivi mobili che sui computer.
• Lo schema a salto consiste nel saltare le prime parole di una riga quando più righe di un elenco iniziano tutte con la stessa parola o con le stesse parole.
• Lo schema dell'impegno si ha quando le persone guardano quasi tutto quello che c'è nella pagina. Succede quando sono molto motivate e interessate al contenuto. Però non capita spesso, perché la maggior parte degli utenti scorre la pagina velocemente.

Conclusione

Il modo in cui scorriamo le pagine web dipende da:

• La motivazione dell'utente
• Gli obiettivi che vuole raggiungere
• Il layout della pagina e la formattazione del testo
• Il contenuto della pagina

La motivazione e gli obiettivi delle persone sono difficili da controllare, ma il contenuto e il modo in cui viene presentato si possono migliorare, così gli utenti trovano subito quello che cercano. Visto che le persone scorrono le pagine a forma di F, possiamo usare tecniche di formattazione che seguono questa forma per attirare l'attenzione sulle informazioni più importanti, invece di affidarci alle parole a caso su cui gli occhi si fermano mentre scorrono il contenuto.