JPG e PNG sono da decenni i formati grafici in assoluto più im­por­tan­ti (in par­ti­co­la­re in ambito web). Entrambi hanno vari vantaggi e svantaggi. I formati più recenti, come HEIF per le foto e WebP per gli elementi grafici, stanno in­con­tran­do un ap­prez­za­men­to crescente; tuttavia, la loro dif­fu­sio­ne non è ancora pa­ra­go­na­bi­le a quella dei formati JPG o PNG.

Crea il tuo sito web
Scopri le nuovi funzioni IA di MyWebsite
  • Editor facile e intuitivo con supporto IA
  • Immagini e testi d'effetto in pochi secondi
  • Dominio, indirizzo e-mail e cer­ti­fi­ca­to SSL inclusi

Cos’è JPG o JPEG?

JPEG è il più comune formato grafico per le foto. La com­pres­sio­ne dell’immagine uti­liz­za­ta da questo formato è stata definita nel 1992 nella norma ISO/IEC 10918-1. Il nome JPEG deriva da Joint Pho­to­gra­phic Experts Group che ha svi­lup­pa­to questo standard. Poiché so­li­ta­men­te le esten­sio­ni dei file prevedono solo tre caratteri, come esten­sio­ne per i file immagine è stata con­cor­da­ta la sigla JPG.

Cos’è PNG?

PNG è un formato grafico che risulta adatto in par­ti­co­la­re per grafiche pixel, screen­shot e loghi. Il formato PNG, la cui sigla significa Portable Network Graphics, è stato svi­lup­pa­to da un gruppo di lavoro del World Wide Web Con­sor­tium (W3C) a partire dal 1994 e in seguito sancito nello standard ISO/IEC 15948:2003.

PNG lavora senza perdita e permette di definire diverse pro­fon­di­tà cro­ma­ti­che e tavolozze di colori fles­si­bi­li. È stato svi­lup­pa­to anche allo scopo di creare un’al­ter­na­ti­va gratuita al formato GIF vincolato all’acquisto di una licenza. Come il formato GIF, infatti, anche quello PNG supporta un canale alfa per definire nell’immagine aree tra­spa­ren­ti che, tra le altre cose, sono ne­ces­sa­rie per creare loghi e icone per siti web e app.

Al contrario di GIF, in cui soltanto uno dei 256 colori possibili può essere tra­spa­ren­te, PNG offre un vero e proprio canale alfa che permette anche aree se­mi­tra­spa­ren­ti, ad esempio per rea­liz­za­re dis­sol­ven­ze.

JPG: in che modo la com­pres­sio­ne influisce sulla qualità?

La regola di base è la seguente: tanto maggiore è il rapporto di com­pres­sio­ne di una foto JPG, quanto peggiore è la qualità. Nei programmi di ela­bo­ra­zio­ne di immagini, la com­pres­sio­ne viene indicata come un valore della qualità: un valore di 100 cor­ri­spon­de a una qualità al cento per cento senza com­pres­sio­ne.

A questo riguardo, non esiste un rapporto lineare tra il grado di com­pres­sio­ne e le di­men­sio­ni del file. Già a basse com­pres­sio­ni, in cui la qualità è ancora molto elevata, è possibile ottenere riduzioni si­gni­fi­ca­ti­ve delle di­men­sio­ni dei file.

La foto raf­fi­gu­ra­ta, ad esempio, ha una di­men­sio­ne non compressa di 22,16 MB con una ri­so­lu­zio­ne di 4.000 x 1.936 pixel. Già al livello di qualità 95 raf­fi­gu­ra­to, la com­pres­sio­ne JPEG porta le di­men­sio­ni del file a 1,25 MB. Nella maggior parte delle fo­to­ca­me­re e degli smart­pho­ne, 95 è l’im­po­sta­zio­ne standard della qualità per il sal­va­tag­gio di foto in formato JPG.

