Sommario. Introduzione 1 Perch questo libro? 3 La struttura di questo libro 5 Cosa occorre 9 Tutto cambier prima o poi 13

Transcript

1 Sommario Introduzione 1 Perch questo libro? 3 La struttura di questo libro 5 Cosa occorre 9 Tutto cambier prima o poi 13 1 Browser a confronto 15 Stabilire per quale browser costruire il sito 16 Un confronto tra browser 17 Le statistiche sui browser 17 Il codice HTML utilizzato per il confronto 22 Pagina di verifica del colore di sfondo e del testo 22 Pattern di sfondo, TGIF e bordi 23 Allineamento 24 Tabelle e linee orizzontali 25 Riassumendo 26 2 La piattaforma giusta 27 Calibrazione del colore multipiattaforma 28 Differenze di luminosit tra piattaforme 30 Riassumendo 31 3 Come creare grafica di poca memoria 33 Regole di denominazione di JPEG e GIF 34 Come scoprire le vere dimensioni di un file 34 I formati dei file 35 Il formato JPEG 37 Come funziona la compressione JPEG 37 Quando utilizzare il JPEG 38 Il formato GIF 40 La compressione GIF 41 Come utilizzare il GIF 43 Convertire la grafica in 8 bit 43 JPEG e GIF a confronto 45 Riassumendo 48 4 La scelta del colore 49 Colore e bit 50 L'impostazione del monitor 53 Il dithering 54 Gestione delle palette a 8 bit nei browser Web 55 Creare immagini a 8 bit 57 Illustrazioni 58 Convertire fotografie o immagini in tinta unita in colore indicizzato 58 Palette adattate 59 Creare una palette adattata a 8 bit 59 Opzioni di elaborazione in batch 59 Quando creare immagini a 24 bit 60 Riassumendo 62

2 5 RGB o esadecimale? 63 I codici HTML a base esadecimale 64 Risorse esadecimali 67 I colori esadecimali a prova di browser 67 Convertitori esadecimali per il Web 70 Calcolatrici esadecimali 70 I valori esadecimali visti in pratica 71 HTML 3.0 e colore esadecimale 72 Riassumendo 72 6 Gli sfondi creati su pattern 73 Sfondi affiancati 74 Stabilire le dimensioni delle immagini del pattern 75 Il formato dei file per le immagini del pattern 78 Codice, prego! 79 Sfondi ed estetica 80 Bordo o non bordo, questo il dilemma 81 Con i bordi 81 Nessun bordo, con Photoshop 81 Nessun bordo, ma come farebbe Painter 84 Riassumendo 86 7 Creare un'immagine irregolare su uno sfondo in tinta unita 87 Creare il colore di sfondo con valori esadecimali 88 Creare il colore di sfondo con motivi affiancati in tinta unita 90 JPEG 0 GIF? 92 Riassumendo 92 8 Come creare un'immagine irregolare su uno sfondo trasparente 93 Le immagini GIF trasparenti 93 Creare l'immagine 95 Alcuni trucchi per creare immagini con alias con Photoshop 97 Creare illustrazioni da convertire in GIF trasparenti 97 Convertire le illustrazioni digitalizzate in lavori con alias 98 GIF trasparenti di immagini fotografiche 100 GIF interlacciati 104 Creare GIF interlacciati 104 Software per il GIF trasparente 104 Macintosh 105 Transparancy 105 DeBabelizer 105 LView 107 GIF Construction Set 108 Paint Shop Pro 108 Strumenti multipiattaforma 109 Plug-in Adobe Photoshop GlF89a Export 109 Fractal Painter Per andare online 112 La sintassi HTML per i GIF trasparenti 114 Riassumendo A lezione di tipografia 115 Alcuni principi tipografici 118 La scelta dei font 118 Il testo con HTML 119

