Capitolo 4 La tipografia Portare il testo nel Web Sostituzione del testo con immagini Web font

Transcript

1 Indice Prefazione... XI A chi si rivolge questo libro... XIII Contenuti del libro... XIII Per saperne di più... XIV I forum di SitePoint... XIV Il sito web del libro... XV Aggiornamenti ed errata corrige... XV Le newsletter di SitePoint... XV I podcast SitePoint... XV Feedback dai lettori... XV Ringraziamenti... XVI Convenzioni adottate nel libro... XVI Esempi di codice... XVI L autore...xvii Il consulente tecnico...xvii Il revisore tecnico...xvii Il responsabile dello sviluppo...xvii Il sito SitePoint...XVIII Capitolo 1 Layout e composizione...1 La progettazione...2 Osservazione...3 Analisi...5 Implementazione...6 Definizione di un buon design...7 Anatomia di una pagina web...9 La teoria della griglia La regola dei terzi Il 960 Grid System... 15

2 VI Indice Equilibrio Equilibrio simmetrico Equilibrio asimmetrico Unità del layout Prossimità Ripetizione Enfasi Posizionamento Continuità Isolamento Contrasto Proporzione Layout fondamentali Navigazione a colonna sinistra Navigazione a colonna destra Navigazione a tre colonne Trovare l ispirazione Utilizzare un file morgue Le tendenze più recenti Lo stile rivista, privo di navigazione Minimalismo nudo e crudo Ridimensionamento: layout fisso, fluido o dinamico Larghezza fissa Larghezza variabile Una soluzione alternativa: i layout dinamici La risoluzione dello schermo Un applicazione concreta: Southern Savers Per iniziare Capitolo 2 Il colore...49 La psicologia dei colori Associazione di colori La temperatura dei colori I valori cromatici Saturazione Teoria di base dei colori Rosso, giallo, blu o CMYK Gli schemi colore Schema di colori monocromatico Schema di colori analoghi... 68

3 Indice VII Schema di colori complementari Colori split complementari, triadici e a rettangolo Altre combinazioni di colori Creare una tavolozza di colori La notazione esadecimale Strumenti e risorse per l uso dei colori Color Scheme Designer Adobe Kuler COLOURlovers Color Stream, app per iphone Pictaculous Colour Contrast Check Applicazione dei colori: i coupon Southern Savers Capitolo 3 La texture...89 I punti Le linee Le forme Angoli arrotondati Rotazione delle forme Forme e layout Volume e profondità Prospettiva Proporzioni Luci e ombre Pattern Realizzare una texture Stile invecchiato, segnato dal tempo, logoro e nostalgico Pulita e granulare Lo stile album artigianale Lo stile estroso a cartoni animati Texture minimaliste Iniziate a sviluppare un vostro stile personale Un applicazione concreta: ritagliare e risparmiare Capitolo 4 La tipografia Portare il testo nel Web Sostituzione del testo con immagini Web font 132

4 VIII Indice Auto-hosting dei web font Servizi di font web sifr e Cufón Anatomia della forma di una lettera Spaziatura del testo Spaziatura orizzontale Spaziatura verticale Allineamento del testo Differenze tra i caratteri tipografici Font serif Font sans serif Font di scrittura a mano Font a larghezza fissa Font novelty Font dingbat Trovare i font Gallerie di font gratuiti Gallerie di font commerciali Artisti singoli e foundry Scegliere correttamente i font Impostare dimensione del font e altezza della riga Punteggiatura e caratteri speciali Un applicazione concreta: la stampa del testo Capitolo 5 Le immagini Cosa cercare Le fonti delle immagini Fotografare per conto proprio Gli archivi fotografici Immagini gratuite Immagini senza diritti d autore Immagini regolate da contratto Affidarsi a professionisti Come non cercare le immagini Google ganking Hotlinking Clipart Ritaglio creativo Fotoritocco con Photoshop

5 Indice IX Formati e risoluzione dei file Interventi creativi sulle immagini Utilizzo di immagini per migliorare le immagini Utilizzo di CSS per migliorare le immagini Un applicazione concreta: i piccoli dettagli Sempre più avanti Appendice A Appunti sul design per dispositivi mobile Come evitare le abitudini web nelle applicazioni per iphone Ideare un applicazione per iphone: da dove iniziare Le domande da farsi Dove trovare ispirazione Prima una serie di schizzi Quattro modi per migliorare la natura metaforica del dispositivo mobile L applicazione ical non permette di voltare pagina con uno swipe Siti mobili e media query Come fanno gli utenti mobili a navigare nel Web? Come fanno gli utenti mobili a navigare sul vostro sito? Le media query possono risolvere la situazione? Indice analitico...219