La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 1 La tipografia Balbuzie digitale Le regole per luso del colore e del carattere tipografico.

Presentazioni simili


Presentazione sul tema: "AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 1 La tipografia Balbuzie digitale Le regole per luso del colore e del carattere tipografico."— Transcript della presentazione:

1 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 1 La tipografia Balbuzie digitale Le regole per luso del colore e del carattere tipografico valide per la stampa non sono applicabili in toto allo schermo. Infatti, se abitualmente vale Stampa foglio di carta bianca + testo nero Schermo sfondo bianco + testo nero, vale ancora?

2 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 2 La tipografia Balbuzie digitale Trasferimento che non considera le differenze tra i due media: Stampa foglio di carta bianca e il testo nero come oggetti tangibili, il colore con sostanza di pigmento Schermo sfondo bianco costituito da onde luminose, il testo nero come assenza di luce. Dopo un certo lasso temporale lirraggiamento diventa irritante per gli occhi.

3 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 3 La tipografia Balbuzie digitale Conclusione Ciò che funziona per la stampa non può essere semplicemente trasferito allo schermo così comè. Per innovare bisogna infrangere le regole. Ma per infrangere le regole bisogna conoscerle. Tuttavia le regole per la stampa sono un bagaglio di partenza e un punto di riferimento utile. Leggibilità a stampa e a schermo completamente diverse. Non scegliere il colore solo per comunicare una certa emozione, ma considerare da subito la leggibilità.

4 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 4 La tipografia Elementi di base Anatomia del carattere tipografico Le lettere hanno braccia, gambe, occhi, code, gambe … T braccio gamba f ascendente p discendente asta Linea della maiuscola Linea base occhiello o pancia A apice traversa Linea superiore Linea inferiore

5 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 5 La tipografia Classi di caratteri Nella tipografia moderna due sono le forme basilari di carattere: Antique serif = con grazie Grotesque sans serif = senza grazie o bastoni Serif Bast oni Con o senza differenti spessori delle asteCon differenti spessori delle aste

6 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 6 La tipografia Classi di caratteri Antique serif = con grazie Grotesque sans serif = senza grazie o bastoni Serif Bastoni Si utilizzano per testi nelleditoria di libri e giornali. Si utilizzano per titoli, intestazioni e pubblicità

7 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 7 La tipografia Classi di caratteri Antique serif = con grazie Grotesque sans serif = senza grazie o bastoni A dimensione standard sono meno adatti allo schermo, adatti alla stampa. Se si deve utilizzarli, scegliere quelli con grazie e aste non troppo sottili. Sono più adatti alla griglia di pixel dello schermo.

8 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 8 La tipografia Classi di caratteri Antique serif = con grazie Grotesque sans serif = senza grazie o bastoni Baskerville Bodoni Bookman Garamond Goudy Lucida Palatino Times … Avant Garde Arial Impact Futura Gill Sans Helvetica Tahoma Verdana …

9 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 9 La tipografia Famiglie di caratteri Mappa grammaticale di una convenzionale famiglia di caratteri ampia. I filetti spessi indicano lestensione della famiglia nucleare. Muoversi lungo qualunque linea, tuttavia il salto di una tappa corrisponde a unellisse: cortocircuito delle regole grammaticali.

10 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 10 La tipografia Famiglie di caratteri La famiglia di caratteri lega insieme i componenti grazie a caratteristiche visive simili. I membri di una famiglia si assomigliano, ma conservano la loro individualità dei tratti. I membri di una famiglia hanno differenti pesi e spessori. Alcune famiglie hanno molti membri, altre sono ridotte a pochi.

11 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 11 La tipografia Famiglie di caratteri Le famiglie più estese possono avere caratteri sia serif che bastoni.

12 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 12 La tipografia Unità di misura dei caratteri Due unità di misura principali: Pica per misurare la lunghezza delle righe Punti per specificare la grandezza del carattere (corpo) distanza tra le righe (interlinea)

