Come abbinare i font? [Guida]

[Kio_]

Oggi la vostra padellara preferita (?) cercherà di illustrarvi brevemente cosa sono i font e come imparare ad abbinarli.

 

Spoiler

 

 

 

 

Si tratta di una guida veramente basilare, quindi non temete, non serve essere dei maghi di Photoshop per poterne trarre vantaggio.

 

 

Innanzitutto i font si dividono in due famiglie principali.

I Serif e i Sans Serif. Ma cosa vuol dire?
 

• I Serif sono i font con le così dette “grazie”, ovvero, delle piccole appendici presenti su alcune lettere.

Esempio:

 

 

• I Sans Serif, invece, sono quei font senza grazie.

Esempio:

 

Oltre a queste due schiere, però, ne esistono infinite altre.

Ad esempio i pixel font, utilizzati spesso come watermark, o i font calligrafici.

 

 

Ma con che criterio si abbinano tra loro i font?

C'è una regola di fondo da ricordare: bisogna creare contrasto, ma non troppo.

Ma cosa vuol dire? Vediamolo nel dettaglio.

 

Esempio 1 – Troppo poco contrasto:

In questo caso abbinando due basic font uno Serif e uno Sans Serif, notiamo che tra i due si genera davvero poco contrasto. Sono sufficientemente diversi per creare un senso di disturbo ma non abbastanza perché questo disturbo sia gradevole.

 

Esempio 2 – Troppo contrasto:

In questo caso, invece, il contrasto tra i due font è veramente eccessivo, in quanto entrambi presentano uno stile molto particolare.

 

 

Esempio 3 – Contrasto corretto:

Finalmente qui abbiamo un contrasto testuale gradevole.

 

 

 

Il consiglio, quindi è di evitare sia l'abbinamento “Serif + Sans Serif” che l'abbinamento tra due font eccessivamente diversi.

 

Inoltre è buona norma non utilizzare più di due font diversi insieme, fatta eccezione per casi estremamente circostanziali.

 

Discorso simile al precedente vale anche per il contrasto cromatico.

 

Esempio 1 – Troppo contrasto:

 

 

Esempio 2 – Poco contrasto:

 

 

Esempio 3 – Contrasto corretto:

 

 

Nel caso ci trovassimo ad utilizzare più di un font è consigliabile optare per due differenti sfumature dello stesso colore, oppure per un accostamento cromatico tra due colori non particolarmente in contrasto tra loro.

 

 

 

 

 

Esistono poi dei casi in cui la scelta di un font è quasi obbligata.

Immaginiamo di trovarci in una situazione simile a questa:

 

 

 

Non serve specificare che la versione corretta sia la prima.

Questo accade perché solitamente quando si è costretti ad avvalersi di caratteri “maiuscoli” è necessario utilizzare font Sans Serif, mentre bisogna sempre evitare i font calligrafici.

Per andare sul sicuro, è preferibile utilizzare font essenziali come ad esempio Intro.

 

Tuttavia, se la situazione lo richiede, si possono creare abbinamenti gradevoli anche con altri font più particolari, come Edo SZ, ad esempio:

 

 

 

Un'altra dritta da tenere a mente riguarda l'allineamento.

Bisogna assolutamente evitare di stabilire più di due allineamenti differenti, in una composizione testuale.

 

 

Esempio doppio allineamento corretto:

 

 

 

Esempio allineamento multiplo sbagliato:

 

 

Quindi, se allineate al centro e a sinistra, evitate di allineare a destra e così via dicendo.

 

Ovviamente questo discorso vale esclusivamente per gli allineamenti formali, in quanto è consuetudine, nelle icon ad esempio, utilizzare differenti allineamenti per creare giochi di forme e di colori.

 

L'ultima dritta che posso darvi è cercare di utilizzare font coerenti con il tema.

Un'immagine horror, ad esempio, difficilmente sarà abbellita da un font calligrafico dolce e sinuoso, meglio optare per qualche font splatter che richiami appunto il tema dell'immagine o, nel dubbio, un bel Sans Serif neutro.  

 

 

 

 

Spero di esservi stata utile, se avete domande non esitate a chiedere.

 

 

Ps. Non usate MAI il Comic Sans.

 

[Green]

Guida semplice ma soprattutto ottima per chi è alle prime armi! :3

[Kio_]

Adesso, Green ha scritto:

Guida semplice ma soprattutto ottima per chi è alle prime armi! :3

Ti ringrazio.  

[LightRay]

9 minuti fa, Kio_ ha scritto:

 

Ps. Non usate MAI il Comic Sans. 

Ma ormai il Comic Sans più che un font è una barzelletta lol

Grazie per i consigli! :3

[Kio_]

Adesso, LightRay ha scritto:

Ma ormai il Comic Sans più che un font è una barzelletta lol

Grazie per i consigli! :3

