La gerarchia visiva è un elemento importante in qualsiasi progetto di design. Indica alle persone dove guardare e quali sono le cose sullo schermo o la pagina stampata più importanti. La gerarchia dà ai lettori un'idea di come leggere il materiale dall'inizio alla fine con segnali visivi e flusso.
Mentre è possibile creare una gerarchia visiva utilizzando diversi strumenti, oggi esamineremo i modi per creare una struttura con solo la tipografia. (E dai un'occhiata alle immagini utilizzate in questo post: sono tutti esempi di grande gerarchia di tipi in azione).
Perché la gerarchia è importante
Digitare la gerarchia organizza e dà ordine agli elementi di testo nella progettazione. Proprio come i web designer e gli sviluppatori usano i tag di intestazione - h1, h2, h3 e così via - per organizzare l'importanza del testo, la gerarchia visiva usa segnali visivi. Inoltre, la gerarchia dei tipi consente ai lettori di eseguire la scansione del testo, leggendo più velocemente tipi di bit in blocchi uguali.
Generalmente, i lettori di lingua inglese iniziano in alto a sinistra e leggono su e giù. Il tipo è spesso organizzato per rispecchiare questo comportamento.Generalmente, i lettori di lingua inglese iniziano in alto a sinistra e leggono su e giù. Il tipo è spesso organizzato per rispecchiare questo comportamento. Ma cosa succede se il testo più grande e più audace è a metà pagina? Spesso un lettore inizia da lì e poi torna all'inizio della pagina e continua con il normale comportamento di lettura.
La gerarchia è importante perché consente al progettista di determinare ciò che qualcuno leggerà prima, secondo e così via. Per questo motivo, il progettista può creare il tipo in modo tale da sapere quali informazioni possono essere ricevute e in quale ordine.
Poiché la creazione della gerarchia è importante per i progettisti, è altrettanto importante per i lettori. Una buona gerarchia visiva ci dice cosa è importante, rendendo la lettura molto più semplice. Ad esempio, sai che il titolo è la parte più importante (o che attira l'attenzione) di una storia o di un articolo perché è la più grande, seguita da sottotitoli e poi il testo del corpo. Per motivi di scansione, è possibile leggere il testo grande per farsi un'idea se l'articolo ti interessa prima di investire un sacco di tempo nella copia.
Come creare la gerarchia
Non esiste una soluzione in un'unica soluzione per creare una gerarchia visiva con il testo. Può essere creato con dimensioni, peso, colore, trama, scelte e combinazioni di caratteri, orientamento e spazio o una combinazione di questi strumenti.
Taglia
Uno dei modi più semplici per stabilire la gerarchia con il tipo è attraverso la dimensione. I lettori vedranno spesso il tipo più grande e inizieranno a leggere da lì.
In relazione alle dimensioni, la scala è altrettanto importante. Per creare una gerarchia distinta, le dimensioni devono avere una varianza significativa rispetto ad un altro tipo nella pagina. La cosa da tenere a mente è che i diversi tipi di caratteri possono variare in modo diverso, quindi cambiare la dimensione del punto potrebbe non essere sufficiente; è necessario esaminare come i caratteri tipografici interagiscono per garantire che le dimensioni e la scala siano adeguatamente bilanciate.
Quindi, come iniziare con la creazione della giusta dimensione e dimensione del tipo per un progetto? Inizia con il testo del corpo principale e vai da lì. E per gli elementi di testo che sono utilizzati per attirare davvero le persone, vai alla grande.
Ecco alcune percentuali per aiutarti a iniziare:
- Copia del corpo principale (14 punti)
- Intestazioni principali: 250 percento in più rispetto alla copia del corpo principale (35 punti)
- Intestazioni secondarie: 175 percento in più rispetto alla copia del corpo principale (25 punti)
- Elementi di navigazione: 165 percento in più rispetto alla copia del corpo principale (23 punti)
- Navigazione o menu secondari: 140 percento in più rispetto alla copia del corpo principale (20 punti)
Caratteri di stampa
Dopo la dimensione, i caratteri tipografici sono l'elemento più utilizzato in termini di creazione della gerarchia tipografica. La chiave è avere contrasto tra caratteri tipografici. (Questo è uno dei motivi per cui i progettisti spesso scelgono un serif e un tipo di carattere sans serif per un progetto.)
Per le migliori combinazioni, cerca caratteri di diverso peso avendo un tono o una sensazione simile. Se si utilizzano caratteri tipografici arrotondati, attenersi a forme di lettera con forme simili nella o, ad esempio. Optate per caratteri tipografici con altezze x simili se gli stili saranno utilizzati in linea l'uno con l'altro per tutto il progetto.
Peso
Lo spessore dei tratti nel tipo selezionato per un progetto può anche creare una gerarchia. Più è spesso il carattere, più appare in grassetto e più grande. I caratteri chiari, condensati e sottili spesso appaiono più piccoli di quanto non siano in realtà. I caratteri in grassetto, ultra e a testa di martello possono apparire più grandi di quanto la dimensione in punti possa rappresentare.
Quanto grande o piccolo un carattere tipografico appare in termini di peso è anche relativo agli altri caratteri tipografici usati nel progetto. L'abbinamento di caratteri spessi e sottili crea immediatamente un senso di gerarchia con lo spesso stile che conferisce l'aspetto di maggiore importanza (spesso anche se in realtà è più piccolo sul display).
Colore
L'uso del colore può anche aggiungere enfasi e aumento di peso al testo. Pensa ad alcune delle regole di colore che hai imparato da bambino: i colori caldi (rossi, gialli, marroni) avranno più effetto mentre i colori freddi (blues, viola, grigi) svaniranno.
Quando si utilizza il colore per stabilire la gerarchia, considerare le tonalità utilizzate per il primo piano, il tipo e lo sfondo. Anche il contrasto dei colori avrà un ruolo importante. I colori più saturi o più brillanti saranno spesso? dallo schermo contro i toni più tenui.
Orientamento
In che modo il test riposa in un layout successivo rispetto ad un altro testo può influire sulla gerarchia generale. In genere, la maggior parte del testo è orientata orizzontalmente in linea retta attraverso lo schermo. Ma cosa posiziona il testo verticalmente?
Questo cambiamento di orientamento porterà l'attenzione su quelle parole o blocchi di testo, facendolo sembrare l'elemento più importante. Inclinare, torcere o altrimenti alterare la forma del testo in qualsiasi modo può ottenere lo stesso effetto. (Va notato che la maggior parte dei progettisti spesso evita questi trucchi del tipo? Tranne che per alcune circostanze.)
Spazio
Lo spazio bianco può rendere il testo più grande e più leggibile. La mancanza di spazio bianco può farla sentire più stretta e più piccola. Usa lo spazio a tuo vantaggio quando crei un senso di gerarchia.
Pensa allo spazio che usi tra le righe di testo. Pensa al kerning per i più grandi stili di caratteri. Pensa alla relazione spaziale tra le lettere e il bordo della tela. Pensa alle relazioni tra tipo di diverse dimensioni, stili e colori.
Ogni singolo spazio può influire sulla tua scala gerarchica. Mantieni un tipo simile raggruppato più vicino e con meno spazio degli oggetti non correlati. E progetta il tuo spazio in modo che il testo cada in un ordine distinto. Elementi di testo più grandi, più audaci e più luminosi spesso richiedono più spazio rispetto a blocchi di testo più piccoli e più semplici.
Struttura
La trama è un concetto allentato in termini di tipo. No, non stiamo parlando di mettere una trama all'interno del lettering; ci riferiamo alla creazione di un modello di texture con il modo in cui le lettere e le parole riposano sulla pagina o sullo schermo.
All'interno di blocchi di testo, si ottiene un aspetto con motivi. Per stabilire più gerarchia, rompere il modello. Ciò può essere realizzato utilizzando uno degli strumenti già menzionati o modificando qualcosa di semplice come l'allineamento di un singolo blocco di testo.
Questo cambiamento nella trama complessiva del testo può avere un impatto reale su come viene percepito. Fai attenzione però a troppe modifiche strutturali, perché possono distrarre se usate frequentemente.
3 (o 4) livelli di tipo
Mentre alcuni progetti richiedono gerarchie complesse, la maggior parte dei progetti può avere successo con tre livelli di gerarchia tipografica. Questi livelli sono di tipo primario, di tipo secondario e di tipo terziario. (In questa scala non includo banner o tipo di logo, sarebbero considerati un quarto livello di tipografia.
Tipo primario è spesso la tipografia sulla pagina con il peso più visivo, come le intestazioni principali o le citazioni del display. Lo scopo del tipo primario è quello di portare i lettori nella progettazione generale.
Tipo secondario è tutto il resto che non è il contenuto principale. Questo può includere didascalie, sottotitoli e elementi di tipo statico o di navigazione.
Tipo terziario è la copia del corpo principale. C'è una cosa da ricordare sulla copia terziaria: deve essere leggibile. Poco altro importa quando si tratta dello stile di progettazione di questo livello di tipo.
Tipo di arte è un tipo usato come elemento grafico. Cade fuori dal regno reale del tipo ed è molto più visivo. Questo può includere banner o loghi. Può includere immagini composte da caratteri o qualsiasi altro elemento tipografico fortemente progettato. In genere, il tipo di arte consiste solo di una singola parola di lettere e non fa parte di ciò che ci si aspetta che le persone leggano? nel design generale.
Conclusione
Il tipo di organizzazione può essere sia divertente che stimolante. Combinando tecniche e diversi tipi di effetti e stili, puoi facilmente ottenere un flusso con solo tipo.
Ricordarsi di considerare le relazioni tra dimensioni, peso, colore, trama, scelte e combinazioni di caratteri tipografici, orientamento e spazio durante la creazione di un contorno. Pensa a come le persone leggono e digeriscono le informazioni quando usano queste tecniche in modo che la copia sia organizzata e fluisce in un formato logico per il design tipografico più utilizzabile.