3 Tipografia creata con la grafica 122 Utilizzare Photoshop 122 Utilizzo del testo di Illustrator in Photoshop 125 E ora un po' di ASCII! 126 Il codice HTML per inserire la grafica nella pagina 129 Riassumendo E ora un po' di allineamento! 131 Definire le dimensioni della pagina Web 132 Allineare con i comandi HTML 134 Tag di allineamento del testo 134 Tag di allineamento delle immagini al testo 135 Tag di allineamento delle immagini 135 Tag di spaziatura orizzontale e verticale 135 Tag di larghezza e altezza 136 Le alternative alla sintassi HTML 137 Utilizzare gli spaziatori per l'allineamento 137 Allineare la grafica su uno sfondo con pattern 137 Giocando con lo spazio: la Gallery Page Art di Bruce Heavin 139 Riassumendo Le linee orizzontali 143 Linee orizzontali, secondo HTML 144 Linee orizzontali, secondo le estensioni di 145 Linee orizzontali, secondo il classico "fai da te" 146 Utilizzare Illustrator e Photoshop per creare Linee orizzontali personalizzate 146 E ora un esempio 147 Linee verticali 149 Linee orizzontali, secondo le clip-art 149 Riassumendo Elenchi dappertutto 151 Creazione di elenchi con HTML 152 Elenchi numerati e di definizioni 153 Le estensioni di Netscape per gli elenchi HTML 155 Elenchi con richiami personalizzati 156 Creare simboli personalizzati 157 Utilizzare Kai's Power Tools 157 Utilizzo dei caratteri 159 Simulazione di pulsanti interattivi 159 Clip Art come pulsanti 161 Riassumendo Le mappe o hot spot 163 Identificazione delle immagini collegate 164 Creare immagini collegate 165 Alcune variazioni sui bordi, secondo le estensioni di Netscape 165 Creare le mappe 166 Le quattro fasi di creazione di una mappa 167 Creare una mappa 168 incominciamo dall'immagine 168 Definizione delle aree collegate 168 MacWeb 168

4 MapEdit 169 Inserire il codice HTML per le mappe 171 Un po' di diagnostica 172 Riassumendo Alla scoperta delle tabelle 173 Tabelle di dati 174 Come utilizzare i tag HTML 175 Le tabelle di immagini per il layout della pagina 177 E ora un esempio 177 Cattive notizie, il browser non supporla le tabelle 181 Riassumendo Documenti dinamici 185 Scorrimento della barra del titolo 186 Il movimento dello sfondo 188 Client Pull 188 Creare un'animazione client pull 189 Server Push 190 Lavorare con gli script CGI 191 AniMarker per WebStar Server Push 193 Riassumendo Un po' di musica e video 195 Formati dei file di animazione 196 QuickTime 196 Requisiti di QuickTime 197 AVI 198 Requisiti AVI 198 MPEG 198 Requisiti MPEG 199 Creazione di filmati 199 Consigli generali sulla creazione di animazioni 200 Codec 201 Cinepak-per QuickTime e AVI 202 Indeo-per QuikTime e AVI 203 MPEG 203 HTML per l'inserimento dei filmati nelle pagine Web 203 Studio dei casi-invio dei filmati a Web 204 Applicazioni e utility helper per filmati 207 Suono 208 Campionatura e bit 209 Formati dei file di suono 210 u-law 210 AIFF 210 Wave 210 MPEG 210 RealAudio 211 Consigli per la creazione di file di suono per siti Web 211 HTML per file di suono 214 Configurazione di MIME in Netscape 214 Applicazioni helper e utility di suono 215 Riassumendo 216

5 17 Visualizzare le pagine Web con Photoshop 217 Uso dei livelli 218 Utilizzo dei file PS forniti sul CD 220 Il testo 220 Sfondi e pattern 222 Creare un documento con un livello per i pattern 222 Creare livelli personalizzati 223 Convertire i livelli in grafica Web 224 Riassumendo Template HTML per i grafici 229 Template esadecimale 230 Template dei pattern 232 Template tipografico 233 Template di allineamento 234 Template di tabella 234 Template passo a passo per l'animazione 235 Riassumendo 237 A HTML per i grafici digitali 239 Assegnazione dei nomi 240 Estensioni di file ricorrenti 240 Controllo delle pagine 240 Diagnostica 240 Le pagine online 240 I tag HTML pi comuni 241 Glossario 245 Indice 249