Migliori font per le App: guida alla scelta

Nel suo celebre Gli elementi dello stile tipografico¹, Robert Bringhurst elenca i servizi che la tipografia dovrebbe assicurare al lettore:

• Invitare ad avvicinarsi al testo;
• rivelare il tono e il significato del testo;
• rendere chiara la struttura e l’ordine del testo;
• collegare il testo con gli altri elementi della pagina;
• indurre uno stato di calma attenta, condizione ideale per la lettura.

Questi servizi sono utili sia per un testo destinato a un supporto cartaceo che a uno schermo. Ellen Lupton nel suo Caratteri, testo, gabbia smonta l’idea comune che sul monitor si faccia più fatica a leggere. Uno studio degli anni ’80, sull’interazione uomo-macchina, ha dimostrato che «un testo nero su sfondo bianco si riesce a leggere, con la stessa efficienza, sullo schermo come sulla pagina»² — e all’epoca i monitor avevano risoluzioni ben più basse di quelle attuali. Quello che cambia nella lettura digitale è l’aspettativa. «Il lettore digitale si aspetta di essere “produttivo”, non contemplativo»³. Il lettore digitale scorre lo schermo sempre in cerca di qualcosa da cliccare (o da condividere), il lettore su carta si prende il suo tempo e si muove in maniera meno frenetica. Il supporto non inibisce alla lettura di un testo lungo, soprattutto se il testo è stato pensato per essere letto, non solo per essere visto (readability e legibility si direbbe in inglese).

L’importanza della leggibilità dei font per le app

La leggibilità di un testo è determinata da una serie di elementi, la scelta del tipo di font è solo uno di questi. Fondamentali sono anche:

• la grandezza
• la spaziatura tra le lettere e tra le parole
• la lunghezza della riga (la giustezza)
• la distanza tra le righe (l’interlinea)

Questi elementi si influenzano a vicenda. Più una riga è lunga, maggiore dovrà essere la grandezza del carattere e, a sua volta, maggiore dovrà essere l’interlinea. La grandezza del testo e l’interlinea sono strettamente correlate al tipo di font, per alcuni sarà necessario un’interlinea maggiore, per altri minore.

Il designer sloveno Matej Latin per rappresentare la correlazione tra, grandezza del testo, lunghezza della riga e interlinea ha usato la metafora del triangolo equilatero, creando The Equilateral Triangle of a Perfect Paragraph. Un gioco online con il quale è possibile esercitarsi nella costruzione del “paragrafo perfetto” e vedere in tempo reale cosa succede quando uno degli elementi non è stato impostato correttamente. Le regole di base della tipografia (e in generale del graphic design) si possono applicare alla stessa maniera sia su carta che su un monitor, tenendo sempre a mente il contesto e l’uso che ne farà il lettore. Se si sta leggendo un testo su uno schermo si tende ad essere meno contemplativi. Se poi lo schermo è quello di uno smartphone, lo si è ancora di meno. La conoscenza di queste dinamiche indirizza le scelte tipografiche in una direzione, piuttosto che un’altra.

Progettare per un’app: il font conta!

Quando si progetta un’app per uno smartphone, si progetta per un sistema operativo che ha le sue regole, le sue logiche di funzionamento, di layout e di design. I due sistemi operativi più diffusi oggi sono Android e iOS. Entrambi hanno una guida di stile molto dettagliata, dove vengono specificate, tra le tante cose, le dimensioni ideali della barra in alto, della barra laterale e anche del font.

La navigazione di un’app Android (progettata secondo le linee guida di Google) si sviluppa tra la barra in alto e l’hamburger menu — con l’icona posizionata in alto a sinistra. Quella di un’app iOS invece si sviluppa in basso (la tab bar). Per Android la barra in alto dovrebbe essere di 88px, per iOS di 64px. Il titolo della barra in alto per Android dovrebbe essere di 20pt, per iOS di 17pt. Sia Android che iOS hanno un loro font di default, Roboto per il primo, San Francisco per il secondo⁴.

Quali font scegliere per le app

