Quando si legge una pagina web, di solito la si scansiona molta velocemente per vedere se è utile approfondire la lettura o se invece è meglio abbandonarla senza sprecare ulteriore tempo (come abbiamo visto nel precedente post). Se, però, nella pagine si trovano degli elementi che attraggono lo sguardo – e che, nello stesso tempo, forniscono un indizio sul contenuto – allora lo sguardo troverà dei punti naturali dove soffermarsi per cercare indizi sulla pertinenza del testo rispetto a quello che si sta cercando. 

I principali elementi che attraggono lo sguardo sono:

• titolo della pagina e sottotitoli
• parole scritte in grassetto 
• parole sottolineate (come possono essere i link)
• parole con un colore diverso da quello del testo 
• punti elenco.

Vediamoli più in dettaglio, facendo riferimento alla più completa indagine eseguita su questo argomento: How People Read on the Web, di Pernice K., Whitentont K. e Nielsen J., Nielsen Norman Group (2012).

 

Titolo della pagina e sottotitoli

Il visitatore ricerca per prima cosa il titolo della pagina, dato che questo per lui rappresenta un forte indizio di tutto il contenuto della pagina. Se il titolo corrisponde al link su cui  ha cliccato per arrivare qui, tanto meglio. Nel 53% dei casi, le persone dirigono lo sguardo sul titolo (fig. seguente).

 

La percentuale può sembrare più bassa di quanto ci si potrebbe attendere, ma bisogna considerare che comprende le visite ripetute compiute dai visitatori che, chiaramente, quando ritornano difficilmente vanno ad osservare nuovamente il titolo. 

Le persone sono poi attratte dai sottotitoli che dividono le sezioni di una pagina. In questo caso, la maggior parte delle persone muove lo sguardo secondo quello che è stato chiamato il modello “torta a stratti” (layer cake). In questo modello, lo sguardo si sofferma quasi esclusivamente sui sottotitoli prima di scegliere quale sezione leggere, formando delle linee orizzontali che ricordano una torta a strati (fig. seguente). 

 

 

In questo modo, il lettore ottiene solamente delle informazioni molto limitate, ma sufficienti per valutare quale sezione di testo dovrebbe leggere, esplorare o ignorare. 

La lettura a strati è favorita – oltre che dai titoli – anche dagli spazi vuoti che separano le sezioni, rendendo più facile la loro individuazione e favorendo la lettura. 

Osservate la fig. seguente, che visualizza i movimento dello sguardo di una persona che è interessata all’argomento della pagina, senza però aver niente di specifico in mente.

 

Come si può notare, il lettore esplora la pagina secondo il modello a strati, senza soffermarsi in nessun caso sul testo delle singole sezioni, ma solo sui sottotitoli.

Questa chiara suddivisione in sezioni aiuta il lettore a decidere che cosa dovrà leggere subito dopo o se dovrà lasciare la pagina, in quanto non è interessato.

Il modello a strati suggerisce che il lettore si sofferma sui titoli. Mentre osserva i titoli, il lettore però può fissare lo sguardo all’interno del testo posto sotto di essi se trova qualche elemento che risalta rispetto al resto del testo. Badate bene: non legge il testo – almeno, non ancora – ma solo alcune particolari parole.

Osserviamo, ad esempio, la fig. seguente: 

 

 

Il titolo e i sottotitoli sono ben evidenziati – scritti in grassetto e con caratteri più grandi di quelli utilizzati nel testo. Di conseguenza, lo sguardo si focalizza su questi elementi (fig. seguente).

 

Gli occhi, dopo essersi soffermati sul logo e sul banner (sinistra) e sull’immagine (destra), si concentrano sul titolo: questa prima occhiata conferma che probabilmente la pagina merita di essere esaminata più a lungo. 

Di conseguenza, ecco che lo sguardo si concentra sui sottotitoli e solo su questi: in questo modo, il lettore ottimizza lo sforzo e cerca di capire dove potrebbe trovarsi l’informazione che sta cercando. Questa rapida esplorazione sui sottotitoli gli fa capire su quali sezioni del testo dovrebbe soffermarsi (fig. seguente). 

 

 

Alla fine, l’utente trova l’informazione che stava ricercando e legge completamente una sezione (fig. seguente). 

 

Quest’ultimo esempio illustra molto bene come di solito ci si muove quando una parte del testo ci interessa e quando esiste una buona divisione in sezioni, con sottotitoli ben evidenziati. 

 

