I colori e i formati immagini per il Web
Il sistema esadecimale e il significato di RGB
I colori dello sfondo, dei collegamenti e del testo, nel linguaggio HTML sono realizzabili attraverso l’utilizzo del sistema esadecimale. Quest’ultimo si differenzia dal sistema metrico decimale (base 10), infatti il sistema esadecimale ha 16 simboli (base 16): 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f. Mentre nel sistema decimale per rappresentare un numero maggiore di 9 si utilizza una combinazione di questi numeri dove la cifra a destra rappresenta l’unità e quelle a sinistra le decine, nel sistema esadecimale per rappresentare numeri maggiori di f (15) si dovrà utilizzare una combinazione di simboli, dove la cifra a destra rappresenta le unità, e la cifra a sinistra specifica quante volte è ripetuto il 16.
Oltre i colori, il sistema esadecimale può rappresentare i simboli speciali nelle pagine Web.
I colori sono rappresentati da codici esadecimali di sei cifre preceduti dal segno #; i primi due numeri rappresentano la quantità di rosso (#ff0000), i secondi la quantità di verde (#00ff00), mentre gli ultimi due numeri rappresentano la quantità di blu (#0000ff). Dai nomi di questi tre colori deriva il significato di RGB (red, green, blue). Dunque attraverso le varie combinazioni di questi colori si potranno definire moltissime tonalità. Per esempio il nero è dato dall’assenza di tutti i colori (#000000), il bianco dalla presenza di tutti i colori (#ffffff), mentre il giallo è dato dalla presenza massima di rosso e di verde (#ffff00).
Web Safe color
Web Safe color sono i cosiddetti colori sicuri, cioè i colori predefiniti che possono essere visualizzati dalla maggior parte dei browser in commercio. Convenzionalmente esistono 216 colori comuni, infatti anche Dreamweaver utilizza la tavolozza Web Safe a 216 colori.
Differenza tra immagini bitmap e vettoriali
Le immagini bitmap sono strutturate attraverso pixel, abbreviazione di “picture element” (elemento di immagine). Un pixel è il più piccolo elemento quadrato che compone un’immagine bitmap, e maggiore è il numero di pixel, più definita sarà l’immagine.
Le immagini vettoriali utilizzano formule matematiche, e si ottengono attraverso manipolazioni di linee e curve. L’immagine in questo caso non è rappresentata da pixel.
Le immagini bitmap, se ingrandite o ristrette possono perdere in qualità, mentre le immagini vettoriali solitamente si possono ingrandire e restringere senza particolari problemi.
Differenze tra immagini BMP, GIF, JPEG, PNG
Le immagini BMP (bitmap) sono dotate di una buona qualità e creano un’ottima impressione di realismo. Risultano però, troppo ingombranti dal punto di vista dello spazio occupato, infatti vengono solitamente usate per sfondi del desktop o per stampe ad alta definizione, e quasi mai inserite nei siti Web.
Le immagini GIF (Graphics Interchange Format) possono utilizzare solamente 256 colori, e dunque sono poco ingombranti. Sono utilizzate per icone, immagini in bianco e nero, loghi e fumetti, meno per le foto che richiedono moltissimi colori. Altra caratteristica dell’immagine GIF è il colore di trasparenza e l’animazione tramite appropriati software. Da questo, deriva il grande uso del formato GIF nel Web.
Il formato JPEG (Joint Photographic Experts Group) viene utilizzato moltissimo per la memorizzazione di immagini fotografiche. Un’immagine JPEG può contenere milioni di colori mantenendosi leggera, al contrario del formato BMP. Questo grazie ad una particolare capacità di compressione del file, chiamata lossy. Però, questo formato non supporta l’animazione e non ha il colore di trasparenza. Le immagini JPEG sono molto utilizzate nel Web.
Il formato PNG (Portable Network Graphics) supporta milioni di colori, ed è adatto sia per le immagini fotografiche, che per quelle grafiche. Questo formato unisce le caratteristiche GIF e JPEG, ma l’unico problema che frena un po’ la sua diffusione, è che i browser meno recenti non supportano questo formato.
Salvataggio di un’immagine acquisita da scanner
I formati più utilizzati nel salvataggio di un’immagine acquisita da scanner sono GIF e JPEG.
Il formato GIF è consigliabile per loghi, icone, fumetti, immagini in bianco e nero.
Il formato JPEG consigliato per le foto, perché in grado di memorizzare milioni di colori.
Attributi ALT e TITLE
L’attributo ALT, inserito nell’elemento IMG, consente di specificare un testo alternativo per le immagini, quando quest’ultime non vengono visualizzate. Questo risulta utile per coloro che usano il browser in modalità testo, quindi diventa indispensabile per le persone con gravi problemi di vista. Un errore diffuso, è quello di inserire nell’attributo ALT una descrizione dell’immagine, senza tener conto della funzione, dello scopo, che in realtà svolge l’immagine nella pagina Web.
L’attributo TITLE viene utilizzato per dare delle informazioni aggiuntive ad un’immagine o ad un collegamento. È un messaggio a comparsa e aiuta l’utente nella navigazione.
Scrivere per il Web
Innanzitutto è indispensabile dare una buona organizzazione al testo, per facilitare all’utente la visualizzazione di blocchi di informazioni interessanti. Infatti, l’utente solitamente svolge una scansione per vari motivi, come la fretta, l’economia e l’abitudine.
La scrittura deve essere strutturata e coincisa: non essere troppo dettagliati, essere chiari, evitare linguaggi legati alla propria cultura, usare una buona grammatica e ortografia, scrivere a blocchi, allineare preferibilmente il testo a sinistra, evitare righe di testo lunghe (50-70 caratteri per riga), scegliere il font giusto e così via.
FONTI
Scrivere per il Web (Vito Evola)
HTML 4 per il World Wide Web
SITI DI RIFERIMENTO
http://www.diodati.org/scritti/2002/g_alt/index.asp
http://www.gdesign.it/
http://it.wikipedia.org/
I colori dello sfondo, dei collegamenti e del testo, nel linguaggio HTML sono realizzabili attraverso l’utilizzo del sistema esadecimale. Quest’ultimo si differenzia dal sistema metrico decimale (base 10), infatti il sistema esadecimale ha 16 simboli (base 16): 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f. Mentre nel sistema decimale per rappresentare un numero maggiore di 9 si utilizza una combinazione di questi numeri dove la cifra a destra rappresenta l’unità e quelle a sinistra le decine, nel sistema esadecimale per rappresentare numeri maggiori di f (15) si dovrà utilizzare una combinazione di simboli, dove la cifra a destra rappresenta le unità, e la cifra a sinistra specifica quante volte è ripetuto il 16.
Oltre i colori, il sistema esadecimale può rappresentare i simboli speciali nelle pagine Web.
I colori sono rappresentati da codici esadecimali di sei cifre preceduti dal segno #; i primi due numeri rappresentano la quantità di rosso (#ff0000), i secondi la quantità di verde (#00ff00), mentre gli ultimi due numeri rappresentano la quantità di blu (#0000ff). Dai nomi di questi tre colori deriva il significato di RGB (red, green, blue). Dunque attraverso le varie combinazioni di questi colori si potranno definire moltissime tonalità. Per esempio il nero è dato dall’assenza di tutti i colori (#000000), il bianco dalla presenza di tutti i colori (#ffffff), mentre il giallo è dato dalla presenza massima di rosso e di verde (#ffff00).
Web Safe color
Web Safe color sono i cosiddetti colori sicuri, cioè i colori predefiniti che possono essere visualizzati dalla maggior parte dei browser in commercio. Convenzionalmente esistono 216 colori comuni, infatti anche Dreamweaver utilizza la tavolozza Web Safe a 216 colori.
Differenza tra immagini bitmap e vettoriali
Le immagini bitmap sono strutturate attraverso pixel, abbreviazione di “picture element” (elemento di immagine). Un pixel è il più piccolo elemento quadrato che compone un’immagine bitmap, e maggiore è il numero di pixel, più definita sarà l’immagine.
Le immagini vettoriali utilizzano formule matematiche, e si ottengono attraverso manipolazioni di linee e curve. L’immagine in questo caso non è rappresentata da pixel.
Le immagini bitmap, se ingrandite o ristrette possono perdere in qualità, mentre le immagini vettoriali solitamente si possono ingrandire e restringere senza particolari problemi.
Differenze tra immagini BMP, GIF, JPEG, PNG
Le immagini BMP (bitmap) sono dotate di una buona qualità e creano un’ottima impressione di realismo. Risultano però, troppo ingombranti dal punto di vista dello spazio occupato, infatti vengono solitamente usate per sfondi del desktop o per stampe ad alta definizione, e quasi mai inserite nei siti Web.
Le immagini GIF (Graphics Interchange Format) possono utilizzare solamente 256 colori, e dunque sono poco ingombranti. Sono utilizzate per icone, immagini in bianco e nero, loghi e fumetti, meno per le foto che richiedono moltissimi colori. Altra caratteristica dell’immagine GIF è il colore di trasparenza e l’animazione tramite appropriati software. Da questo, deriva il grande uso del formato GIF nel Web.
Il formato JPEG (Joint Photographic Experts Group) viene utilizzato moltissimo per la memorizzazione di immagini fotografiche. Un’immagine JPEG può contenere milioni di colori mantenendosi leggera, al contrario del formato BMP. Questo grazie ad una particolare capacità di compressione del file, chiamata lossy. Però, questo formato non supporta l’animazione e non ha il colore di trasparenza. Le immagini JPEG sono molto utilizzate nel Web.
Il formato PNG (Portable Network Graphics) supporta milioni di colori, ed è adatto sia per le immagini fotografiche, che per quelle grafiche. Questo formato unisce le caratteristiche GIF e JPEG, ma l’unico problema che frena un po’ la sua diffusione, è che i browser meno recenti non supportano questo formato.
Salvataggio di un’immagine acquisita da scanner
I formati più utilizzati nel salvataggio di un’immagine acquisita da scanner sono GIF e JPEG.
Il formato GIF è consigliabile per loghi, icone, fumetti, immagini in bianco e nero.
Il formato JPEG consigliato per le foto, perché in grado di memorizzare milioni di colori.
Attributi ALT e TITLE
L’attributo ALT, inserito nell’elemento IMG, consente di specificare un testo alternativo per le immagini, quando quest’ultime non vengono visualizzate. Questo risulta utile per coloro che usano il browser in modalità testo, quindi diventa indispensabile per le persone con gravi problemi di vista. Un errore diffuso, è quello di inserire nell’attributo ALT una descrizione dell’immagine, senza tener conto della funzione, dello scopo, che in realtà svolge l’immagine nella pagina Web.
L’attributo TITLE viene utilizzato per dare delle informazioni aggiuntive ad un’immagine o ad un collegamento. È un messaggio a comparsa e aiuta l’utente nella navigazione.
Scrivere per il Web
Innanzitutto è indispensabile dare una buona organizzazione al testo, per facilitare all’utente la visualizzazione di blocchi di informazioni interessanti. Infatti, l’utente solitamente svolge una scansione per vari motivi, come la fretta, l’economia e l’abitudine.
La scrittura deve essere strutturata e coincisa: non essere troppo dettagliati, essere chiari, evitare linguaggi legati alla propria cultura, usare una buona grammatica e ortografia, scrivere a blocchi, allineare preferibilmente il testo a sinistra, evitare righe di testo lunghe (50-70 caratteri per riga), scegliere il font giusto e così via.
FONTI
Scrivere per il Web (Vito Evola)
HTML 4 per il World Wide Web
SITI DI RIFERIMENTO
http://www.diodati.org/scritti/2002/g_alt/index.asp
http://www.gdesign.it/
http://it.wikipedia.org/
posted by Francesco Mattatresa @ 9:50 AM
0 Comments:
Post a Comment
<< Home