«Quale dimensione del carattere dovrei usare?»
«Come strutturare il mio contenuto?»
La tipografia è una delle competenze di base che ogni designer dovrebbe conoscere. Purtroppo però, pare che per molti “designer” questo sia un optional.
La tipografia è presente fin dalla nascita della scrittura, dai giornali ai libri, passando per le riviste fino ad arrivare sul web.
Possiamo vederla ovunque!
Il problema è che nonostante sembri semplice, è una di quelle abilità che si matura con il tempo e con molta pratica. Sempre che tu non sia un unicorno ? o il cliente che ne sa sempre più di te di te in materia.
Quindi, in questo articolo, condividerò con voi 4 punti che ho “scoperto” nel tempo e che avrei dovuto conoscere prima che la mia carriera di graphic designer iniziasse.
1. L’importanza non è data dalla dimensione del carattere, ma dal peso del carattere
Giusto per citare l’ormai povero Massimo Vignelli, le cui frasi sono ormai abusate tanto quanto il “Carpe Diem” tatuato sulle vostre braccia:
«You can say, “I love you,” in Helvetica. And you can say it with Helvetica Extra Light if you want to be really fancy. Or you can say it with the Extra Bold if it’s really intensive and passionate, you know, and it might work.»
Come ha detto il maestro Vignelli, è con il peso dei font che possiamo dare enfasi e importanza alle parole.
Diamo un’occhiata alla differenza dei due esempi di seguito:
Ho usato il Roboto Slab 32 pt per scrivere “I love you” così da mostrare fin da subito come sia un contenuto più importante rispetto a “more than pizza”che è di 23 pt.
Tuttavia per dare aumentare l’enfasi a “I love you” la dimensione non basta: manca ancora il contrasto che stiamo cercando per distinguerlo dal sottotitolo. E così, il peso dei font ci viene in soccorso.
Suggerimento extra:
Usando la stessa logica dell’esempio A precedente, ho usato 3 diverse dimensioni dei font: 32 pt per il titolo, 23 pt per la descrizione e 16 pt per scrivere il nome l’autore, mentre nella versione B ho mantenuto solo 2 dimensioni dei font: 32 pt per il titolo e 23 pt per descrizione e autore.
Formula segreta = dimensione + peso + colore
L’obiettivo non è quello di avere un carattere con tante dimensioni dello stesso peso, al contrario:
meno dimensioni e più pesi.
2. Usa le percentuali e non i punti per le dimensioni dei caratteri proporzionali
Eccomi, pronto a distruggere le convinzioni di molti studenti (me stesso di qualche anno fa compreso).
Tasto dolentissimo questo per i designer che non sanno mai QUANTO ridurre un font per una corretta gerarchia.
«Il titolo è 26 pt, quindi il sottotitolo potrei rimpicciolirlo un po’. 22 pt? facciamo 20 dai, arrotondiamo».
Questo è circa il tipico pensiero che mi ritrovavo a fare.
Quando avevo appena iniziato a “fare il grafico” mi basavo su aumenti e diminuzioni lineari aggiungendo +/-2 o +/-4 punti per creare una sorta di gerarchia, ma ben presto scoprì che non era l’ideale.
La differenza di 4 punti tra 14 pt e 18 pt sembra essere molto evidente,
ma dando un’occhiata al prossimo esempio notiamo come le cose cambino.
Come vedrete con i vostri stessi occhi, la differenza di 4 pt ora diventa praticamente impercettibile, e ad un occhio distratto potrebbe sembrare che i due testi condividano la stessa dimensione del font.
Per questo motivo è sempre meglio utilizzare le percentuali.
Nell’esempio sopra riportato, seguendo la regola della percentuale, il testo di 24 pt è il 150% di 16 pt.
Uno strumento che sto provando ultimamente per semplificarmi la vita è Modular Scale.
Vi basterà impostare la dimensione del carattere di base, che è la dimensione del carattere che si utilizzerà per il corpo del testo e quindi scegliere il rapporto o l’intervallo per le dimensioni.
Ora non dovete fa altro che scegliere il giusto peso.
3. Conoscere il layout dei caratteri
Non avete mai notato che la maggior parte dei layout di testo, soprattutto nel web, condividono qualcosa in comune?
I 3 esempi sopra hanno un certo formato, composto da una foto o icona in alto, seguita da un titolo e un testo.
Questi tipi di esempi seguono evidentemente questo schema:
Ovviamente non è obbligatorio seguire questo layout alla lettera.
Può variare avendo sempre cura di:
- Combinare 2 o più elementi;
- Riportarli nell’ordine corretto;
- Il titolo deve sempre essere presente.
4.Usa il titolo con saggezza ed efficacia
Al punto 3 ho detto che il titolo si mantiene sempre, perciò a questo punto, condividerò tre tips su come possiamo usare efficacemente i titoli e dare vita alla nostra struttura.
1- Rendilo un requisito
Avere titoli aggiunge maggior senso agli elementi e aiuta gli utenti a leggerli, decifrando più velocemente il contenuto.
2 -Rendilo dominante
Rendendo il titolo “dominante” rispetto agli altri testi, otterrete una struttura visiva più chiara e piacevole.
Per conferire maggiore importanza al titolo un buon consiglio è utilizzare seguendo la formula che ho condiviso al punto 1.
3 – Posiziona i titoli in alto
I titoli dovrebbero occupare uno dei primi 3 livelli di una struttura.
Seguendo lo stesso esempio di prima, si può notare come il titolo sia posizionato dopo il “pinnacolo” e il preludio, facendo quindi ancora parte dei primi 3 livelli.
Bene, ora non avete più scuse per sbagliare.
