La leggibilità di un testo in una pagina web dipende da più fattori tra i quali i più rilevanti sono il tipo e la dimensione del font usato e la lunghezza delle righe.

Su alcuni manuali, il numero di caratteri massimo che consente una lettura agevole è pari a 75; questo valore non deve essere interpretato in maniera stringente ma costituisce un valido riferimento.

Aprendo la pagina con gli esempi creati su questo argomento, possiamo vedere innanzitutto l’Esempio 1 nel quale un contenitore avente larghezza 100% contiene testo che risulta difficilissimo da leggere a causa della lunghezza eccessiva della riga.

Utilizzando le proprietà: column-count, column-width e column-gap è possibile suddividere su più colonne il testo in un div.

L’Esempio 2 mostra lo stesso contenitore al quale è stata applicata la proprietà column-count impostando il relativo valore a 3.
Naturalmente, tramite apposite media query sarà possibile modificare tale valore portando il testo su 2 colonne e poi su 1 sola colonna al ridursi della viewport.

Continua a leggere→