Scegliere il font giusto per un sito web

La scelta del font giusto per un sito web è argomento tutt’altro che banale e influenza in modo netto sia la sua usabilità che l’impatto emotivo del suo layout grafico.

Innanzitutto partiamo da una considerazione tecnica. Per qualsiasi interfaccia visualizzata su computer sarebbe meglio utilizzare caratteri cosiddetti web safe (sono chiamati così perchè installati di default  praticamente su tutti i computer del mondo).

Scegliendo un carattere appartenente a una di queste famiglie potremo essere ragionevolmente sicuri che il nostro lettore non vedrà testi scritti con caratteri molto diversi da quello che noi abbiamo scelto originariamente. Le famiglie di caratteri web safe sono:

  • Arial
    Esempio di testo in Arial
  • Courier
    Esempio di testo in Courier
  • Georgia
    Esempio di testo in Georgia
  • Helvetica
    Esempio di testo in Helvetica
  • Tahoma
    Esempio di testo in Tahoma
  • Times New Roman
    Esempio di testo in Times New Roman
  • Verdana
    Esempio di testo in Verdana

Questa distinzione sta comunque gradualmente perdendo importanza, perchè il numero di caratteri installati di default nei sistemi di tutto il mondo continua a crescere. Inoltre ci sono vari modi per far visualizzare un certo carattere in un browser che non lo avesse già installato… Ma perchè complicarsi inutilmente la vita? 😉

Altra distinzione molto importante è tra i caratteri con grazie o senza grazie (serif o sans serif). Le grazie sono quei fregi posti alle estremità delle cuspidi delle lettere. Consierando gli esempi sopra riportati vi accorgerete subito che l’arial, l’Helvetica, il Tahoma e il Verdana ne sono prive, mentre il Courier, il Georgia e il Times New Roman le hanno.

Generalmente per i testi non troppo lunghi (ad es.: i titoli), a rapido scorrimento (ad es.: le newsletter, i siti web o i cartelli stradali) o in condizioni di stress visivo (ad es.: nei monitor dei computer) risultano più leggibili caratteri senza grazie.

Invece nei testi piuttosto lunghi (ad es.: E-book o schede prodotto molto dettagliate), stampati su carta (ad es.: libri), molto piccoli o ben contrastati (scritte nere su fondo bianco) risultano più leggibili caratteri con le grazie.

Queste indicazioni vanno però prese come suggerimenti molto generali, perchè dovrebbero essere sempre calate nell’interfaccia grafica che le contorna per avere validità.

A meno di casi molto particolari, non conviene comunque mai accostare più di 2-3 caratteri diversi in uno spazio ristretto, in quanto ciò potrebbe generare una inconsapevole impressione di confusione.

Altro aspetto molto importante da valutare è la chiusura o apertura dei caratteri. Si dice che un carattere è più chiuso (o meno aperto) quanto più i suoi contorni esterni assomigliano a una “o” – “O”.

Più i caratteri sono aperti è più risultano leggibili, in quanto offrono all’occhio del lettore maggiori punti di riferimento nella lettura rapida.

Va infatti considerato che noi non leggiamo ogni lettera di ogni singola parola ma le “riconosciamo” guardandone la parte superiore e l’inizio e la fine.

Per questo motivo le stesse parole scritte con caratteri minuscoli (o con solo la prima lettera maiuscola) rispetto a quelle scritte tutte in maiuscolo risultano molto più leggibili, perchè la maggiore variabilità di altezza e di forma delle lettere ne facilita notevolmente il riconoscimento rapido.

Da questo punto di vista va anche tenuto presente che l’uso intelligente dei grassetti per evidenziare i concetti fondamentali all’interno di una frase è un grandissimo aiuto alla rapidità di “scansione” visiva e concettuale di un testo.

Altro aspetto fondamentale che può coinvolgere l’usabilità dei testi è la formattazione dei link. Gli utenti web sono abituati a identificare come cliccabili i testi colorati in blu e sottolineati, perchè tutti i browser identificano in questo modo i link a cui non sia stato dato un formato diverso da parte di chi ha realizzato il sito.

E’ bene tenere presente questo fattore e non richiedere al lettore (magari già provato dai concetti che esprimiamo) un extra sforzo per capire dove può cliccare. Ma soprattutto, una volta che si è identificato il format giusto per i link, usiamo sempre e solo quello in tutto il sito, senza formattare allo stesso modo testo che non è invece cliccabile.

Gianpaolo Lorusso
www.sito-perfetto.it

Nuovo studio Nielsen sull’usabilità degli iPad app
Nuovo studio Nielsen sull’usabilità degli iPad app

Uno studio del Gruppo Nielsen Norman pubblicato di recente conclude che, sebbene gli iPad app siano migliorati molto rispetto all’anno Read more

I test di norma due A/B
I test di norma due  A/B

Chi di voi almeno una volta nella vita ha detto: perché oggi è diverso? riferendosi al sito web di turno. Read more

Waterfall model “Modello a Cascata” e Programmazione Agile
Waterfall model “Modello a Cascata” e Programmazione Agile

Sono orami anni che guida lo sviluppo dei sistemi interattivi più disparati, sia fissi che mobili: il Waterfall Model o Read more

Preparazione ed esecuzione di un test di usabilità (Prima Parte)
Preparazione ed esecuzione di un test di usabilità (Prima Parte)

Nei precedenti articoli abbiamo trattato una tecnica di valutazione (A/B test) ed un modello di progettazione per un sistema interattivo Read more

Categorie: