010 • Tipografia

Si parla di tipografia.

Web design in 95% typography. Da quando, nel 2007, è uscito l’articolo1 di iA2 con questo titolo non so quante volte ho usato quella frase in articoli e presentazioni. Una frase utile per capire meglio il web, che chiaramente non è fatto di solo testo, ma di molte decisioni tipografiche: dimensioni, spaziature, gerarchie, ritmo.

Quella frase evidenzia poi anche una differenza di approccio rispetto ad esempio alla progettazione di un’app. Progettare per il web significa, molto spesso, progettare sistemi di lettura. Non che nelle app non sia importante la tipografia, ma lo è in maniera diversa. Nel web, il testo è molto spesso il contenuto principale, è l’interfaccia. In molte app, invece, il testo accompagna l’azione: etichette, messaggi.

Chi progetta per il web prende continuamente decisioni tipografiche, anche quando non le chiama così:

È logico pensare che i siti web che sentiamo sbagliati lo siano perché, da qualche parte a un certo punto, un tipografo ha preso decisioni sbagliate. Ricordo che un designer di caratteri è qualcuno che crea font; un tipografo è qualcuno che usa il carattere tipografico per comunicare. In tal senso, siamo tutti tipografi, anche se pensiamo a ciò che facciamo come progettazione, sviluppo o modifica3.

Il web, dalla sua nascita, ha ripreso i principi base della tipografia editoriale, ma si è poi evoluto facendo riferimento a obiettivi concreti, spesso misurati, che sia il caricamento, la velocità di lettura o una conversione4.

La tipografia non funziona per singoli elementi isolati. Funziona per relazioni (tornano): dimensioni, pesi, interlinee, spazi tra i paragrafi, distanze tra titolo e testo, rapporto tra testo e spazio vuoto. In generale una pagina “funziona” quando funzionano le relazioni: coerenti e leggibili come sistema.


Mirco esercizio

Andate su questo sito, alla sezione che raccoglie le pagine “about us”. Cliccate uno delle pagine segnalate, osservate titoli, paragrafi, distanze, interruzioni. Provate a chiedervi quali decisioni tipografiche hanno definito quella pagina e che tipo di ritmo di lettura producono.


  1. Tra gli altri, è citato in questo articolo dal titolo Tipografo e tipografia (2020) 

  2. iA sta per Information Architect, una piccola azienda che realizza applicazioni mobile e desktop: ia.net 

  3. Tim Brown (2018) - Flexible Typesetting 

  4. Per conversione si intende il raggiungimento di un obiettivo previsto dal progetto: ad esempio completare una registrazione, inviare un modulo, effettuare un acquisto o cliccare su un’azione rilevante.