Immagine: Esempio di foto JPG con livello di qualità 95
La foto originale della fo­to­ca­me­ra con una qualità JPG di 95.

La com­pres­sio­ne al livello di qualità 60 riduce le di­men­sio­ni del file a 194 KB, ossia il 15 percento circa rispetto al livello di qualità 95. Nell’immagine, la dif­fe­ren­za è appena per­ce­pi­bi­le:

Immagine: Esempio di foto JPG con livello di qualità 60
La foto con una com­pres­sio­ne maggiore a una qualità JPG di 60 viene comunque raf­fi­gu­ra­ta senza problemi nel browser, ma trasmessa molto più ve­lo­ce­men­te grazie alle ridotte di­men­sio­ni del file.

Con una com­pres­sio­ne maggiore, la qualità dell’immagine appare molto più scarsa a fronte di una riduzione tra­scu­ra­bi­le delle di­men­sio­ni del file. Nel cielo blu della foto esem­pli­fi­ca­ti­va, ad esempio, al livello di qualità 25 sono chia­ra­men­te ri­co­no­sci­bi­li artefatti sotto forma di anelli cromatici e il colore non è più uniforme:

Immagine: Esempio di foto JPG con livello di qualità 25
Con una com­pres­sio­ne ec­ces­si­va­men­te alta (in questo esempio, livello di qualità 25), si evi­den­zia­no chiari artefatti.

In caso di forte in­gran­di­men­to, gli artefatti della com­pres­sio­ne JPEG sono visibili già a livelli di qualità medi, come mostra l’esempio seguente. Per questo motivo la qualità JPG delle fo­to­gra­fie che si desidera far stampare su carta a de­fi­ni­zio­ne molto elevata at­tra­ver­so i servizi di foto online o nei su­per­mer­ca­ti dovrebbe rimanere quanto possibile invariata rispetto all’originale.

Immagine: Sezione ingrandita con qualità JPG 60
In caso di forte in­gran­di­men­to sono chia­ra­men­te visibili le dif­fe­ren­ze della qualità JPG.

L’immagine in­gran­di­ta mostra che gli artefatti di com­pres­sio­ne diventano par­ti­co­lar­men­te visibili su superfici mo­no­cro­ma­ti­che e in cor­ri­spon­den­za di bordi a elevato contrasto. Per questo motivo il formato JPG non è adatto per le grafiche con aree cro­ma­ti­che estese, per gli screen­shot e per le icone.

JPEG pro­gres­si­vo per una vi­sua­liz­za­zio­ne più rapida

A seconda delle pre­sta­zio­ni del sistema e della velocità di tra­sfe­ri­men­to, la vi­sua­liz­za­zio­ne di foto molto pesanti può ri­chie­de­re un po’ di tempo. Le foto in JPG sono composte da co­sid­det­ti coef­fi­cien­ti, ossia blocchi di 8 x 8 pixel, che nor­mal­men­te vengono salvati in suc­ces­sio­ne. L’immagine viene pertanto costruita riga per riga.

Con il JPEG pro­gres­si­vo viene dapprima salvato un valore cromatico medio di ciascun coef­fi­cien­te. In questo modo, in bre­vis­si­mo tempo è possibile vi­sua­liz­za­re un’immagine sfocata con pixel grandi, a cui fanno seguito in­for­ma­zio­ni cro­ma­ti­che per un quarto e un sesto di ciascun coef­fi­cien­te. La qualità della vi­sua­liz­za­zio­ne aumenta pro­gres­si­va­men­te. Chi osserva può tuttavia ottenere sin da subito un’idea dell’immagine, senza dover attendere che quest’ultima venga costruita riga per riga.

Immagine: Primo livello di visualizzazione di una foto JPG progressiva
Nel 1° livello di una foto JPG pro­gres­si­va si vi­sua­liz­za­no solo pixel cromatici di grandi di­men­sio­ni e in­de­fi­ni­ti.
Immagine: Terzo livello di visualizzazione di una foto JPG progressiva
La foto JPEG pro­gres­si­va viene a mano a mano vi­sua­liz­za­ta con una ri­so­lu­zio­ne sempre più elevata.

