Cos'è e a cosa serve il formato vettoriale delle immagini

 

Se vi è mai capitato di lavorare con le immagini vi sarete imbattuti nella richiesta di una immagine di tipo vettoriale. Ma sai davvero di cosa si tratta e di che utilizzo ha?

I differenti tipi di file immagine

Iniziamo con il fare un distinguo sulle tipologie di immagini digitali. Fondamentalmente queste possono essere di due tipi: raster o vettoriali.

Le immagini raster

Le immagini raster (chiamate anche bitmap) sono immagini composte da pixel colorati, singoli puntini che vanno a comporre l'intera figura. Questi file sono caratterizzati anche dal fatto di avere una dimensione e una risoluzione propria. Questo significa che sono composte da un numero finito di quei pixel disposti su una dimensione precisa. Se queste immagini vengono ingrandite oltre la loro dimensioni originali notiamo subito come subiscano una perdita di definizione e appaiano sgranate e dentellate. Quest'effetto è chiamato, appunto, pixellatura.

Può sembrare uno svantaggio ma in realtà questo tipo di immagini può riprodurre un enorme numero di dettagli e sfumature, basti pensare alle fotografie digitali e a tutti i dettagli che offrono.

Le immagini vettoriali

Le immagini vettoriali differiscono dalle raster. Non sono composte da pixel ma sono generate da un insieme di equazioni matematiche che producono punti, linee e forme. Queste equazioni matematiche che definiscono le figure sono i cosiddetti vettori (da qui il nome) e hanno la caratteristica di essere indipendenti dalla risoluzione.

I vantaggi di una immagine vettoriale

Il formato vettoriale, rispetto a quello raster, ha i seguenti vantaggi:

• Si tratta di una grafica scalabile all'infinito: come accennato è indipendente dalla risoluzione; questo significa che le forme generate matematicamente vengono ricalcolate ogni volta che si effettua un ingrandimento o una riduzione.
• I colori dei file in vettoriale sono modificabili in modo semplice e veloce; basta selezionare una forma o una linea per andare a cambiare il colore che le è stato assegnato, è anche possibile passare da un profilo di colore ad un altro, ad esempio dall'RGB ad un Pantone.
• Si può lavorare su questo tipo di immagini visualizzando solo i contorni; è possibile attivare e disattivare con facilità i riempimenti per tutti gli elementi che compongono l'immagine per visualizzare solo i bordi. Si tratta di un tipo di visualizzazione molto importante perchè permette di individuare gli elementi nascosti e rende possibile progettare guide per le attrezzature che effettuano tagli e incisioni.

I tipi di file vettoriali

Le immagini digitali in formato vettoriale sono caratterizzate da delle estensioni particolari e se dobbiamo lavorare con questo tipo di immagini assicuriamoci di aver salvato questo tipo di file.

I formati più importanti delle immagini vettoriali sono:

• AI - Adobe Illustrator, il formato standard compatibile con i programmi della suite Adobe.
• EPS - Encapsulated PostScript, altro formato standard per le immagini vettoriali compatibile con i maggiori programmi come Illustrator o Corel Draw.
• SVG - Scalable Vector Graphics, un nuovo formato adatto alle immagini vettoriali per la creazione di siti web.
  
• PDF - altro formato Adobe per la condivisione dei documenti, permette anche il salvataggio delle immagini vettoriali.

A cosa serve un file vettoriale?

La differenza tra i due tipi di immagine fa si che ogni formato sia più adatto per uno scopo preciso. In questo caso, i file vettoriali per le loro caratteristiche, sono molto adatti alla stampa.

Come prima cosa sono molto utili nel disegno tecnico, ad esempio in CAD e in ingegneria.

Ma si tratta anche di un formato prezioso utilizzato dai progettisti grafici per la creazione di loghi e della grafica coordinata perchè si tratta di elementi che possono servire sia su un biglietto da visita che su un cartellone colossale. Ma questo tipo di formato si adatta bene per qualsiasi progetto vada stampato su brochure, volantini, cartelloni o icone per software.

