Progressive JPEG: un’introduzione
La redazione di IONOS5 mins
Il formato di immagine più comunemente usato sul web è il JPEG. Circa il 71,4% di tutti i siti web contengono foto e grafici in questo formato. Tuttavia, il JPEG è in realtà solo un termine generico per uno standard di compressione delle immagini. Anche il PJPEG, o progressive JPEG, fa parte di questo standard. I JPEG progressivi comprimono foto e grafici in un modo speciale che fa sì che il browser carichi i file in modo diverso rispetto ai JPEG “normali” o baseline.
Nozioni di base: JPEG e compressione di immagini
JPEG si riferisce a uno standard sviluppato nel 1992 per la compressione delle immagini, che comprende diversi metodi di compressione. L’abbreviazione JPEG sta per “Joint Photographic Expert Group”, ovvero il comitato di esperti che ha sviluppato questo standard. JPEG è il formato di immagine più comunemente usato sul web e, grazie alla sua efficienza, viene utilizzato sia per grafici complessi con un’elevata profondità di colore che per le foto. Lo standard prevede notevoli differenze di compressione in base alle impostazioni di esportazione utilizzate dal corrispondente programma di elaborazione delle immagini.
La compressione riduce le dimensioni dei file, come ad esempio i file di immagini. In questo modo si risparmia spazio di archiviazione e si riducono i tempi di trasferimento e caricamento. In termini concreti, un tempo di trasmissione più breve significa che un’immagine si carica più velocemente su un sito web. La riduzione della dimensione del file, tuttavia, avviene, nella maggior parte dei casi, a spese del contenuto, che deve in qualche modo essere ridotto. Soprattutto quando si tratta di immagini e grafici è quindi necessario assicurarsi che la qualità dell’immagine non venga ridotta eccessivamente durante la compressione. È vero che in questo modo i tempi di caricamento del file saranno più brevi, ma il risultato è meno convincente.
PJPEG
Il cosiddetto PJPEG o progressive JPEG è uno dei metodi per la compressione delle immagini dello standard JPEG. Anche i PJPEG vengono creati utilizzando un algoritmo di compressione, ma sono strutturati diversamente quando vi si accede dal browser. I PJPEG funzionano in tutti i browser attuali, compresi Chrome, Firefox e Internet Explorer dalla versione 9. Tutti i vecchi Internet Explorer presentano invece difficoltà significative nella visualizzazione dei JPEG progressivi. Questo tuttavia è irrilevante per la maggior parte dei progetti web, se si considera che la distribuzione mondiale di Internet Explorer 8 è appena dello 0,4%. Un browser che non supporta il formato progressive JPEG caricherà la foto corrispondente come un JPEG normale. Qual è esattamente la differenza tra i due formati?
JPEG vs PJPEG
La differenza principale tra JPEG e PJPEG sta nel modo in cui l’immagine viene caricata. Mentre i baseline JPEG (cioè i JPEG “normali”) caricano le immagini linea per linea dall’alto verso il basso, i progressive JPEG li caricano in modo diverso: nel caso dei PJPEG, l’intera immagine viene visualizzata immediatamente e caricata pixel per pixel. Questo significa che l’immagine appare inizialmente sfocata e pixelata per poi diventare gradualmente più nitida. Mentre un baseline JPEG viene caricato dall’alto verso il basso, un PJPEG viene praticamente costruito dal retro verso avanti.
Questo ha un effetto positivo sulla User Experience, cioè sul modo in cui l’utente percepisce il sito web. Il caricamento del sito viene soggettivamente percepito come più rapido perché non ci sono aree bianche che devono essere riempite visivamente. La sequenza di immagini illustra il modo in cui vengono effettivamente caricati i JPEG e i PJPEG. I baseline JPEG caricano i pixel dell’immagine linea per linea dall’alto verso il basso:
In confronto, le immagini in formato PJPEG vengono caricate da dietro in avanti. L’immagine diventa più chiara con il caricamento e il numero di pixel aumenta gradualmente.
Vantaggi e svantaggi dei PJPEG
Il fatto che appaia un’immagine completa sin dall’inizio, anche se fuori fuoco, è percepito come piacevole da molti utenti. Ma anche i PJPEG hanno degli svantaggi.
| Vantaggi | Svantaggi |
|---|---|
| Programmi come Photoshop consentono di determinare con precisione il tasso di compressione | Le versioni precedenti a Internet Explorer 9 hanno serie difficoltà nella visualizzazione dei PJPEG |
| File di dimensioni ridotte | Lo sfondo trasparente, tipico ad esempio dei GIF, non è supportato |
| Qualità dell’immagine relativamente elevata nonostante la compressione notevole | Con i browser moderni, la maggiore velocità di caricamento è quasi impercettibile |
| Effetto positivo sulla User Experience: caricamento percepito come più veloce grazie alla riduzione degli spazi bianchi | Effetto negativo sulla User Experience perché non è possibile stabilire il termine del caricamento |
Creare file PJPEG
La maggior parte dei programmi di elaborazione delle immagini salva automaticamente le foto e i grafici nel formato baseline JPEG. Salvare i file come PJPEG è comunque molto facile. Ci sono diversi modi per creare un file progressive JPEG. Con programmi come IrfanView o Adobe Photoshop è molto semplice esportare i file nel formato moderno. Per salvare un’immagine come PJPEG con il popolare programma di elaborazione delle immagini Adobe Photoshop, procedete come segue:
- Andate sull’opzione “Esporta” nel menu “File” e selezionate “Salva per Web (legacy)”
- In alto a destra, selezionate JPEG come formato del file e spuntate la casella “Progressive”
- Impostate la qualità desiderata
- Fate clic su “Salva” in basso a sinistra
Anche il programma gratuito IrfanView vi permette di salvare i file nel formato progressive JPEG ed è un’alternativa semplice all’opzione professionale Adobe Photoshop. IrfanView non è disponibile per iOS. Per salvare un file come PJPEG, procedete come segue:
- Fate clic su “Salva” nel menu “File” o sull’icona “Salva”
- Nella finestra di dialogo “Opzioni di salvataggio JPEG/GIF” spuntate l’opzione “Salva come progressive JPEG”
- Fate clic su “Salva”
Ora i file possono essere facilmente integrati in un sito web. Se il browser dell’utente supporta il formato, la foto o la grafica verrà caricata come JPEG progressivo.