Parole scritte in grassetto

Le parole scritte in grassetto attirano l’attenzione. 

Osservate questa pagina: 

 

 

Nella fig. seguente, osserviamo come le persone saltino i due paragrafi introduttivi e si soffermino sulla frase scritta in grassetto, leggendone tutte le parole.

 

 

Le parole in grassetto sono un fortissimo elemento d’attrazione e, per questo motivo, dovrebbero essere utilizzate per evidenziare le frasi più importanti del testo.

 

Parole con un colore diverso da quello del testo

Osserviamo la fig. seguente. 

 

 

Come si può notare è una terrificante pagina con un unico blocco di testo. Probabilmente verrebbe subito abbandonata, se non contenesse un grande richiamo: parti di testo colorate (in questo caso, di rosso). 

Di conseguenza, il lettore esplora prima i primi tre paragrafi (fig. seguente). Poi, decide di non abbandonare la pagina: è attratto dalle frasi in rosso del quarto paragrafo. Dà poi una rapidissima occhiata al quinto paragrafo e si sofferma più a lungo sul sesto paragrafo, attratto ancora una volta dalle frasi in rosso. 

 

 

Stesso discorso più avanti. Il lettore è attratto dalle frasi in rosso del nono paragrafo, mentre non presta quasi nessuna attenzione al settimo e all’ottavo paragrafo, che sono scritti nel testo normale, senza parole evidenziate.

 

Parole sottolineate, come i link

Osservate la fig. seguente, solo testo, ma con paragrafi ben spaziati. 

 

 

All’interno di sette dei nove paragrafi ci sono dei link di testo. Sono presentati in blu e sono sottolineati, cosa che crea un contrasto con il resto del testo. 

In questo modo, i link aiutano i lettori ad esplorare la pagina, piuttosto che a leggere tutta la pagina. Agiscono come se fossero dei titoli.

Nell’immagine che segue si può osservare come il lettore inizialmente esamini i primi due paragrafi. Nel terzo paragrafo, guarda principalmente il link ed il testo tra parentesi. Nel quarto, quinto e sesto paragrafo guarda esclusivamente i link.

 

 

 

In definitiva, il lettore utilizza i link per capire di cosa parla la sezione. Dopo che ha compiuto questa esplorazione, si sofferma sull’area che gli interessa (fig. seguente).

 

In questi casi, le persone usano i link al posto dei titoli, per trovare un senso all’argomento della sezione di testo.

 

Punti elenco

Gli elenchi puntati sono un elemento che attira fortemente l’attenzione del lettore. Gli occhi si concentrano frequentemente su di essi. Il 70% delle volte vengono visti (fig. seguente).

 

Nella fig. seguente, l’utente legge prima i titoli, poi salta ad osservare le tre voci dell’elenco puntato.

 

La fig. seguente ci fa invece vedere come, pur se i tre punti elenchi attirino lo sguardo, le persone non leggono tutte le parole quando le linee di testo diventano più lunghe. Di conseguenza, è meglio usare poche parole per ogni punto. 

 

 

Conclusioni

Quando le persone arrivano su una pagina web tramite i motori di ricerca, di solito non la leggono subito, ma iniziano ad esplorarla, per cercare di capire se corrisponde a quello che stanno cercando. 

Di conseguenza, le pagine web devono essere progettate tenendo conto che le persone solitamente le esplorano e non le leggono subito.  

Nell’esplorazione, le persone ricercano degli elementi visivi che le aiutino a capire immediatamente se la pagina va bene. 

Come abbiamo visto, questi elementi visivi sono rappresentati da tutto quello che si stacca dal normale testo della pagina e che è ben caratterizzato: titoli, sottotitoli, parole in grassetto, parole sottolineate, punti elenco. 

Per questo motivo, dobbiamo organizzare il contenuto delle pagine del nostro sito con elementi visivi che consentano alle persone di comprendere rapidamente il contenuto della pagina, in modo che possano decidere se proseguire nella lettura oppure abbandonare la pagina. Senza esagerare, inserite quindi nel contenuto della pagina sottotitoli, parole o frasi in grassetto e/o con colore diverso da quello del testo, punti elenchi, eventuali link. Il tutto non deve appesantire il testo, ma renderlo solamente più piacevole e più efficace da scansionare e da leggere.