Anatomia di un carattere

2. INTERMEZZO TIPOGRAFICO: ovvero Anatomia di un carattere conoscere le ragioni dietro alle forme Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 1/50

Ciò che rende la tipografia affascinante, e un ambito di ricerca fondamentale per chiunque si occupi di progettazione, è che questa disciplina rappresenta lo sforzo di dare alla parola scritta un efficacia e una forza sempre maggiori. Attraverso di essa si rivelano le personalità, i fattori politici ed economici, i progressi della scienza. Costituisce una celebrazione del progresso umano e, anche, un indicatore vitale e raffinato dei nostri valori. lewiss blackwell Anno Accademico 20014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 2/50

La forma delle lettere deriva dallo strumento usato per disegnarle. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 3/50

Luca Barcellona Anno Accademico 20014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 4/50

FONT: Un assortimento coerente di tipi o glifi. Nel mondo dei caratteri in metallo, la parola indica un alfabeto completo di tutti i caratteri accessori per un dato corpo. Nel mondo dei caratteri digitali, la font corrisponde alla tavolozza dei glifi, ovvero alla loro codificazione digitale. robert bringhurst Anno Accademico 20014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 7/50

Forme e controforme: Ogni lettera è costituita da: nero (tratti) + bianco (controforme). Le forme bianche, generate dai tratti neri, hanno la funzione di mantenere equilibrati i tratti neri non si può modificare l una senza influenzare l altra Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 8/50

Forme e controforme: Nella realtà le parole sono formate da lettere adiacenti Il rapporto tra forma e controforma è alla base della percezione. La chiave sta nel ritmo tra bianchi e neri. spazio fra le forme uguale Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 9/50

Forme e controforme: Nella realtà le parole sono formate da lettere adiacenti Il rapporto tra forma e controforma è alla base della percezione. La chiave sta nel ritmo tra bianchi e neri. spazio fra le forme diverso / simile percezione Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 10/50

Nella scrittura così come nella tipografia i bianchi e i neri si susseguono in un insieme ritmico. SENZA QUESTO RITMO NON ESISTE LA PAROLA La lettura infatti è resa possibile dall interruzione dell identità della riga, che permette di distinguere le parole in unità ritmiche. Esiste un legame ritmico tra il bianco e i tratti neri: Le forme influiscono sulla spaziatura, così come lo spessore dei tratti. Trovare l equilibrio tra i bianchi ed i neri è la chiave di qualunque carattere tipografico. Anno Accademico 20014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 11/50

Lo spessore dei tratti: Questi spessori sono uguali o differenti? Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 12/50

Lo spessore dei tratti: Questi spessori sono uguali o differenti? E T F H L I Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 13/50

Lo spessore dei tratti: L occhio umano percepisce diversamente uno spessore orizzontale, ed uno identico ma verticale. T 88 100 Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 14/50

Lo spessore dei tratti: L occhio umano percepisce diversamente uno spessore orizzontale, ed uno identico ma verticale. 96 103 Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 15/50

Posizione dei tratti: Anche la posizione dei tratti è studiata per sembrare otticamente al centro. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 16/50

Posizione dei tratti: Anche la posizione dei tratti è studiata per sembrare otticamente al centro. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 17/50

Posizione dei tratti: Anche la posizione dei tratti è studiata per sembrare otticamente al centro. 323 435 373 448 Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 18/50

Posizione dei tratti: Anche la posizione dei tratti è studiata per sembrare otticamente al centro. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 19/50

Posizione dei tratti: Ne consegue che le lettere hanno normalmente vuoti più ampi nella parte inferiore della lettera. SZ ZS esatto errato Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 20/50

Rapporto fra le forme: altezza delle lettere Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 21/50

Rapporto fra le forme: altezza delle lettere Apici e curve sporgono in alto e in basso, rispetto all altezza delle forme squadrate Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 22/50

