Come scegliere ed abbinare font (9 consigli pratici)

Come posso abbinare due font?

Questa è stata la domanda più effettuata dai miei lettori dopo gli ultimi articoli sul web design!

Il numero di utenti che mi ha fatto questa richiesta mi ha convinto a scrivere una guida legata all’argomento, in realtà me lo aspettavo in quanto anche io agli inizi sono stato affascinato dal potere della tipografia ed ero ansioso di riuscire ad utilizzarlo al meglio.

Il termine tipografia non si riferisce solo alla combinazione di due o più typeface ma a tutte le caratteristiche che le vanno a costituire:

  • Font Size
  • Font Weight
  • Letter Spacing
  • Line Height

Capisci bene che anche usando una sola typeface variando le varie proprietà potrei ottenere un ottimo risultato visivo!

Ma qual è lo scopo della tipografia?

Lo scopo principale è quello di rendere piacevole la lettura, permettere ad un lettore di concentrarsi sulla lettura e basta.

Per il resto tramite la tipografia, come abbiamo già visto tramite i colori, possiamo esprimere delle emozioni.

Ma se questa guida ha un valore è solo perchè il tuo scopo principale sarà quello di creare una tipografia non solo piacevole alla vista ma soprattutto utile!

Conosci la differenza fra typeface e font?

Ti ho parlato di typeface poco fa e non ho ancora utilizzato la parola font, alcuni ritengono siano la stessa cosa ma non è così, utilizziamo qualche citazione:

“The way I relate the difference between typeface and font to my students is by comparing them to songs and MP3s, respectively (or songs and CDs, if you prefer a physical metaphor).”
— Nick Shermantypographica.org

Insomma noi guardiamo una typeface ma utilizziamo un font.

Classifichiamo i font

Esistono 4 tipologie di font:

  • Serif & Sans-Serif: sono simili ma un serif contiene delle estensioni al termine dei caratteri che lo rendono “aggraziato” (infatti serif sta appunto per grazia)
  • Decorative: sono typeface particolari che permettono di esprimere emozioni
  • Script: vengono chiamati anche calligrafici perchè appunto imitano una scrittura in corsivo molto elegante

10 Consigli per abbinare font

Abbinare font è un arte più che una scienza, per cui non esistono fattori tecnici veri e propri ma delle linee guida per non sbagliare del tutto.

Diamo alcuni consigli di base:

  1. Usa al massimo 2 typeface diversi!
  2. Ricorda sempre che vuoi creare una comunicazione uniforme, non abbinare due font che danno sensazioni ed emozioni diverse, otterrai solo un effetto spiacevole;
  3. Non abbinare typefaces della stessa categoria e di famiglie diverse, creerai solo confusione e danneggerai il lettore;
  4. È sempre bene creare contrasto ma senza esagerare;
  5. Definisci una gerarchia, assegna un ruolo ad ogni typeface con relative proprietà;

6 – Creare contrasto con lo stesso font

Come detto in precendeza si utilizza lo stesso font per tutta la pagina ma si vanno a modificare le proprietà del font per creare un contrasto piacevole.

7 – Serif abbinato con Sans-Serif

L’abbinamento più semplice da fare è usare una typeface Serif col ruolo di Heading ed una typeface Sans-Serif col ruolo di testo della pagina.

Alcune famiglie hanno typeface create in entrambe le varianti e ciò quindi ci rende particolarmente semplice accoppiarli.

8 – Usa font che abbiano tratti simili

 font-variante

Nell’immagine sopra sono evidenziati tutte le particolarità di una typeface, ricordati che per poterne usare due insieme tali caratteristiche devono essere almeno simili per non andare in conflitto.

9 – Non reiventare la ruota!

Ci sono centinaia di siti web che mostrano combinazioni già fatte di font che funzionano bene insieme.

Sul mio blog salvatorefasano.net ho scritto un articolo in cui ci sono 48 risorse gratuite per la creazione del tuo prossimo progetto web, all’interno ho elencato 11 risorse solo per l’abbinamento dei font!

 

 

Condividi questo articolo:

Share on facebook
Share on google
Share on twitter
Share on linkedin

Come scegliere ed abbinare font (9 consigli pratici)

Condividi questo articolo:

Share on facebook
Share on google
Share on twitter
Share on linkedin