Categorie
Guide

Regole Tipografia per Web e Print Design

Le abilità tipografiche di un designer — oggi che tutti si svendono come tali facendo siti web per €5 — sono fra le più sottovalutate, nonostante il web sia al 95% tipografia.

Al momento stai leggendo e quello che leggi, per risultarti piacevole, oltre che essere scritto bene (e quindi piacerti intellettualmente parlando) deve affascinare il tuo occhio, il quale senza che tu te ne accorga è alla ricerca di proporzionalità, di canoni di bellezza umani. Questa è tipografia.

Sembrerebbe esagerata come introduzione, parliamo addirittura di “canoni di bellezza”, ma continuate la lettura per scendere maggiormente nel dettaglio e stupirvi ancora di più.

Falsi miti
Molti pensano che tipografia significhi semplicemente scegliere un font e dargli una dimensione. Dopo aver letto questo articolo ne uscirete con una visione abbastanza diversa.
Per quello che ho imparato io finora, e ho ancora molto da imparare, la tipografia è ben altro. Può essere considerata un’arte.

Rispettare le Proporzioni
Alla base dell’arte classica, quella che più di ogni altra ha definito i canoni di bellezza, c’erano le proporzioni. Proporzionale è bello, proporzionale è piacevole per l’occhio umano. Il nostro occhio, anche se non ce ne accorgiamo, è alla ricerca di proporzioni e quando le trova questo risulta piacevole.
Tutto questo si applica benissimo anche all’arte dei caratteri! L’occhio di chi legge è alla ricerca di proporzionalità, continuamente.

Passiamo ai fatti.
Tutto ciò si applica sia al web design che ai lavori su carta stampata
Fondamentalmente sono 3 i passi per ottenere consistenza e proporzionalità:
Scegliere un numero, una sorta di costante, che potremmo chiamare il nostro coefficiente di proporzionalità
Creare una scala di proporzionalità
Rispettarla!
Scegliamo il nostro coefficiente di proporzionalità
Non è un compito difficile. Io di solito uso 1.5, che è il numero più facile da ricordare e che più si avvicina al 1.6180 che è la perfezione (vedi Sezione Aurea su wikipedia per approfondire, fondamentalmente è “il numero segreto della bellezza classica”).

Creare una scala di proporzionalità
Abbiamo il nostro numero (1.5), adesso dobbiamo fare in modo da avere tanti altri numeri (font-size) proporzionali ad esso.
Proviamo a creare velocemente una scala. La font-size basilare dalla quale partiamo sono i 16px che è la grandezza del testo di default su tutti i maggiori browser.
Ecco la scala
16px
16px * 1.5 = 24px
24px * 1.5 = 36px
36px * 1.5 = 54px

Applicarla
L’abbiamo creata, adesso usiamola. Semplicemente utilizziamo queste precise misure per i font a seconda dell’importanza degli elementi. Per esempio agli
h1 assegneremo font-size 54px.
Regolare la line-height
La line-height è un valore tanto sottovalutato quanto importante. È la distanza che separa le righe di un testo.
Un buon valore da assegnarle è il 150% rispetto la misura del font (per trovare il valore moltiplicare la misura del font per 1.5).
Abbinare correttamente i font
I font sono molto simili ai colori. Molti colori sono belli e affascinanti di per se, ma perdono se accoppiati con altri non seguendo un criterio stilistico.
Lo stesso vale per i font. Possiamo avere due font, bellissimi separatamente, ma che abbinati non rendono giustizia.
In questo settore non esistono delle vere e proprie “regole” ma ci si affida molto al gusto personale.

Tuttavia ci sono delle soluzioni, già ampiamente testate e “garantite”. Insomma, definiamoli pure dei “classici”, degli abbinamenti che, pur non essendo molto creativi, non falliscono mai.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *