Avere un buon carattere è FONTamentale

 

 

Marco arrivò alla festa di compleanno di Luigi con un pacco in mano. Lo consegnò al festeggiato che –curioso come una scimmietta– squarciò la carta argentata che lo avvolgeva e scoprì che tipo di regalo fosse.

Era un libro di racconti d’avventura, proprio il tipo di libro che lui amava leggere. Lo aprì e riuscì a trattenere a malapena una smorfia: aveva i caratteri che di solito si usano per le note.

Ammettiamo: chi di noi, leggendo un libro (per diletto o per studio) non ha fatto come Luigi? Amate un carattere leggibile?

E su un sito web qual è la dimensione dei caratteri adatta? E questa semplice domanda ebbe il potere di “scaldare” una discussione tra un copy (stravagante come tutti i copies!) ed un creative director (meticoloso e attento come tutti i creative directors) a tal punto che… le due “crema-caffè” si sciolsero sfiorando il punto di sublimazione. Se poi il copy è anche un po’ polemico, arriva a casa e confeziona un articolo sul tema, ben sapendo che poi, dovrà passare al vaglio del “creative ex machina”. Se leggerete queste righe vuol dire che il copy... l’ha avuta vinta. Per ora!

 

Accomodatevi, il testo sta per iniziare!
Se per scegliere un jingle o un buon pay-off occorre la creatività di un copywriter, scegliere le dimensioni del body text è infatti uno degli aspetti più importanti dell’intera progettazione del sito stesso che farà fumare il cervello del web designer mandando in fumo una bella manciata di neuroni.

 

C’è chi si è preso l’ingrato compito di girovagare su migliaia di siti web di quotidiani online, blog, portfolio cercando di elaborare una statistica il più obiettiva possibile di quanto siano grandi i caratteri dei testi. Pare che la maggior parte dei siti web abbia testi troppo piccoli.

Parafrasando una campagna degli anni ’80, «gran parte dei siti web ce l’ha piccolo… il font»

 

La maggior parte dei siti web in circolazione ha font la cui dimensione del corpo di testo è impostata attorno ai 14/16px, alcuni anche meno, pochi attorno ai 18px e ancora meno sopra i 20px.

Tenendo conto che su internet il ruolo principale lo svolge il contenuto non è un dato da sottovalutare.

Il contenuto può essere un’immagine, un video o, come nella maggior parte dei casi, può essere un testo.

Come accade nei quotidiani cartacei, il titolo e il sottotitolo devono attirare l’attenzione di un testo contenuto nell’articolo (con un font decisamente più piccolo!).

Non accade nulla di diverso nei siti web, il testo è l’elemento più importante all’interno di un sito web.

Si legge un titolo e poi si clikka sull’articolo per leggerne il testo costringendo spesso l’utente ad avvicinare il viso allo schermo, stropicciarsi gli occhi, inforcare gli occhiali o zoommare per farle leggere meglio. O più semplicemente clikkare su quella “x” posizionata in alto a destra dello schermo…

 

Il sito «Grafigata.com» fece un esperimento: decise di aumentare sensibilmente la dimensione del testo di ben 4px per il body text e di 2/3 px per i vari titoli e dopo aver attentamente analizzato e studiato tali esperimenti constatarono di avere rilevato una migliore esperienza-utente rispetto a prima, cercando anche di analizzare e comprendere, quando un testo è troppo piccolo e perché i siti web hanno testi mediamente così piccoli.

La conclusione fu degna di monsieur de la Palice: sostanzialmente, un testo è troppo piccolo quando …si fa fatica a leggerlo. Naturalmente qui non si parla di drammatiche difficoltà di lettura, ci mancherebbe.

Testi come 16px sono dimensioni “standard” per il web e sicuramente leggibili facilmente dalla giusta distanza.

Nei testi, specialmente se lunghi o complessi, è importante che la leggibilità del testo sia messa al primo posto. Anche se si aggiunge un dettaglio non trascurabile: il dispositivo usato. Un computer, un tablet, uno smartphone?

Un testo online deve essere letto il più facilmente possibile da qualsiasi dispositivo. E un testo di dimensioni piccole su schermi grossi non facilità sicuramente la lettura.

La domanda sorge spontanea, direbbe un famoso giornalista «perché si usano testi così piccoli? Perché la maggior parte dei siti web è progettata in questo modo?»

 

Primo motivo: la storia delle dimensioni dei testi

Nell’epoca pre-digitale, nell’ambito della grafica solamente stampata, lo standard per le dimensioni era di 12pt., “pt”, cioè punti tipografici, non pixel. Un punto tipografico, è l’unità di misura per le dimensioni dei testi. Ne esistono diverse tipologie (il punto europeo, quello americano) ma variano tra loro davvero di pochissimo, quindi per comodità qui in questo articolo dirò solamente “pt”.

Con la nuova tecnologia testi di dimensione 12px hanno iniziato a diventare illeggibili su schermi ad alta risoluzione. Addirittura 16px sta iniziando ad essere considerato piccolo e difficile da leggere!

 

Secondo motivo: pare che dimensioni grosse siano “brutte”

I web designers degli anni ’90 avevano come standard i 12px. I siti web con testi più grandi venivano definiti snobbisticamente “amatoriali”, equiparandoli al classico sito fatto da un ragazzino inesperto o che conosceva poco le regole di design del web dell’epoca.