Perdite da com­pres­sio­ne dovute all’ela­bo­ra­zio­ne dell’immagine

I programmi di ela­bo­ra­zio­ne di immagini elaborano ogni singolo pixel di un’immagine presente nel file, vale a dire anche i pixel il cui colore è stato falsato dalla com­pres­sio­ne. Se su un’immagine viene applicato un filtro cromatico o un effetto, oppure se l’immagine viene ri­di­men­sio­na­ta, al suc­ces­si­vo sal­va­tag­gio viene eseguita una nuova com­pres­sio­ne e si verifica quindi un peg­gio­ra­men­to della qualità.

I contrasti sui bordi o i colori andati perduti non potranno più essere re­cu­pe­ra­ti. So­prat­tut­to se in seguito si tenta di aumentare la nitidezza dell’immagine, gli artefatti di com­pres­sio­ne ri­sul­te­ran­no ac­cen­tua­ti. Tanto minore è il livello di qualità di una foto, quanto più evidenti saranno gli effetti degli in­ter­ven­ti suc­ces­si­vi sulla qualità. In questo caso, aumentare nuo­va­men­te il livello della qualità in un momento suc­ces­si­vo non serve a nulla.

Consiglio

Il formato JPG permette la rotazione senza perdita dell’immagine in passi di 90°. Tuttavia, questa funzione deve essere sup­por­ta­ta dal programma di ela­bo­ra­zio­ne di immagini. In caso contrario, la nuova com­pres­sio­ne determina perdite di qualità. Alcuni programmi con­sen­to­no anche di eseguire tagli per­pen­di­co­la­ri senza che l’area tagliata venga nuo­va­men­te compressa al momento del sal­va­tag­gio.

JPG vs PNG: screen­shot

In qualunque tipologia di do­cu­men­ta­zio­ne relativa a programmi in­for­ma­ti­ci è ne­ces­sa­rio fare ricorso a screen­shot di finestre Windows o di app per smart­pho­ne. L’ideale è creare questi screen­shot in formato PNG, opzione peraltro già pre­im­po­sta­ta in quasi tutti i programmi per fare screen­shot. Anche gli smart­pho­ne Android, ad esempio, salvano gli screen­shot au­to­ma­ti­ca­men­te in formato PNG.

Gli screen­shot sono rea­liz­za­ti con linee diritte e ben definite, con contrasti nitidi e superfici mo­no­cro­ma­ti­che, senza sfumature. Tutte queste ca­rat­te­ri­sti­che sono grandi punti deboli del formato JPG. I seguenti screen­shot di una finestra di dialogo di Windows 10 mostrano la dif­fe­ren­za tra il formato JPG e il formato PNG.

Immagine: Screenshot di Windows in formato PNG
Nel formato PNG, lo screen­shot vi­sua­liz­za la finestra esat­ta­men­te come appare sullo schermo.
Immagine: Screenshot di Windows in formato JPG
Nel formato JPG, in cor­ri­spon­den­za delle superfici mo­no­cro­ma­ti­che e nelle aree con­te­nen­ti testo sono chia­ra­men­te visibili degli artefatti.

La dif­fe­ren­za di qualità tra JPG e PNG risulta par­ti­co­lar­men­te evidente quando le immagini vengono in­gran­di­te. Lo screen­shot seguente mostra gli artefatti del formato JPG nell’area della tavolozza dei colori e attorno alle lettere nere su sfondo bianco.

Immagine: Artifatti nell’area ingrandita del formato JPG
In caso di forte in­gran­di­men­to, sullo screen­shot sono chia­ra­men­te visibili gli artefatti del formato JPG.

JPG vs PNG: pa­no­ra­mi­ca dei vantaggi e degli svantaggi