Rapporto fra le forme: altezza delle lettere Apici e curve sporgono in alto e in basso, rispetto all altezza delle forme squadrate AHOV Brandon Grotesque Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 23/50

Rapporto fra le forme: altezza delle lettere Apici e curve sporgono in alto e in basso, rispetto all altezza delle forme squadrate QUICK Proforma Book Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 24/50

Rapporto fra le forme: altezza delle lettere Apici e curve sporgono in alto e in basso, rispetto all altezza delle forme squadrate Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 25/50

Anatomia dei caratteri vertice asta ascendente obliqua occhiello orecchio raccordo o staffa barra o asta orizzontale collo cappio discendente grazia Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 26/50

Anatomia dei caratteri pancia asta ascendente braccio verticale cassa sperone occhiello gamba o coda coda pancia Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 27/50

Anatomia dei caratteri Asse: l inclinazione in base alla quale vengono tracciate le lettere. Si evince dal contrasto. asse verticale Bodoni asse inclinato Proforma Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 28/50

Anatomia dei caratteri Contrasto: differenza fra i tratti più spessi e quelli più sottili. Didot (contrasto alto) Jenson (contrasto ridotto) Akkurat (nessun contrasto) Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 29/50

Anatomia dei caratteri maiuscole accentate corpo occhio altezza maiuscole ascendenti altezza della x linea di base discendenti Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 30/50

Anatomia dei caratteri L occhio medio del carattere o altezza della x cambia a seconda del disegno del carattere Garamond corpo 190pt Gill sans corpo 190pt News Gothic corpo 190pt Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 31/50

Anatomia dei caratteri L interlinea è la distanza che passa tra la linea di base e la linea in alto che determina l altezza della x o l occhio medio. oxp yxb oxp yxb oxp yxb Arno Pro corpo 110 / interlinea 112pt Akkurat corpo 110 / interlinea 112pt Filosofia corpo 110 / interlinea 112pt Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 32/50

Spaziatura La spaziatura è un valore numerico attribuito ad ogni singola lettera che ne determina lo spazio che va a collocarsi a destra e a sinistra. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 33/50

Spaziatura TITOLO Fazeta Display corpo 85 / spaziatura negativa (-40) TITOLO Fazeta Display corpo 85 / spaziatura regolare (0) TITOLO Fazeta Display corpo 85 / spaziatura espansa (80) TITOLO Neutra Display Thin corpo 85 / spaziatura negativa (-40) TITOLO Neutra Display Thin corpo 85 / spaziatura regolare (0) TITOLO Neutra Display Thin corpo 85 / spaziatura espansa (80) Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 34/50

Kerning Il Kerning è una variazione sistematica della spaziatura, per casi particolari. Lo spazio tra le lettere non è costante ma varia a seconda dei casi. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 35/50

Kerning / Keming Kerning Kerning Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 36/50

Legature Sono glifi creati per ovviare al problema di caratteri che, accostati, si sovrappongono. fi ffi fl ffl ffj fi ffi fl ffl ffj arno pro Display Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 37/50

