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.
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.
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?
La differenzaprincipale 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.
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 |
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:
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:
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.
Nel 2023 i web designer daranno libero sfogo alla creatività: a partire dai design nostalgici e massimalistici fino ad arrivare a raffinatezze tecniche come lo scorrimento parallasse e i chatbot. La sfida principale in questo caso è quella di integrare nel proprio progetto i componenti scelti nel modo più armonioso possibile. Vi sveliamo quali tendenze del web design nel 2023 dovete aspettarvi.
Lo spazio di archiviazione aumenta ogni anno sempre di più grazie ai Gigabyte e Terabyte messi a disposizione. Sarebbe pertanto consigliabile ridurre le dimensioni dei dati, soprattutto se gestite una pagina web in autonomia. File compressi significano tempi di caricamento più veloci, utenti più felici e un migliore posizionamento su Google. In modo particolare sarebbe utile comprimere le immagini...
Non importa che gestiate un negozio online, che curiate un sito web aziendale oppure che amministriate un blog: senza foto e grafiche non funziona nessuno di questi progetti web. Le immagini rappresentano degli stimoli visivi che valorizzano i vostri contenuti testuali e che possono fidelizzare i vostri visitatori. Eppure non basta solamente trovare elementi grafici, bensì risulta decisivo anche...
La maggior parte dei siti web contiene una varietà di foto, grafiche e animazioni, che spesso influiscono negativamente sulle prestazioni della pagina. Vi sono però alcune misure che consentono di arginare il problema, come la compressione dei file di immagine. Con WebP, Google ha sviluppato un formato più leggero in termini di dimensione, anche se finora occupa solo un ruolo secondario nel World...
JPG vs PNG: il nostro confronto mette in evidenza vantaggi e svantaggi dei due formati di file immagine. Quale formato va utilizzato per quale scopo, quali sono le differenze tra JPG e PNG? In che modo i diversi rapporti di compressione influiscono sulla qualità dell’immagine e sulle dimensioni del file? E quali proprietà dell’immagine possono essere rappresentate solo con l’uno o l’altro formato?...
Offri ai tuoi clienti servizi professionali e affidabili con l'hosting di IONOS.
Scopri i pacchetti
Dominio omaggio per un anno