Un semplice trucco tipografico per aumentare la leggibilità del testo fino al 30%
Il cuore della tipografia è costituito da due cose: la leggibilità, che riguarda le lettere, le parole e le frasi distinguibili; e leggibilità che si occupa di quanto sia facile per il cervello convertire questi elementi in un messaggio coerente.
Ti sei mai trovato a leggere una singola riga di testo due volte, come se si trattasse di due righe, soprattutto quando i tuoi occhi sono stanchi? Succede perché l'occhio si perde nel suo viaggio da destra a sinistra (o da sinistra a destra, a seconda della lingua) dalla fine di una riga all'inizio della successiva. È il motivo per cui i bambini tracciano linee con le dita quando gli viene insegnato a leggere.
Ci sono alcune cose che i tipografi possono fare per prevenire il problema, e sono particolarmente importanti in grandi quantità di testo del corpo, come notizie o blog: in primo luogo, assicurati che i tuoi personaggi non siano troppo alti, più l'occhio deve viaggiare, maggiori sono le sue possibilità di perdersi; in secondo luogo, consideriamo un font serif, la maggiore impressione orizzontale crea una maggiore distinzione visiva tra le righe di testo e lo spazio bianco, con lo stesso ruolo del dito del bambino di cui sopra; infine prestate molta attenzione alla vostra guida, una maggiore interlinea spacing crea canali più chiari per il vostro occhio da seguire.
Oltre a questo consiglio tradizionale, è stata scoperta una nuova tecnica. Lettore BeeLine è un nuovo affascinante plugin per Chrome che dimostra come funziona.
BeeLine Reader aggiunge una sfumatura di colore a linee di testo, rendendo più facile per l'occhio la transizione dalla fine di una riga all'inizio della successiva. Stanford University ha effettuato un test utilizzando il plugin e ha concluso che BeeLine Reader ha comportato un aumento medio della velocità di lettura del 10%; il sito del plugin afferma che un lettore esperto subirà un aumento del 25-30%.
Dovresti essere in grado di leggere il testo sulla destra molto più velocemente del testo a sinistra.
Mentre non posso dire di approvare il plugin che impone il testo in una singola colonna, o dei colori che hanno usato (brutto per la maggior parte e inutile per chiunque abbia la persistenza dei colori protanopica), il principio è valido. C'è un esempio in scala di grigi sul sito di BeeLine Reader che migliora la leggibilità, ma non viola il marchio di nessuno. Una rapida prova della loro test di lettura, ho mostrato un miglioramento del 22% utilizzando la versione grigia.
Sebbene non esista un modo semplice per implementare questo tipo di design in CSS semplice, è possibile codificarlo come dimostra il plug-in.
Se stai progettando grandi quantità di testo in esecuzione - specialmente se altri punti di contatto ti costringono a utilizzare colonne troppo larghe o troppo piccole - considera di applicare questa tecnica per compensare.
Cosa ne pensi della tecnica di BeeLine Reader? Come ti sei comportato nel loro test di lettura? Fateci sapere nei commenti.
Immagine in primo piano / miniatura, immagine a colori via Shutterstock