Tra i formati JPG e PNG esistono numerose dif­fe­ren­ze. Entrambi i formati di immagine pre­sen­ta­no vantaggi e svantaggi, riassunti nella tabella seguente.

JPEG PNG
Com­pres­sio­ne Con perdita, re­go­la­bi­le Senza perdita
Di­men­sio­ne del file Molto ridotta a seconda della com­pres­sio­ne Net­ta­men­te maggiore rispetto a JPG
Colori 16,7 milioni Fino a 16,7 milioni, possibili anche minori pro­fon­di­tà di colore per limitare le di­men­sio­ni dei file.
Vi­sua­liz­za­zio­ne pro­gres­si­va No
Tra­spa­ren­za No Sì, con canale alfa
Ela­bo­ra­zio­ne senza perdita Rotazione di 90° e ritagli, se sup­por­ta­to dal programma
Metadati nell’immagine Standard EXIF e IPTC Possibili, ma non stan­dar­diz­za­ti (non leggibili da tutti i programmi)
Posizione GPS nell’immagine Possibile, a seconda delle funzioni della fo­to­ca­me­ra No
Sal­va­tag­gio au­to­ma­ti­co sullo smart­pho­ne Foto Screen­shot
Di­men­sio­ne massima dell’immagine Lato più lungo: 65.535 pixel A seconda del sistema, in teoria il­li­mi­ta­ta

JPG o PNG? Esten­sio­ni e nuovi formati

Oltre a formati più recenti come HEIF per foto o WebP per grafica, sono stati fatti ripetuti tentativi di estendere i due noti formati immagine JPG e PNG. Finora, tuttavia, nessuno di questi formati è riuscito nemmeno lon­ta­na­men­te a rag­giun­ge­re il grado di dif­fu­sio­ne di JPG o PNG.

JPEG 2000

JPEG 2000, non com­pa­ti­bi­le con il formato JPEG, consente una migliore com­pres­sio­ne a pari livello di qualità o com­pres­sio­ne senza perdita. Alcune aree dell’immagine, più ricche di dettagli, possono essere vi­sua­liz­za­te con una qualità migliore rispetto alle aree meno im­por­tan­ti. Sono possibili più di 8 bit per canale colore e di­men­sio­ni dell’immagine molto più grandi.

Per la vi­sua­liz­za­zio­ne è possibile scegliere tra diverse modalità di pro­gres­sio­ne e i metadati possono contenere qualunque in­for­ma­zio­ne in formato XML. Le possibili esten­sio­ni dei file sono: .jp2, .j2k, .jpf, .jpg2, .jpx, .jpm. No­no­stan­te i numerosi vantaggi, JPEG 2000 non è finora riuscito a sop­pian­ta­re il classico JPEG.

JNG

JPEG Network Graphics (JNG) amplia il formato JPEG di un canale alfa che può essere integrato senza perdita sotto forma di flusso di dati PNG. Il formato non ha un proprio tipo MIME re­gi­stra­to.

APNG

Il formato Animated Portable Network Graphics (APNG) aggiunge al formato PNG le ani­ma­zio­ni, ana­lo­ga­men­te a quanto possibile con il formato GIF.

PNG+

Amplia il formato PNG ag­giun­gen­do livelli di immagine (layer) e layout mul­ti­pa­gi­na. Questo formato è stato uti­liz­za­to solo dal programma Microsoft Picture It! (ora sospeso) e non è riuscito ad af­fer­mar­si.

N.B.

I formati JNG, APNG e PNG+ non sono rac­co­man­da­ti dal W3C, motivo per cui sono poco diffusi.

WebP