Un po’ ciò che accade nel mondo dei “wall writers” quando si riceve il tag “TOY”. Ovvero, sei ancora un pivellino.

Questo concetto, ancora esiste e gran parte del mondo dei progettisti risente di tale “diktat”.

C’è questo pregiudizio secondo cui testi più grossi siano infantili, poco seri e non professionali.

Quello che questi progettisti non capiscono è che non è la dimensione del testo a suscitare o meno sensazioni di scarsa serietà o di mancanza di buon design, è il carattere tipografico a farlo.

Sono le sue caratteristiche progettuali, il “kerning”, (cioè la crenatura che indica la riduzione dello spazio in eccesso fra coppie specifiche di caratteri, attuata al fine di diminuire spazi bianchi antiestetici e dare un aspetto più omogeneo al testo), la gestione dell’interlinea, il tipo del font a suscitare queste sensazioni.

 

Terzo motivo: “tanto si può zoommare clikkando su Ctrl+?”

Certo. Ed è, in effetti, quello che facciamo quando visitiamo siti web come ad esempio Wikipedia con testi piccoli, fitti e faticosissimi da leggere.

Però un progettista, un web designer, dovrebbe anche sapere che un utente medio ignora che un carattere piccolo “fa trendy” e può non essere a conoscenza dello strumento zoom (…o semplicemente possono anche non aver voglia di usarlo!).

Senza contare che facendo zoom in alcuni siti, si rischia di “scombinare” il layout del sito.

 

Quarto motivo: evitiamo lo scrolling.

Peccato che di progettisti web non capiscono è che -a differenza dello zoom- lo scrolling è il gesto più naturale di chi naviga in internet…

Quando si ha a che fare con un sito progettato con un preconcetto errato come questo, ci si ritrova a vedere il testo schiacciato all’interno di una pagina o addirittura di non trovare le informazioni che si stanno cercando perché «non sia mai! L’utente non deve fare scrolling!».

Chi visita un sito web dal computer è già pronto con il mouse in mano e col dito sulla rotellina, pronto a scorrere verso il basso per leggere il contenuto.

Chi visita da smartphone, è subito pronto con il dito sul touchscreen a scorrere verso il basso.

Immaginate se i progettisti di Facebook e Instagram avessero voluto evitare lo scrolling!

(senza contare che -come disse qualcuno- "io uso lo scrolling solo in bagno" (CENSORED)

 

Dopo alcuni esperimenti, molti web designers sono arrivati alla conclusione che usare testi più grandi anche solo di pochi pixel comporta un risultato estetico e di usabilità incredibilmente migliore. Portando il testo principale da 16px a 18px o, ancora meglio, a 20px, porta un cambiamento profondo dell’impatto e dell’usabilità dell’intero sito web.

Internet si sta evolvendo e con esso i device con cui vi accediamo. Allo stesso modo cambiano le abitudini delle persone quando usano Internet.

Sta diventando, ad esempio, sempre più diffuso l’accesso ad Internet tramite le smart TV. E se lo schermo di uno smartphone è diventa una pròtesi del proprio braccio e teniamo lo schermo vicino al viso, chi utilizza schermi TV per navigare, ha bisogno di testi che siano facilmente leggibili anche da più distante.

Immaginate un sito web con un testo in 12px su uno schermo FullHD di 27”. Zoomando, il testo andrà ad occupare tutta la larghezza dello schermo (o gran parte di essa), rendendo faticoso leggere linea per linea.

Un testo di 20px, avrà una buona leggibilità anche da distante, permettendo la lettura su qualsiasi schermo senza occuparne tutta la larghezza zoomando su uno schermo grosso.

Ecco il punto: la readability (e non solo la legibility)

 

Non vorrei essere pedante, ma voglio soffermarmi sul significato di queste parole che in italiano traduciamo entrambe con “leggibilità”.

Ma, in inglese, hanno due significati con sfumature differenti: readability = leggibilità di un testo, legibility = leggibilità del carattere.

Quindi, la legibility sono quelle caratteristiche che rendono un singolo carattere tipografico più leggibile rispetto ad un altro (altezza, contrasto, ecc), mentre la readability è quell’insieme di proprietà che rendono facilmente leggibile un testo.

Quindi kerning, gestione dell’interlinea, la buona divisione dei paragrafi e la dimensione del testo.

E –con una sorta di offerta “2x3” aumentare la dimensione del font di qualche pixel migliorerà anche la usability.

Ora concludo, vedo troppi sbadigliare!

(Ma …con quale font verrà pubblicato questo articolo? Con che dimensione?).

Ma non finisce qui!

…stay tuned.

Questa suspence nelle soap operas funziona, vuoi che non funzioni anche qui?

 

Anche perché un discorso a parte poi merita il tipo di font scelto per un sito web, Arial o Georgia? Serif o sans-serif?

Seguiteci e lo saprete… perché occorre sempre avere “carattere”.

Tags:

Please reload

Post in evidenza

Lo dico a voi… ma che resti tra noi. 😉
Avevamo programmato di iniziare a divulgare il blog di pAint us sui canali social non prima di lunedì.
(La dat...

Here we are.

February 4, 2017

1/1
Please reload

Post recenti