Breve storia triste: conosco gente che prende soldi per realizzare lavori di grafica e lo usa. :') 

Figurati, comunque. Grazie a te!

[Delta_]

Bellissima guida

Spoiler

basta che non mi spadelli

 

[Kio_]

1 minuto fa, Delta_ ha scritto:

Bellissima guida

  Nascondi contenuto

basta che non mi spadelli

 

Ti ringrazio.

Nah

[MashMikan]

13 minuti fa, Kio_ ha scritto:

Oggi la vostra padellara preferita (?) cercherà di illustrarvi brevemente cosa sono i font e come imparare ad abbinarli.

 

  Apri contenuto nascosto

 

 

 

 

Si tratta di una guida veramente basilare, quindi non temete, non serve essere dei maghi di Photoshop per poterne trarre vantaggio.

 

 

Innanzitutto i font si dividono in due famiglie principali.

I Serif e i Sans Serif. Ma cosa vuol dire?
 

• I Serif sono i font con le così dette “grazie”, ovvero, delle piccole appendici presenti su alcune lettere.

Esempio:

 

 

• I Sans Serif, invece, sono quei font senza grazie.

Esempio:

 

Oltre a queste due schiere, però, ne esistono infinite altre.

Ad esempio i pixel font, utilizzati spesso come watermark, o i font calligrafici.

 

 

Ma con che criterio si abbinano tra loro i font?

C'è una regola di fondo da ricordare: bisogna creare contrasto, ma non troppo.

Ma cosa vuol dire? Vediamolo nel dettaglio.

 

Esempio 1 – Troppo poco contrasto:

In questo caso abbinando due basic font uno Serif e uno Sans Serif, notiamo che tra i due si genera davvero poco contrasto. Sono sufficientemente diversi per creare un senso di disturbo ma non abbastanza perché questo disturbo sia gradevole.

 

Esempio 2 – Troppo contrasto:

In questo caso, invece, il contrasto tra i due font è veramente eccessivo, in quanto entrambi presentano uno stile molto particolare.

 

 

Esempio 3 – Contrasto corretto:

Finalmente qui abbiamo un contrasto testuale gradevole.

 

 

 

Il consiglio, quindi è di evitare sia l'abbinamento “Serif + Sans Serif” che l'abbinamento tra due font eccessivamente diversi.

 

Inoltre è buona norma non utilizzare più di due font diversi insieme, fatta eccezione per casi estremamente circostanziali.

 

Discorso simile al precedente vale anche per il contrasto cromatico.

 

Esempio 1 – Troppo contrasto:

 

 

Esempio 2 – Poco contrasto:

 

 

Esempio 3 – Contrasto corretto:

 

 

Nel caso ci trovassimo ad utilizzare più di un font è consigliabile optare per due differenti sfumature dello stesso colore, oppure per un accostamento cromatico tra due colori non particolarmente in contrasto tra loro.

 

 

 

 

 

Esistono poi dei casi in cui la scelta di un font è quasi obbligata.

Immaginiamo di trovarci in una situazione simile a questa:

 

 

 

Non serve specificare che la versione corretta sia la prima.

Questo accade perché solitamente quando si è costretti ad avvalersi di caratteri “maiuscoli” è necessario utilizzare font Sans Serif, mentre bisogna sempre evitare i font calligrafici.

Per andare sul sicuro, è preferibile utilizzare font essenziali come ad esempio Intro.

 

Tuttavia, se la situazione lo richiede, si possono creare abbinamenti gradevoli anche con altri font più particolari, come Edo SZ, ad esempio:

 

 

 

Un'altra dritta da tenere a mente riguarda l'allineamento.

Bisogna assolutamente evitare di stabilire più di due allineamenti differenti, in una composizione testuale.

 

 

Esempio doppio allineamento corretto:

 

 

 

Esempio allineamento multiplo sbagliato:

 

 

Quindi, se allineate al centro e a sinistra, evitate di allineare a destra e così via dicendo.

 

Ovviamente questo discorso vale esclusivamente per gli allineamenti formali, in quanto è consuetudine, nelle icon ad esempio, utilizzare differenti allineamenti per creare giochi di forme e di colori.

 

L'ultima dritta che posso darvi è cercare di utilizzare font coerenti con il tema.

Un'immagine horror, ad esempio, difficilmente sarà abbellita da un font calligrafico dolce e sinuoso, meglio optare per qualche font splatter che richiami appunto il tema dell'immagine o, nel dubbio, un bel Sans Serif neutro.  

 

 

 

 

Spero di esservi stata utile, se avete domande non esitate a chiedere.

 

 

Ps. Non usate MAI il Comic Sans.

 

Solo per la scritta "sakura" questa guida va letta xD..appartenenti gli scherzi...bella e utile anche se non ho photoshop ho appreso  varie cose che posso mettere in pratica anche con picsart

