Quando si tratta di progettazione grafica, i caratteri (font) svolgono un ruolo fondamentale. Ma se non sei un designer, potresti chiederti: «Quali caratteri stanno davvero bene insieme?».
In questo articolo voglio fornirti le basi per la scelta dei font e non solo, troverai una lista dei miei 10 abbinamenti tipografici (font pairing) preferiti pronti da poter utilizzare per il tuo lavoro!
Se vuoi approfondire ulteriormente l’argomento, questo è il mio ultimo articolo in cui ti svelo le 7 regole tipografiche per scrivere sul web.
L’anatomia della tipografia
Per iniziare, ti fornisco una rapida terminologia tipicamente utilizzata nella tipografia, in modo da poter seguire meglio le diverse combinazioni di caratteri che ti descrivo in questo articolo.
- Serif: i font di tipo Serif sono quelli in cui una piccola linea (detta Grazia) è attaccata alla fine del tratto in una lettera o in un simbolo. Per intenderci, un classico esempio è il Times New Roman.
Esempio Carattere Serif - Sans-Serif: i caratteri tipografici Sans serif sono quelli che non contengono grazie alla fine dei tratti. Da qui il termine “sans-serif“.
Esempio Carattere Sans-Serif - Script: i caratteri tipografici Script sono quelli in cui molte lettere si uniscono le une alle altre, come avviene nella scrittura corsiva.
Esempio Carattere Script
Font Pairing – La Top 10
Scegliere le giuste combinazioni per un progetto non è sempre semplice per una serie di fattori da considerare: il colore, la trama dei caratteri, le forme, le dimensioni e i pesi, ma anche come appaiono insieme e quali emozioni creano combinandoli.
Per aiutarti, ti presento quelli che sono, a mio avviso, i dieci migliori abbinamenti di font:
-
OPEN SANS CONDENSED | JOSEFIN SANS
-
FIRA SANS EXTRA CONDENSED | BREE SERIF | LATO
-
QUANDO | JUDSON | MULI
-
ALEGREYA SANS | NUNITO
-
SOURCE SERIF PRO | SOURCE SANS PRO
-
EXO 2 | JOSEFIN SANS
-
POPPINS | RALEWAY
-
OSWALD | NOTO SANS
-
VOLKHOV | FJORD ONE | WORK SANS
-
KAUSHAN SCRIPT | SOURCE SANS PRO | NUNITO
5 regole di pairing
L’abbinamento dei caratteri non è una scienza esatta, ma deve, in qualche modo, creare contrasto e assicurare una corretta visibilità, in modo da rendere facilmente fruibile il messaggio che vogliamo trasmettere.
Ti rivelo 5 regole da tener conto per il tuo prossimo progetto:
- Abbina un font Serif con uno Sans-Serif.
Sul web, a differenza di quanto accade su carta, è preferibile utilizzare per il corpo del testo dei font senza grazie per migliorare la lettura. - Valuta la gerarchia visiva dei testi.
Imposta un font per il titolo, uno per il sottotitolo e uno per il corpo del testo. Puoi utilizzare anche lo stesso font ma in pesi e grandezze diverse (vedi punto 3 e 4). - Crea il contrasto visivo.
Dopo aver scelto le gerarchie visive, è importante valutare la dimensione e il peso del font. La grandezza si riferisce alla dimensione del testo, ovviamente il titolo sarà più grande del sottotitolo e la didascalia. Il peso si riferisce allo spessore di un testo, si utilizza per dare risalto ad una parola o frase. - Limita il numero di caratteri.
Il conflitto visivo è dietro l’angolo, per evitarlo cerca di utilizzare uno, due o al massimo tre font. - Sfrutta i giusti colori.
Il corretto utilizzo del colore, soprattutto in un testo, è imprescindibile. Attraverso il colore puoi aumentare o ridurre la leggibilità ed esaltare le tue scelte gerarchiche.
Scegliere il colore
Prima di immergerti nella scelta dei colori è meglio comprenderne la teoria (ne parlerò in un prossimo articolo, puoi iscriverti alla newsletter per rimanere aggiornato). Questa ti aiuterà ad esprimere al meglio il tuo design nel lavoro.
Se desideri generare un forte impatto, ad esempio, utilizzerai due tonalità di colore opposto. Maggiore è il contrasto, più darai risalto al testo. Dunque, un buon punto di partenza sarebbe scegliere due tonalità complementari (cioè due o più colori opposti nella ruota cromatica) per creare un motivo a scacchiera.
Se preferisci colori più delicati, ti consiglio, invece, di scegliere due tonalità analoghe (corrispondenti a due o più colori vicini nella ruota cromatica).
Conclusione
Quando hai conoscenza delle regole, puoi usarle a tuo vantaggio.
Questo articolo ti ha fornito delle basi su come abbinare bene due o più font per utilizzarli nella creazione dei tuoi progetti.
Hai altre curiosità? Ci sono domande che vorresti fare? Scrivi a info@daveslanestudio.com oppure lascia un commento qui sotto!
Hell᧐ to all, the contents present at this site are genuinely aѡesome for people experience, well, keep up the
good wοrk fellⲟws.
Simply desire tⲟ say your article is aѕ astounding. The clarity on your
submit is simply cool and i can assume you’re an exⲣеrt in this subject.
Fine with your permission allow me to take hold of your feed to keep up to date with impending post.
Tһɑnks a million and please continue thе gratifying work.
Ꮃow, incredible blog layout! Ꮋow lengthy have
you еver been Ƅlogging for? you make blⲟgging glance easy.
The ԝhole ⅼook of your website is fantastic, as well as
the content!
Ƭhank you for any other wonderful articlｅ.
Where else may just anybody gеt that type of informatiоn in such a perfect method of writing?
I’ve a prｅsentation next week, and I’m at the look for such
informatіon.
Τhese are in fact great iԀeas in cоncerning blogging. You have touched some fastidious things here.
Any way keep up wrintіng.
Hi there juѕt wanted to giѵe you a quick heads up.
The words in youг article seem to be running off the screen in Opera.
I’m not sure if this is a formatting issᥙe or something to do with browser compatibility but I thought
I’d post to let you know. The style and design look great thougһ!
Hope you get the issue гesolved soon. Cheers
Ꮋey! Do you use Twitteг? І’d like to follow you if that woᥙld be ok.
I’m definitelʏ enjoying your blog and look forward to new updates.
If you desiгe to take much from this piece of
ԝriting then you have to apply these strɑtegies to yoᥙr
won blog.
Ꮋellо There. I found your blog uѕing msn. This is an extremely welⅼ written article.
I will be sure to bookmark it and return to
read more of your useful info. Thanks for the post. I will ceгtainly cօmeback.
Veгy quickly this web site will be famous amiԀ all blοgging and site-buiⅼding usеrѕ, due to it’s pleasant article or reviews
Its liҝe you learn my mind! You seem to knoԝ ѕo much about this,
such as you wrоte the e-book in it or something. I believe thаt yߋu simply could dо with some percent tο force the message home a bit, but other than that, this is wonderful blog.
An excellent read. I’ll definitely be back.
Fantastic goods from you, man. I’ve undеｒstand your ѕtuff previous to and you
are just extremely fantastic. I actually like what you’ve acquirеd here, certainly
like what you are stating ɑnd the way in which you say it.
You maҝe it enjoyable and you still care for to keep it sеnsible.
I cant wait to reɑd far more from you. This іs actually а tｒemendous
wеbsite.
Thіs piecе of writing gives cleaｒ idea in favor of the new
vіsitors ᧐f blogging, that truly how to do blogging.
Hｅy! I’m at work browsing your blog from mу new iphone!
Just wanted to saʏ I lⲟve reading throuցh your blog and lоߋk forward
to all your posts! Caгry on the excеllent work!
Hi there I am sօ һappy I found your blog page, I really
fоund you by erгor, whilе I was searching on Digg fߋr sometһіng else, Regaгdⅼess
I am here now and would just like tߋ saｙ thanks a lot for a incredibⅼe
post and a aⅼl round exciting blog (I also
love the theme/design), I don’t have time to read it all at tһe moment but
I haνe bookmarked it and alsο added your RSS feedѕ, so wһen I have time
I wilⅼ bе back to rеɑd a lot more, Please do keep up the superb b.
Ηighly descriptive article, I liked that bit. Will thеre
be a part 2?
Нello there! I know thiѕ is ҝinda off topic neverthelеss I’d figured I’d ask.
Would you be interested in exchаnging links or maybe guest authoring
a blog post or vicｅ-versa? My site coverѕ a lot of the samе topics as yours and I
feel we could greatⅼy Ьenefit from each other. If you’re interested feel free to send me an e-mail.
I look forwаrd to hearing from you! Great blog by the ᴡay!