13 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 13 La tipografia Evidenziazione dei caratteri - Stampa Varie opzioni per evidenziare i passaggi di un testo con dimensione del carattere uniforme: Spessore e stile Thin, Semi-bold, Bold, Italic… Spaziatura Narrow, Broad Maiuscoletti e maiuscole Caratteriserif e sans serif compresenti Modifica della dimensione del carattere (con parsimonia) Scegliere solo alcune di queste opportunità, non usarle tutte insieme!

14 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 14 La tipografia Interlinea - Stampa Linterlinea garantisce al lettore una lettura agile. Misurata a partire dalla linea di base fino alla mediana della riga successiva, deve essere pari a 1,5 altezza della x. Per linee particolarmente lunghe utilizzare uninterlinea maggiore. Se linterlinea è eccessiva, il lettore oltre alle righe vede anche gli spazi negativi in mezzo. Lalternanza di elementi positivi e negativi irrita locchio. Extrema ratio is a brand of world wide extension

15 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 15 La tipografia Dimensioni del carattere - Stampa La dimensione come variabile fondamentale ai fini della leggibilità del testo I testi stampati a 6 pt non si leggono I titoli dovrebbero essere tra 14 e 18 I sottotitoli tra 12 e 14 Per i testi mantenere una dimensione minima di 8/10 pt

16 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 16 La tipografia Dimensioni del carattere - Stampa La dimensione del carattere dipende da formato in cui deve apparire il testo (es. Fax, quotidiano, formato A4…) larghezza della colonna quantità di testo

17 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 17 La tipografia Layout del testo - Stampa Una riga normale ha una lunghezza di circa 50 caratteri. Utilizzare linterlinea automatica. Righe con più di 50 caratteri richiedono uninterlinea extra, per aiutare a trovare il capo delle riga successiva. Se le righe sono troppo corte, può essere difficile leggere, salvo i casi di note in cui il testo è breve. Se le righe sono più corte si può utilizzare un corpo del carattere più piccolo.

18 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 18 La tipografia Allineamento dei caratteri - Stampa Lallineamento dei caratteri determina laspetto tipografico di un testo. Nei giornali il testo è giustificato e utilizza lintera larghezza della colonna. Negli inviti il testo è allineato al centro. Adatto solo per piccole porzioni di testo. Il testo giustificato a destra o a sinistra si dice a bandiera a desta (b/d) o a bandiera a sinistra (b/s). Evita i buchi del testo giustificato. Ma utilizzare solo per testi brevi il b/d.

19 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 19 La tipografia Spaziatura tra le lettere - Stampa tracking distanza tra le lettere. La scelta giusta di questo parametro dipende dal carattere, dal corpo, dal peso scelto. Deve risultare un texture tipografica armoniosa (con leggerezza e pesantezza bilanciate). I caratteri piccoli hanno necessità di un tracking maggiore rispetto alle lettere più grandi.

20 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 20 La tipografia Spaziatura tra le parole - Stampa kerning distanza tra le parole. Devessere proporzionato al tracking, le lettere devono confluire con ritmo e grazia nelle parole. Ricordare il fattore di vicinanza nella leggibilità. Evitare eccessive concentrazioni di carattere neri seguiti da buchi bianchi troppo ampi. Se aumenta il treking aumentare anche il kerning. I caratteri narrow e bold possono avere spaziature inferiori tra le lettere e le parole.

21 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 21 La tipografia Tipografia e leggibilità a schermo Leggere a schermo è faticoso. Evitare i testi lunghi. Nei libri e riviste il layout è sempre molto denso per motivi economici. Lo spazio della schermata non ha questo problema. Usare uninterlinea ampia.

22 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 22 La tipografia Tipografia e leggibilità a schermo I caratteri convenzionali (print font) non possono essere semplicemente trasferiti sullo schermo. I caratteri stampati hanno una risoluzione tra 1200 e 2400 dpi, contro i 72 dpi del carattere a schermo! Esistono particolari caratteri per lo schermo (detti screen font), il cui design è adattato alla risoluzione di schermo = 72 dpi ed ottimizzato per la lettura Chicago (quello del Mac) Verdana Georgia (alternativo al Times su PC) Geneva Monaco New York (Times New Roman su Mac)…