[LightRay]

2 minuti fa, Kio_ ha scritto:

Breve storia triste: conosco gente che prende soldi per realizzare lavori di grafica e lo usa. :') 

Figurati, comunque. Grazie a te!

Gente che ha studiato ._. Oppure che ha un buon gusto innato, immagino xD

[Delta_]

2 minuti fa, Macasylveron ha scritto:

Solo per la scritta "sakura" questa guida va letta xD..appartenenti gli scherzi...bella e utile anche se non ho photoshop ho appreso  varie cose che posso mettere in pratica anche con picsart

ma sakura non voleva dire ciliegio?

[Kio_]

Adesso, Macasylveron ha scritto:

Solo per la scritta "sakura" questa guida va letta xD..appartenenti gli scherzi...bella e utile anche se non ho photoshop ho appreso  varie cose che posso mettere in pratica anche con picsart

E per le padelle volanti!

Felice di esserti stata utile, comunque.

 

Adesso, LightRay ha scritto:

Gente che ha studiato ._. Oppure che ha un buon gusto innato, immagino xD

Più che altro gente che non sapendo far nulla in particolare tira a campare facendo lavori per i quali non è qualificata. 
E ovviamente in un momento di crisi molti sperano di "risparmiare" assumendo un grafico più economico, non tenendo conto che così facendo rischiano di danneggiare terribilmente la propria immagine...

Spoiler

(E comunque sì, la persona in questione ha anche un sacco di buon gusto. Non si fa mancare nemmeno un difetto. )

 

Adesso, Delta_ ha scritto:

ma sakura non voleva dire ciliegio?

In questo caso è un riferimento a Sakura Kinomoto / Sakura Haruno, due personaggi che ho assai a cuore.

[Gallady]

On 14/3/2017 at 16:33, Kio_ ha scritto:

Breve storia triste: conosco gente che prende soldi per realizzare lavori di grafica e lo usa. :') 

Figurati, comunque. Grazie a te!

"Ei amik cia' mi hanno commissionato un lavoro lo sto facendo ora con Pauerpoint cercasi consigli professionali almeno quanto me"

Ottima guida comunque, soprattutto per chi è alle prime armi 

[Delta_]

1 minuto fa, Kio_ ha scritto:

E per le padelle volanti!

Felice di esserti stata utile, comunque.

 

Più che altro gente che non sapendo far nulla in particolare tira a campare facendo lavori per i quali non è qualificata. 
E ovviamente in un momento di crisi molti sperano di "risparmiare" assumendo un grafico più economico, non tenendo conto che così facendo rischiano di danneggiare terribilmente la propria immagine...

  Apri contenuto nascosto

(E comunque sì, la persona in questione ha anche un sacco di buon gusto. Non si fa mancare nemmeno un difetto. )

 

In questo caso è un riferimento a Sakura Kinomoto / Sakura Haruno, due personaggi che ho assai a cuore.

eh ma io sono noob .-. XD

[Kio_]

Adesso, Gallady ha scritto:

"Ei amik cia' mi hanno commissionato un lavoro lo sto facendo ora con Pauerpoint cercasi consigli professionali almeno quanto me"

Ottima guida comunque, soprattutto per chi è alle prime armi 

Citazione testuale. 

 

Grazie mille!

[MashMikan]

1 minuto fa, Delta_ ha scritto:

ma sakura non voleva dire ciliegio?

Card captor sakura...per ora sto impazzendo per sakura...è da tre giorni che guardo lanime in tv e cerco il manga...e no...fiori di ciliegio xD 

 

2 minuti fa, Kio_ ha scritto:

E per le padelle volanti!

Felice di esserti stata utile, comunque.

 

Più che altro gente che non sapendo far nulla in particolare tira a campare facendo lavori per i quali non è qualificata. 
E ovviamente in un momento di crisi molti sperano di "risparmiare" assumendo un grafico più economico, non tenendo conto che così facendo rischiano di danneggiare terribilmente la propria immagine...

  Apri contenuto nascosto

(E comunque sì, la persona in questione ha anche un sacco di buon gusto. Non si fa mancare nemmeno un difetto. )

 

La prossima volta metti "tsubomi"

Grazie

 

4 minuti fa, Kio_ ha scritto:

In questo caso è un riferimento a Sakura Kinomoto / Sakura Haruno, due personaggi che ho assai a cuore.

Ma sakura non è quella di card captor?...aspe...c'è ne sono due?

[Delta_]

2 minuti fa, Macasylveron ha scritto:

fiori di ciliegio xD 

ma diceva Sakura tree un anime(?)

Spoiler

vabbe scusa kio per l'ot

 

[MashMikan]

4 minuti fa, Delta_ ha scritto:

ma diceva Sakura tree un anime(?)

  Apri contenuto nascosto

vabbe scusa kio per l'ot

 

Esiste unanime del genere?