|
Portale
Redazione & informazione
|
|
| ||||||
|---|---|---|---|---|---|---|---|---|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Internet, web, siti e blog Cosa sono, a che servono, come funzionano e come ci cambiano la vita Il materiale originale in questa pagina è © Luciano Russo: la Redazione ringrazia l'autore per averne autorizzato la riproduzione, la rielaborazione, l'adattamento e la pubblicazione nel portale |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Il linguaggio delle immagini – Approfondimento |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
In questa pagina La rappresentazione delle immagini su Internet Le immagini "rasterizzate" e quelle "vettoriali" I più comuni "formati" delle immagini digitali su Internet Le caratteristiche del formato .GIF Le caratteristiche del formato .JPG La rappresentazione 3-dimensionale del colore L'accuratezza delle sfumature e la "profondità" del colore Quale formato scegliere: .GIF o .JPG?
Pagine correlate Intelligenze e linguaggi
Luciano Russo – Una presentazione
|
|
La rappresentazione delle immagini su Internet |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
Le immagini "rasterizzate" e quelle "vettoriali" |
|||||||
|
|
|
|
|
|
|
|
|
|
|
|
L'immagine digitale è semplicemente una rappresentazione bi-dimensionale, cioè piatta, di una immagine a 2 o 3 dimensioni, attraverso dei dati o valori numerici, i quali, in grandissime quantità, ne descrivono e riproducono ogni dettaglio di forma e sfumatura di colore sullo schermo del computer.
Le immagini riprodotte digitalmente, cioè attraverso valori numerici, possono essere costruite o attraverso una serie di cosiddetti pixel o singoli punti dello schermo oppure attraverso descizioni matematiche della loro forma e proporzioni:
- le immagini descritte attraverso una griglia di pixel o punti, con la descrizione numerica di ogni singolo punto, si chiamano immagini "rasterizzate" o raster o bitmap e sono fisse o statiche;
- le immagini descritte invece attraverso dati più complessi espressi in formule matematiche ad indicare gli
elementi chiave e le relazioni,
posizione e proporzioni
tra di loro, sono chiamate immagini "vettoriali"
e sono sia scalabili che
rotabili. |
|||||||
|
|
|
|
|
|
|
|
|
|
|
|
Le immagini a punti |
|||||||
|
|
|
|
|
|
|
|
|
|
|
|
Questo tipo di immagini, che più ci interessa i questo articolo, viene quindi costruito punto per punto, attraverso valori numerici che descrivono le caratteristiche di ogni cosiddetto pixel:
- le immagini monocromatiche o impropriamente dette in "bianco e nero", ma in effetti rappresentate attraverso una "scala di grigi", vengono descritte in ciascun punto attraverso valori numerici ad indicare l'intensità del colore nero;
- le immagini a colori, vengono invece descritte in ciascun punto con valori numerici ad indicare il grado di intensità di tre colori fondamentali, il rosso, il verde e il blù.
Il numero di gradazioni sia del nero che dei colori fondamentali è anche detto "profondità" del colore e dipende dal numero di combinazioni numeriche possibili con la quantità di bit o binary digit o "cifre binarie", ulilizzati nei dati: ad esempio, un'immagine descritta con 1 bit per pixel potrà avere soltanto due combinazioni, o 0 o 1, quindi o bianco (= niente nero) o nero (= tutto nero), un'immagine a 4 bit per pixel al massimo 16 colori oppure 16 livelli di "grigio", mentre una ad 8 bit per pixel potrà raggiungere le 256 combinazioni o sfumature di colore e così via.
Inoltre una immagine a punti può avere diversa "risoluzione", cioè diverso numero di punti per unità di superficie, in pratica il numero di righe (orizzontali) e di colonne (verticali) della griglia di rappresentazione: questo viene normalmente espresso con l'unità di misura dpi o dots per inch o punti per pollice.
Ad esempio, lo
schermo
del computer può mostrare le immagini con una griglia a
massima risoluzione
di 72 dpi,
mentre un comune printer o stampante
riproduce normalmente le immagini con una griglia ad una
risoluzione di circa 300 dpi:
la griglia o matrice viene
chiamata in inglese raster,
da cui la denominazione italianizzata di immagini "rasterizzate". |
|||||||
|
|
|
|
|
|
|
|
|
|
|
|
Le immagini a vettori |
|||||||
|
|
|
|
|
|
|
|
|
|
|
|
L'immagine digitale è semplicemente una rappresentazione bi-dimensionale, cioè piatta, di una immagine a 2 o 3 dimensioni, attraverso dei dati o valori numerici, i quali, in grandissime quantità, ne descrivono e riproducono ogni dettaglio di forma e sfumatura di colore sullo schermo del computer.
Le immagini vettoriali sono costruzioni a rete ottenute dall'unione attraverso "vettori" di punti connotanti o "nodi", a formare poligoni a loro volta uniti in strutture sempre più complesse, fino all'immagine definitiva (in gergo si dice che queste immagini vengono costruite definendo un qualsiasi oggetto come un aggregato di "primitive geometriche" - cioè punti, linee, curve e poligoni - alle quali si attribuiscono generalmente tinte "piatte" e false "sfumature").
Questo tipo di immagine, facilmente scalabile e ruotabile, viene perciò utilizzata con vantaggio per la creazione di immagini cosiddette 3-dimensionali o rappresentanti volumi e, quindi, soprattutto nel disegno tecnico, architettonico ed industriale, come pure nella grafica computerizzata e nell'editoria per caratteri o font, logotipi e marchi scalabili senza perdita di qualità di definizione ottica.
Oggi il principale vantaggio della grafica vettoriale rispetto alla grafica raster è la maggiore comprimibilità dei dati.
La grafica vettoriale infatti, definita attraverso equazioni matematiche che partono da un punto di date coordinate e terminano in un altro punto di date coordinate, è indipendente dalla risoluzione di riproduzione: l'ingrandimento o la riduzione di un'immagine vettoriale non comporta le drastiche variazioni di peso del documento o file come nel caso delle immagini costruite a punti.
Il principale svantaggio riguarda invece la tecnica di realizzazione dell'immagine, un'attività prevalentemente ingegneristico-matematica nel caso dell'immagine a vettori, mentre altamente artistico-intuitiva nel caso dell'immagine a punti.
Il lavoro con
immagini vettoriali
può inoltre essere eseguito su
computer di scarse o medie prestazioni,
mentre con immagini rasterizzate
richiede computer molto più potenti. |
|||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
I più comuni "formati" delle immagini digitali su Internet |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Le ultime lettere nel nome di un file o documento digitale, solitamente 3 o 4 e dopo il punto, sono una sigla o suffisso che mostra il "formato" del documento, il tipo di "codice" o scrittura simbolica e/o il tipo di applicazione informatica o programma con cui il documento è stato creato.
Queste immagini rasterizzate o bitmap possono venire memorizzate nel computer in diversi formati, in pratica diversi modi matematici di "comprimerne" i dati a dimensioni ragionevoli: un metodo viene chiamato lossy o approssimato, con una certa perdita di informazione e quindi di nitidezza, poi compensata dall'occhio umano, come nelle immagini cosiddette .JPG, oppure con un altro metodo chiamato lossless o esatto, senza perdita di informazione, come nelle immagini cosiddette .GIF.
I formati .GIF e .JPG sono i due più popolari
linguaggi informatici con cui si strutturano e
codificano le immagini
digitali "a punti" (cioè
non "vettoriali") da lanciare su Internet,
in modo che siano facilmente e fedelmente riproducibili nei
visualizzatori più usati. |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Le immagini in formato .GIF |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Le caratteristiche del formato .GIF |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
"GIF" sta per Graphics Interchange Format, letteralmente "formato di interscambio grafico", definito, sviluppato ed introdotto dalla CompuServe nel 1987: fino ad oggi di pubblico dominio, recentemente la società Unisys ne ha rivendicato la proprietà.
Agli inizi usato soprattutto per memorizzare le immagini e trasferirle tra vari tipi di computer, oggi è estremamente diffuso ed in pratica il più usato dei due standard grafici di Internet, per la visualizzazione di grafica e fotografie in programmi di elaborazione grafica e nei cosiddetti internet browser o "visualizzatori di internet".
La grande popolarità in Internet di
questo formato di codifica è dovuta al fatto che utilizzi un metodo ad
alto livello di "compressione", il
quale riduce notevolmente le dimensioni
dei file: occupano meno spazio nella memoria e possono essere
trasmesse più velocemente - tempi di trasmissione ridotti.
Teoricamente può riprodurre 256
colori contemporaneamente,
in pratica il numero dei suoi
colori "affidabili" si è ridotta a 216.
|
|||||||
|
|
|
|
|
Sopra e al centro, due tipi di "carta cromatica" i quali entrambi rappresentano i 216 colori "sicuri" o esattamente riproducibili in immagini codificate nel formato GIF, fino ad una grandezza massima di 16.000 x 16.000 punti, in inglese detti "pixel", da PIcture ELement: il pixel è l'elemento base di cui è composta ogni immagine digitalizzata, un "quadratino di informazione" o singolo punto luminoso sullo schermo del computer, risultato della combinazione della fusione della luce nei tre colori fondamentali rosso-verde-blù (cosiddetto sistema RGB - R per Red, G per Green e B per Blue) con determinate caratteristiche di colore, luminosità, intensità e così via.
Sotto, la limitata cosiddetta "scala dei grigi": le sfumature inalterabili tra nero e bianco nel formato .GIF sono limitate a 4 soltanto. |
||||
|
|
|
|
|
|
|
|
|
|
|
|
|
La trasparenza dell'immagine |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Una delle ottime potenzialità del formato .GIF è quella di riuscire a riprodurre anche la "trasparenza", cioè l'assenza assoluta di qualsiasi colore in una parte dell'immagine, come ad esempio nel caso di una grafica che si voglia sovrapporre ad uno sfondo preesistente, o un'immagine "ritagliata" sullo sfondo di una pagina web, cosa invece non possibile nel formato .JPG.
|
||||||
|
|
|
|
|
|
|
Un esempio: da sinistra a destra e dall'alto in basso, la foto originale, la "foratura" dello sfondo dell'immagine e sua successiva sovrapposizione prima ad uno sfondo di pagina bianco, poi ad uno sfondo grafico grigio ed infine a una seconda foto totalmente estranea alla prima. |
||
|
|
|
|
|
|
|
|||
|
|
|
|
|
|
|
|||
|
|
|
|
|
|
|
|
|
|
|
|
|
L'animazione dell'immagine |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Un'altra delle utilizzazioni più frequenti del formato .GIF è l'animazione, che in pratica lo rende lo standard de facto per la creazione dei cosiddetti banner.
Il formato .GIF permette infatti di far "scorrere" una collezione di immagini in formato .GIF, mostrandole cioè in sequenza, a determinati intervalli di tempo: se le immagini sono come quelle di un video o di un film, cioè una immagine di base con minimi cambiamenti o spostamenti di dettagli, ad una frequenza di 25 o più immagini al secondo, si può riprodurre la naturale sensazione di movimento, dato che l'occhio umano, grazie ad un suo meccanismo di "ritardo", trattiene l'immagine precedente sulla retina anche un attimo dopo che sia sparita, percependo così la serie di separate immagini come un "continuo", senza interruzioni.
Quello .GIF è quindi un formato più "povero" di colori, ma indiscutibilmente più "ricco" di applicazioni!
|
||||||
|
|
|
|
|
|
|
A sinistra l'animazione della fiammella di un fiammifero ottenuta con due sole immagini, le quali si alternano con una frequenza di 10 immagini per secondo, e, a destra, quella del volo di una colomba, cui sono necessarie 18 immagini alla velocità costante di 0,01 secondi per immagine, vale a dire ben 100 immagini per secondo. |
||
|
|
|
|
|
|
|
|
|
|
|
|
|
Le immagini in formato .JPG |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Le caratteristiche del formato .JPG |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
"JPG" o anche "JPEG" sta per Joint Photographic Experts Group, letteralmente "Gruppo Associato di Esperti Fotografici", un comitato che ha creato molti standard fin dal 1986: ma i lavori sul formato .JPG, il primo ISO - standard internazionale - di compressione per immagini a tono continuo, sia in scala di grigi che a colori, erano iniziati già 3 anni prima, nel 1983.
Anche questo formato è
molto
diffuso su Internet, in quanto
riduce la grandezza o "pesantezza"
dei file
fotografici, lo spazio che cioè
occupano nella memoria e, quindi, il tempo
di trasferimento da un computer a un altro,
può visualizzare un numero molto più elevato di colori,
ma non garantire una altrettanto
elevata "definizione" o nitidezza
dell'immagine, che viene riprodotta con una certa approssimazione.
Quelli di seguito sono gli
oltre
1.500 colori "puri" o "sicuri"
visualizzabili dal formato .JPG sullo schermo del computer: la
grande scala cromatica a
disposizione assicura migliori effetti
di riproduzione nelle sfumature tenui,
come ad esempio nel caso di un cielo azzurro, ma, essendo l'immagine
così ricca di informazione, al suo
livello di ottimale o lossless
rendimento diventa "pesante",
anche se la si può "impoverire" a livelli di qualità più bassi o
lossy, cosa che sembra però un po' un controsenso.
I creatori di .JPG, un formato a
compressione e relativa
de-compressione doppia, a due fasi, sono comunque convinti che questo suo essere "lossy",
approssimato o leggermente degenerativo, togliedo dall'immagine i dati
meno importanti o meno visibili, che l'occhio umano può ricostruire o
compensare, sia un buon compromesso
tra qualità dell'immagine e
"peso" del file.
|
||||||
|
|
|
|
|
Il medesimo cielo riprodotto in formato .GIF ed in formato .JPG: quale è quale? |
||||
|
|
|
Guardando attentamente, si possono distinguere 6 quadrati formati dalle combinazioni, crescenti o decrescenti, dei 3 colori fondamentali dello schermo, il cosiddetto sistema "RGB", dove la "R" sta per il ROSSO (in inglese RED), la "G" per il VERDE (in inglese GREEN) e la "B" per il BLÙ (in inglese BLUE): la "profondità" massima del colore nel formato .JPG è di 24 bit.
|
||||||
|
|
||||||||
|
|
|
Oltre ai 1.536 colori della scala cromatica sopra, il formato .JPG può anche mostrare una cosiddetta "scala dei grigi", una sequenza di sfumature cioè che vanno dal nero al bianco di 16 interavalli.
Come si può vedere, il quart'ultimo intervallo da sinistra sembra svanire come se fosse vuoto: in effetti essendo questa la medesima gradazione di nero dello sfondo della pagina, non vi crea alcun contrasto e quindi si "mimetizza" perfettamente.
|
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
La rappresentazione 3-dimensionale del colore |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Essendo il sistema scombonibile in
6 quadrati si può facilmente immaginarli
come le facce di un cubo ed
ottenere così una rappresentazione 3-dimensionale del colore.
|
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
L'accuratezza nelle sfumature e la "profondità" del colore |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Riprodurre superfici omogenee è una cosa, ma restituire realisticamente ad esempio un'ombra perfettamente sfumata su un corpo rotondo è molto più difficile.
L'immagine digitale può in pratica essere a colori, in bianco e nero o in scala di grigi: la differenza fra i tre tipi di "dati" sta tutta nel numero di bit, o valori, associati ad ogni singolo punto o pixel dell'immagine.
|
||||||
|
|
|
|
|
|
|
|||
|
|
|
Per capire intuitivamente la grande differenza, tra le varie profondità di colore basta dare uno sguardo alle riproduzioni di sfumature con diverse profondità di informazione qui sotto!
|
||||||
|
|
|
|
|
Da sinistra a destra e dall'alto in basso, la medesima immagine in bianco e nero a contrasto netto, in bianco e nero "sfumati", in scala di grigi e a colori. |
||||
|
|
|
Il colore può quindi avere anche una cosiddetta "profondità" di informazione, normalmente espressa in bit o numero binario, la più piccola unità di informazione in un sistema digitale: un bit è o un 1 (uno) o uno 0 (zero) e 8 bit, la libera sequenza di otto 1 e 0, fanno un cosiddetto byte.
Il numero di colori con cui un'immagine viene riprodotta e "visualizzata" o resa visibile, può essere facilmente calcolato elevando 2 alla potenza pari al numero di bit.
Un'immagine in bianco e nero è a 1 bit: ciascun punto o pixel può avere esclusivamente due valori (21), o bianco o nero.
Un'immagine in scala di grigi è a 8 bit: ciascun punto può assumere 256 (28) differenti valori, un pixel può quindi essere o bianco o nero o di una delle 254 tonalità di grigio.
Un'immagine a
16 colori
è a 4 bit: ogni punto può
visualizzare 16 colori
(24). Un'immagine a 256 colori è a 8 bit: ogni punto può assumere 256 colori (28).
Un'immagine in cosiddetto True Color è a 24 bit (3 x 8 bit = 24 bit), composta da punti rossi, verdi e blù, ciascuno dei quali in uno dei 256 possibili valori.
Naturalmente l'immagine digitale True Color, in italiano "vero colore", è quella che più si avvicina alla qualità fotografica, potendo visualizzare 16,7 milioni di colori differenti.
|
||||||
|
|
|
|
|
Da sinistra a destra e dall'alto in basso, una sfumatura dal nero al bianco in 8 bit, 10 bit, 16 bit e 24 bit. |
||||
|
|
|
Immagini digitali a 256 colori non hanno sufficiente profondità di colori per ottenerne stampe fotografiche accettabili: stampe di buona qualità hanno bisogno del cosiddetto True Color a 24 bit. |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
Quale formato scegliere: .GIF o .JPG? |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
I 1.536 colori della scala cromatica riproducibile formato .JPG sono ben 7 volte più numerosi dei 216 del formato .GIF, cosa che fa facilmente capire come le immagini .JPG siano sì più ricche ma anche più pesanti e quindi più lente ad essere trasferite sulla rete di quelle .GIF.
Lavorando su prodotti da lanciare su Internet, da tutto quanto sopra possiamo dedurre un paio di regole pratiche per quanto riguarda le immagini:
1. il modo più sicuro in assoluto è rimanere ancora sulla scala di 216 colori di .GIF;
2. il modo più avanzato è quello di adottare .GIF per le immagini grafiche, disegnate ed iconiche e
riservare invece .JPG per le
immagini fotografiche. |
||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
x