23 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 23 La tipografia Gli screen font Il designer (es. Matthew Carter per Microsoft) ha considerato ogni singolo carattere a livello di pixel, e ne ha ottimizzato le forme per farli 'funzionare' costretti nelle rigide maglie della griglia dello schermo. Ecco perché il corsivo risulta sempre brutto, specie nelle piccole dimensioni: infatti non collima con una griglia perfettamente squadrata di pixel e pertanto va usato solo quando assolutamente inevitabile.

24 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 24 La tipografia Lantialiasing - Schermo L'antialiasing è una sfumatura che rende il contorno delle lettere più morbido attraverso l'utilizzo di pixel intermedi fra il colore di primo piano e di sfondo.

25 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 25 La tipografia Lantialiasing - Schermo Espediente per superare la scalettatura dei contorni delle lettere dovuta alla bassa risoluzione del monitor. Molto efficace per dimensioni del carattere più grandi, a piccole dimensioni crea una sfocatura fastidiosa che ostacola la lettura. Es. l'Arial a 18 punti rende bene, ma lo stesso carattere a 12 punti risulta troppo sfocato, mentre un carattere più 'leggero' come il Courier risulta evanescente anche alla stessa dimensione di 18pt.

26 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 26 La tipografia Lantialiasing - Schermo Consiglio usare l'anti-aliasing solo per le headlines, e uno 'screen font' senza anti-alias per le piccole dimensioni (meno di 18 punti.

27 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 27 La tipografia Gli stili light, normale, bold - Schermo La leggibilità a schermo dipende dalla scelta cromatica di testo e sfondo (ricordare il triangolo del colore). Se lo sfondo è bianco, i bordi del carattere tendono a essere bruciati per effetto della sovraluminosità, dunque il carattere sembra più sottile. Compensare scegliendo un carattere dalle aste più spesse, oppure scurire lo sfondo. Gli stili light e ultralight su schermo vanno solo a dimensioni molto grandi. Per normali e bold aumentare il traking.

28 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 28 La tipografia Dimensione del carattere - Schermo I titoli dovrebbero essere tra 18 e 20 pt I sottotitoli tra 16 e 18 Per i testi mantenere una dimensione minima di 10 pt, meglio tra 11 e 14 pt Considerare il contrasto con lo sfondo. Un colore chiaro su sfondo scuro appare più grassetto di un colore scuro sullo stesso sfondo, a causa dellalone di sovraluminosità che emana.

29 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 29 La tipografia Spaziatura tra le lettere - Schermo Il testo su schermo dovrebbe avere un tracking da 5 a 10 unità per garantire una maggiore leggibilità. Se si diminuisce il tracking le lettere tendono a fondersi. Es. r+n=m, c+l=d. I grassetti devono avere tracking maggiore dello stile normale. Se però il tracking è eccessivo le parole tendono a spezzarsi.

30 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 30 La tipografia Interlinea - Schermo Normalmente linterlinea a schermo è pari al 120% dellinterlinea singola (impostazione Auto). Nellinterlinea singola i discendenti e gli ascendenti di 2 linee consecutive paiono toccarsi. 35 caratteri/riga sono la lunghezza ideale su schermo. Linterlinea ideale = 150% della singola. Caratteri expanded e light richiedono uninterlinea maggiore di quelli narrow e bold.

31 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 31 La tipografia Interlinea - Schermo Nell'HTML non esiste ancora il concetto di interlinea (il CSS non è ancora supportato a dovere dai browser)CSS Esiste un trucco per simulare l'interlinea: inserire spazi di maggiori dimensioni all'interno di righe di testo. Il tag: (resta inteso che naturalmente il SIZE=+1 può essere aumentato, se necessario).

32 AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 32 La tipografia Lunghezza della riga - Schermo Il limite massimo è di 35 caratteri per riga o anche meno. Limitare la lunghezza della riga con uno dei seguenti metodi: usare la funzione BlockQuote inserire un (break) dove si desidera andare a capo costringere il testo in colonne di una data larghezza usando delle tabelle La lunghezza della riga è in relazione allinterlinea.


Scaricare ppt "AA 2004/05Prof. Paola Trapani – Comunicazione Visiva La tipografia 1 La tipografia Balbuzie digitale Le regole per luso del colore e del carattere tipografico."

Presentazioni simili


Annunci Google