Cos'è un file SVG e come lo usiamo nella grafica web?

 

 

Cos'è un file SVG? Con la diffusione di internet e l'uso del web per la promozione di attività e imprese professionali, anche le persone comuni si trovano alle prese con problemi di natura tecnica propri della piattaforma. Vediamo di rispondere insieme a questa domanda.

Il formato SVG

Il formato SVG nasce nel settembre del 2001. Si tratta di un formato standard aperto, sviluppato nell'ambito del W3C (World Wide Web Consortium). Il termine è un acronico che sta per Scalable Vector Graphics.

Con questa tecnologia possiamo visualizzare sul web degli elementi di grafica vettoriale. La grafica vettoriale è un sistema di composizione dell'immagine basato su formule matematiche che definiscono figure geometriche, punti, linee, curve e poligoni ai quali possiamo applicare colori e sfumature. Addirittura è possibile applicare delle animazioni alla grafica.

È un formato che si basa su un linguaggio XML, questo tipo di codice permette la ricerca, l'indicizzazione, la compressione e lo script dei file SVG.

Come utilizziamo la Scalable Vector Graphics

Di solito ci accontentiamo di soluzioni bitmap per le immagini che usiamo sul web, come PNG e JEPG, oppure GIF per le animazioni. Ma non è sempre la scelta ideale.

Andiamo ad approfondire le qualità di uno dei formati più utili.

La natura vettoriale di questo tipo di immagini permette di ridimensionare l'elemento grafico a piacimento senza perdere la qualità dei dettagli, senza sfocature. Questo perché, a differenza di una immagine bitmap, basata su pixel rigidi, qui abbiamo a che fare con geometria su base matematica. L'immagine può essere così riprodotta su differenti formati, come schermi desktop, cellulari, stampa, plotter, ecc... Senza perdere di definizione.

Il peso dell'immagine è un altro punto di forza. La compressione del codice SVG ci offre buoni risultati anche in termine di ottimizzazione SEO del sito, immagini leggere e agili, ideali per caricamenti rapidi delle nostre pagine web.

Google accetta e indicizza senza problemi questo tipo di formato, il codice XML integrato in quello HTML del nostro sito viene letto dal motore di ricerca e il contenuto indicizzato. Soltanto, come avviene per tutti i contenuti web, potrebbero volerci i consueti tempi tecnici degli spider di Google.

Le figure espresse con il codice contenuto nel file SVG possono essere anche dinamiche e interattive. Il modello supportato da questo tipo di codice consente la gestione delle animazioni degli oggetti grafici e addirittura eventi che rispondono a differenti tipi di sollecitazioni dell'utente.

Quando non utilizzare le immagini SVG

Come abbiamo detto, i file in SVG sono ideali per tutte quelle immagini che devono essere scalabili, ad esempio sfondi o loghi. Questo formato, però, non è in grado di restituire immagini complesse di qualità.

Quindi, quando ci troviamo di fronte a fotografie o progettazione grafica che l'utente deve essere in grado di fruire, evitiamo la grafica vettoriale. Meglio utilizzare un tipo di formato più tradizionale facendo sempre attenzione però a ottimizzare la sua usabilità per il web.

Creare o modificare un file SVG

Per visualizzare un file in formato SVG basta avere a disposizione un browser, oggi tutti hanno un supporto per il rendering di questo formato. Il discorso cambia radicalmente, invece, quando parliamo di creare o modificare una immagine di questo tipo.

Aprendo uno di questi files con un qualsiasi programma testuale, ci troveremmo di fronte al codice XML che compone l'immagine. Una serie di dati intellegibili che forniscono ai browser le istruzioni su come gestire la nostra immagine.

L'unico modo che abbiamo per creare o gestire una immagine SVG è attraverso specifici programmi di grafica vettoriale, molti dei quali a pagamento. Online potrete trovare, per grafiche più semplici, anche tool gratuiti per la conversione di immagini da bitmap a vettoriale.