Legature / 2 b 1 h 3 j 4 r 7 t 8 d 9 5 c p s g i u m n q k v w x y z a e o & * + @ A B C D E F G H I J K L M N O P Q R S T U V W X Y Z ` Mrs Eaves Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 38/50

how to Legature: attivare le differenti versioni in Indesign 1. Dal menu Character selezionate il sottomenu 2. Nel menù trovate la voce ligatures. Inoltre sotto la voce Opentype trovate le ulteriori possibilità che il carattere offre Per cercare i singoli glifi (anche le legature) si può usare il pannello Glyphs Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 39/50

Numeri 1234567890 1234567890 1234567890 1234567890 Mr Eaves: numeri saltellanti o oldstyle Mr Eaves: numeri maiuscoli, cardinali o lining Mr Eaves: numeri saltellanti o oldstyle tabulari Mr Eaves: numeri maiuscoli, cardinali o lining tabulari Dal 1234 dal 1234 DAL 1234 Con il minuscolo l ideale è usare i numeri saltellanti Con il maiuscoletto è preferibile usare i numeri saltellanti Con il maiuscolo è preferibile usare i numeri maiuscoli o cardinali Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 40/50

how to Numeri: attivare le differenti versioni in Indesign 1. Dal menu Character selezionate il sottomenu 2. Sotto la voce Opentype trovate le possibilità che il carattere offre Quando si compila uno stile di testo o di paragrafo, si possono pre-impostare le funzioni Opentype Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 41/50

Tondo, corsivo, maiuscolo e maiuscoletto... e unicase Tondo, corsivo, MAIUSCOLO, maiuscoletto,... unicase Filosofia Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 42/50

how to Maiuscoletto B. Se siamo nella finestra del testo, la barra in alto comprende anche i pulsanti di cambio stile parola. Fra questi vi è il pulsante Small Caps A. Dal menu Character selezionate il sottomenù dove trovate la voce small caps C. Quando si compila uno stile di testo o di paragrafo, si possono preimpostare l utilizzo del maiuscoletto Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 43/50

how to Maiuscoletto Le impostazioni costringono il programma a disegnare un maiuscoletto anche se la font non lo prevede. Non è sempre giusto usare questa potenzialità. Ciao Ciao Ciao Freight Sans roman Freight Sans roman: maiuscoletto forzato Freight Sans roman SC: maiuscoletto disegnato Nel caso al centro è evidente che il maiuscoletto è calcolato dal computer tramite riduzione delle maiuscole. Si nota eccessivamente la differenza di peso fra le lettere. Da non usare assolutamente quindi quando c è la possibilità, sulla stessa pagina, di paragonare le lettere. F Il maiuscoletto può essere presente all interno di una font e essere attivato con le funzioni Opentype, oppure esistono caratteri che hanno il maiuscoletto come font separata. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 44/50

Segni di interpunzione certo certo certo certo certo «certo»»certo«virgolette semplici o apici 'certo' ERRORI "certo" Virgolette alte: inglesi, spagnole e tedesche Virgolette basse: italiane e tedesche l anno Apostrofo l'anno ERRORI 60'=1 Simbolo dei primi orari Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 45/50

Accenti E E' È ERRORI Esiste un glifo apposito per la maiuscola accentata ed è questo simbolo che deve essere usato! po pò da treccani.it: La grafia corretta è un po con l apostrofo, perché la forma po è il risultato di un troncamento (poco po ). Pur scorretta, la grafia pò con l accento risulta sempre più diffusa. Basta una rapida ricognizione in rete per accorgersi che un pò non si trova solo larghissimamente nei blog e nei forum, ma anche in comunicati stampa, report aziendali e brochure pubblicitarie, per non dire di tesi e tesine. E lo stesso vale, a maggior ragione, per i messaggini SMS, in cui il sistema di scrittura veloce T9 quando si digita la sequenza p + o fa apparire automaticamente sullo schermo la grafia errata pò (con l accento), costringendoci per digitare quella corretta a operazioni molto più complicate. Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 46/50

FAMIGLIA DI CARATTERI: Insieme coerente di più font. Le font possono variare per peso, stile, e tipologia. Anno Accademico 20014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 47/50

Peso di un carattere: Light Hairline Thin Ultra-light Extra-light Light Book Normal / regular / plain Medium Demi-bold / semi-bold Bold Extra-bold / extra Heavy Black Extra-black Ultra-black / ultra Regular Medium Bold Black Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 48/50

Stile di un carattere: Extracompressed Compressed ExtraCondensed Condensed Regular Extended UltraExtented Expandend UltraExpanded Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 49/50

2. INTERMEZZO TIPOGRAFICO Fine Anno Accademico 2014/2015 LABORATORIO DI DESIGN DELLA COMUNICAZIONE 2 50/50