Il blog di ABCFormazione

Formati immagini per il web: JPG, PNG, GIF, SVG

Formati immagini per il web: JPG, PNG, GIF, SVG

Il web è ricco di immagini, che hanno lo scopo principalmente di arricchirne i contenuti. Tuttavia, le immagini nel formato sbagliato potrebbero rallentare la velocità di caricamento di un sito e non apparire al meglio nello schermo. Ecco perché è fondamentale scegliere il formato più idoneo e seguire alcuni accorgimenti affinché le immagini diano un boost ai contenuti, anziché affossarli.

A seconda dell’uso che si vuole farne e del contesto, è possibile migliorare le immagini inserite sul web al fine di migliorare il posizionamento Seo, l’user experience dell’utente e la qualità della pagina.

Google e gli altri motori di ricerca, indicizzano anche il contenuto delle immagini per questo devono essere rispettati alcuni requisiti:

  • Leggerezza. Le immagini, prima di essere caricate su un sito, devono essere compresse per avere un peso inferiore a 1M
  • Inserimento del tag ALT (Text Alternative), ovvero un insieme di parole che viene aggiunto all’HTML per fornire informazioni aggiuntive sul contenuto ma non solo. Il tag Alt è infatti anche un aiuto per gli ipovedenti che, attraverso questa stringa di testo, potranno scoprire il contenuto di un’immagine 

Scegliere un formato di file appropriato che può ridurre il peso dell’immagine stessa e aumentare di conseguenza la velocità del sito.

Formati immagini per il web, come scegliere quello giusto

I tipi e i formati dei file possono essere divisi in 2 grandi categorieformati raster e formati vettoriali.

FORMATI RASTER

Nei formati raster vengono mostrate immagini statiche in cui ogni pixel ha proprie  informazioni di colore che messe insieme formano un’immagine. 

I formati raster sono ideali per le fotografie e le immagini di grande dimensioni, in quanto permettono livelli di dettaglio maggiori. Man mano che aumenta lo zoom, tuttavia, diminuisce la qualità dell’immagine. Dunque sono adatti per la condivisione sui social e sul web ma non per lavorare sui singoli pixel o sull’ingrandimento di una foto. 

JPG

JPG (o JPEG) è l’acronimo di Joint Photographic Experts Group ed è il formato d’immagine digitale più utilizzato. La maggior parte delle immagini sul web sono in formato JPG, un formato compresso a perdita di informazioni definito lossy, cioè che perde di qualità all’aumentare delle dimensioni.

È il formato ideale per le fotografie ma, dato il problema della perdita di qualità progressiva, per uso professionale si consiglia di lavorare sull’immagine originale e di salvare un’unica volta il formato necessario.

I file che utilizzano la compressione JPEG hanno tra le estensioni più comuni .jpg e .jpeg. 

PNG

Il Portable Network Graphic (PNG) è un formato di file grafico approvato dal World Wide Web Consortium (W3C). Offre la possibilità di una compressione dati senza perdita e una profondità di colore massimale fino a 24 bit per pixel.

Con un canale alfa si può arrivare fino a 32 bit e supportare trasparenza, semi-trasparenza e scansione interlacciata.

Anche se compresse, le immagine non perdono di qualità. È dunque il formato ideale per infografiche, banner e screenshot.

GIF

Il Graphics Interchange Format, abbreviato in GIF, è un formato di file per immagini digitali di tipo bitmap (immagine digitale che si contrappone alla grafica vettoriale).

Utilizza la compressione senza perdita di dati (lossless).

Essendo però basato sull’uso della tavolozza (palette) possono essere visualizzati al massimo 256 colori e 8 bit per pixel. 

Limitando l’immagine a 8 bit per pixel, mantiene le dimensioni dei file di animazioni piccole, per questo è ideale per creare immagini animate.

FORMATI VETTORIALI

I formati vettoriali vengono definiti attraverso equazioni matematiche. La grafica vettoriale al contrario di quella raster che utilizza i pixel, utilizza linee, punti e poligoni. Per questo può essere ingrandita, ridotta o distorta senza comportare una riduzione di qualità.

È il formato ideale per il disegno o l’illustrazione, infatti viene utilizzato per la creazione di loghi, illustrazioni vettoriali, icone e preparazione di file di stampa. 

SVG

Il formato SVG (Scalable Vector Graphic) è un formato che consente di visualizzare oggetti di grafica vettoriale. 

Non si basa su pixel ma utilizza il linguaggio XML che consente di scalare all’infinito le immagini senza perdita di qualità né aumento delle dimensioni del file.

Viene utilizzato per creare loghi, semplici illustrazioni e icone ma non è adatto per immagini o disegni complessi.

EPS

Il formato EPS (Encapsulated PostScript) è un formato vettoriale introdotto e sviluppato da Adobe System. È il formato predefinito durante il salvataggio di lavori su software come Adobe Illustrator, Photoshop e simili. 

 

 

Vuoi diventare un professionista completo della comunicazione visiva?