L’uso dei font di default del sistema operativo ha i suoi vantaggi (nessun costo di licenza, peso dell’app), ma non sempre è la soluzione ideale per tutti. Necessità legate al branding, all’identità visiva, al tipo di contenuto richiedono scelte diverse. Gli elementi da considerare nella scelta di un font per uno schermo non differiscono molto da quelli per la carta stampata. Occorre valutare:

• in quanti pesi è disponibile un carattere
• l’altezza della x (l’altezza della minuscola)
• il contrasto (la differenza di spessore tra linee sottili e linee spesse di una lettera)
• la forma delle lettere (dove si distinguono senza problemi lettere come e e c o l minuscola e I maiuscola)
• la larghezza delle lettere

Quanto più la minuscola è alta, maggiore è la leggibilità, soprattutto a dimensioni ridotte. Va da sé che quindi su uno schermo piccolo, come quello di uno smartphone, questa caratteristica è fondamentale, come è importante che le lettere abbiano un buon contrasto. Prendendo in esame alcune delle app più note e scaricate, sia su Play Store che su App Store, si può notare come spesso il font utilizzato è quello di default. Per app da milioni di download c’è da considerare l’impatto che può avere il costo di licenza d’uso di un font. In genere per un’app i costi sono molto più alti rispetti a quelli per la stampa o per il web. In questi casi, in genere, se si vuole evitare il font di default e non si vogliono usare font gratuiti conviene averne un proprio font. Di recente sia Netflix che Airbnb hanno abbandonato i font usati per anni (Gotham per il primo, Circular per il secondo) e sono passati a font proprietari.

I font proprietari: personalità e leggibilità

Il team di design in house di Netflix, in collaborazione con la type foundry inglese Dalton Maag, ha realizzato il Netflix Sans, Airbnb, sempre in collaborazione con Dalton Maag, ha realizzato il Cereal. Sia per Netflix che per Airbnb, la parola più ricorrente nei comunicati stampa di presentazione del font è stata: “leggibilità”. Lo scopo era avere un font che potesse differenziare il marchio e che fosse leggibile sia su monitor che su carta. Entrambe hanno un’importante presenza anche offline, legato all’advertising più tradizionale, ma non solo. Airbnb, ad esempio, stampa anche un suo magazine.

Un’altra app, VSCO, sempre attentissima al design, è andata nella stessa direzione in uno dei suoi ultimi rebrand, realizzando, in collaborazione con la type foundry svedese Letters from Sweden, il VSCO Gothic.

Parafrasando Robert Bringhurst, il carattere migliore per un’app (un sito o un libro) sarà, per prima cosa, un carattere di per sé buono. Secondo, sarà un carattere adeguato a un’app, vale a dire comodo per una lettura continuativa e prolungata. Terzo, sarà un carattere in sintonia con il tema. Ricordando che la scelta del tipo di font è solo l’inizio, il come lo si utilizza determinerà poi la riuscita o meno del progetto grafico, che sia per uno schermo o che sia per la carta.

Le alternative gratuite ai font standard per Android e IOS

Chiudo quest’articolo con la segnalazione di due font gratuiti che sono ottime alternative ai font dei default di iOS e Android. Uno è l’IBM Plex, il font open source realizzato di recente da IBM. È disponibile in tre versioni: mono, serif e sans-serif (del sans-serif c’è anche una versione condensed). Tutte le versioni sono disponibili in otto pesi diversi (tutti sia in tondo che in corsivo).

L’altro è Inter UI realizzato da Rasmus Andersson, disponibile in quattro pesi (sia in tondo che in corsivo). Il progetto dell’Inter UI è iniziato nel 2016 come un esperimento per creare un font perfettamente leggibile a dimensioni molto piccole.

–––––––––––––––––––––––––––––––– ¹ Dopo la chiusura della casa editrice che lo pubblicava, la Sylvestre Bonnard, Gli Elementi dello stile tipografico in italiano è difficile da reperire. ² Ellen Lupton, Caratteri, testo, gabbia, Zanichelli, Bologna, 2010 ³ Ibidem ⁴ Il San Francisco è stato introdotto da Apple nel 2015. In precedenza il font di default di iOS era l’Helvetica.