Il formato di immagine WebP è stato svi­lup­pa­to da Google e pub­bli­ca­to nel 2010, per unire JPEG, PNG e GIF in un unico formato moderno. Supporta sia la com­pres­sio­ne con che senza perdita, inclusi tra­spa­ren­za (canale alfa) e ani­ma­zio­ni. WebP offre di­men­sio­ni di file no­te­vol­men­te più piccole rispetto a JPG o PNG con una qualità d’immagine com­pa­ra­bi­le. Lo standard è oggi sup­por­ta­to da tutti i prin­ci­pa­li browser (Chrome, Firefox, Edge, Safari) ed è par­ti­co­lar­men­te ot­ti­miz­za­to per l’uso sul web. L’esten­sio­ne del file è .webp.

AVIF

AVIF (AV1 Image File Format) si basa sul moderno codec video AV1 e offre una com­pres­sio­ne delle immagini molto ef­fi­cien­te con alta qualità delle immagini. Supporta la com­pres­sio­ne senza e con perdita, alta pro­fon­di­tà di colore, HDR, tra­spa­ren­za e ani­ma­zio­ni. Rispetto a WebP, AVIF raggiunge so­li­ta­men­te di­men­sio­ni di file più piccole con la stessa qualità, ma richiede più potenza di calcolo nella codifica e de­co­di­fi­ca. È sempre più sup­por­ta­to dai browser e dalle piat­ta­for­me moderne. L’esten­sio­ne del file è .avif.

JPEG XL

Anche JPEG XL è stato concepito come un moderno suc­ces­so­re di formati classici come JPEG, PNG e GIF e offre sia com­pres­sio­ne senza che con perdita di dati. Supporta alte pro­fon­di­tà di colore, grandi di­men­sio­ni delle immagini, ani­ma­zio­ni, tra­spa­ren­za ed è inoltre com­pa­ti­bi­le re­troat­ti­va­men­te con JPEG; i JPG esistenti possono quindi essere con­ver­ti­ti senza perdita di qualità. Il suo utilizzo è at­tual­men­te ancora limitato, poiché piat­ta­for­me im­por­tan­ti come Google Chrome hanno tem­po­ra­nea­men­te sospeso il supporto. L’esten­sio­ne del file è .jxl.

JPG o PNG: per quale impiego è più indicato ciascun formato?

Il formato JPG è stato svi­lup­pa­to per le foto e, per questo, dà il meglio di sé in quest’ambito. So­prat­tut­to le immagini di panorami o persone non mostrano quasi alcun artefatto da com­pres­sio­ne. Grazie alle ridotte di­men­sio­ni dei file, il formato JPG si adatta bene per creare le immagini destinate ai siti web. Qualche artefatto è visibile soltanto nelle fo­to­gra­fie di prodotti molto det­ta­glia­te e con bordi ben definiti. Anche la rimozione dello sfondo per l’iso­la­men­to di oggetti all’interno di fo­to­gra­fie di prodotti viene resa più dif­fi­col­to­sa dalla com­pres­sio­ne.

Il formato PNG è adatto a tutti i tipi di elementi grafici in cui sono presenti bordi definiti e superfici mo­no­cro­ma­ti­che. Lo stesso vale per gli screen­shot e per la con­ver­sio­ne di grafiche vet­to­ria­li in grafiche raster nei sistemi che non sono in grado di rap­pre­sen­ta­re grafiche vet­to­ria­li. Il canale alfa consente di impostare aree dell’immagine tra­spa­ren­ti, par­ti­co­lar­men­te im­por­tan­ti per creare icone per app e siti web.

Per decidere ra­pi­da­men­te quale formato di immagine sia più adatto al tuo caso d’uso, può essere utile dare un’occhiata al nostro diagramma ad albero:

Immagine: Diagramma per decidere il formato di immagine più adatto
Il nostro diagramma ad albero ti aiuta nella scelta di un formato di immagine adatto.
Sito web con dominio
Crea il tuo sito web per­so­na­liz­za­to

MyWebsite Now Starter è lo strumento pensato per i prin­ci­pian­ti che vogliono creare un sito web in modo intuitivo. Include dominio e indirizzo e-mail.

Vai al menu prin­ci­pa­le