In breve
- Il PNG è senza perdita, quindi conserva ogni pixel esattamente, mentre il JPG è con perdita e scarta il dettaglio che l’occhio nota meno.
- Usa il PNG per testo, loghi, screenshot, colore piatto e tutto ciò che richiede uno sfondo trasparente.
- Usa il JPG per le fotografie, dove la sua compressione si vede poco e il file è diverse volte più piccolo.
- Il JPG non supporta la trasparenza e tende a mostrare blocchi e bande nei gradienti morbidi e intorno alle scritte nitide.
- Le piattaforme social ricomprimono ogni caricamento, quindi partire da un PNG pulito o da un JPG di alta qualità dà alla loro compressione meno da rovinare.
In questa pagina
La risposta breve a PNG o JPG: usa il PNG per tutto ciò che ha testo, loghi, colore piatto, bordi netti o uno sfondo trasparente, e usa il JPG per le fotografie. Il PNG è senza perdita, quindi ogni pixel che esporti è il pixel che arriva. Il JPG è con perdita: butta via dettaglio per rendere il file piccolo, e il dettaglio che butta via è esattamente ciò che rende nitide le scritte e morbidi i gradienti. Una foto nasconde bene quella perdita. Un titolo su un gradiente no.
La differenza tra PNG e JPG
Entrambi i formati memorizzano una griglia di pixel, quindi nessuno dei due si ingrandisce senza sfocarsi. Ciò che li separa è il modo in cui comprimono quella griglia in un file.
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
JPG (JPEG)
Il JPG funziona dividendo l’immagine in piccoli quadrati di 8×8 pixel e semplificando colore e dettaglio fine dentro ogni quadrato. In una foto piena di texture quella semplificazione si perde nel rumore. In un gradiente morbido o sul bordo di una lettera, compare come deboli blocchi, aloni sbavati e bande di colore a gradini.
Quando usare il PNG
- Grafiche piene di testo: card con citazioni, annunci, caroselli, slide.
- Loghi e icone, specialmente su uno sfondo trasparente.
- Screenshot di interfacce, dove il JPG sfoca il testo piccolo.
- Gradienti e colore piatto, che fanno banding e blocchi con la compressione JPG.
- File master che modificherai ancora, così la qualità non si perde a ogni salvataggio.
Un post di testo su gradiente esportato come PNG: scritte nitide, nessuna banda.
Salvato come JPG molto compresso, è qui che gli artefatti si vedono per primi: aloni intorno alle lettere e gradini negli angoli scuri.
Quando usare il JPG
Usa il JPG per le fotografie: foto di prodotto, ritratti, viaggi, cibo. Le foto vere sono piene di grana e texture, che mascherano la compressione, e un JPG con qualità intorno a 80-85 di solito appare identico all’originale con una frazione del peso. Una foto PNG grande può facilmente pesare diverse volte di più senza alcun guadagno visibile.
Il JPG va bene anche per design che sono per lo più foto con un po’ di testo, purché il testo sia grande. Se il testo è piccolo o sottile, o sta su un cielo morbido, esporta in PNG, oppure prova entrambi e confronta con zoom al 100%.
PNG o JPG per i social
Instagram, Facebook, X e LinkedIn ricomprimono tutto ciò che carichi, di solito in JPG. Sembra un motivo per non preoccuparsene, ma è il contrario: la compressione si somma. Un JPG già compresso viene compresso di nuovo e gli artefatti raddoppiano. Dai alla piattaforma il file più pulito possibile, alla misura esatta che si aspetta, così non ha nulla da ridimensionare. Le misure sono in dimensioni delle immagini per i social.
Post Instagram 1080×1350
1080 × 1350
Storia 1080×1920
1080 × 1920
Post su X 1600×900
1600 × 900
Post LinkedIn 1200×1200
1200 × 1200
Esporta come
Perché
Esporta come
Perché
Esporta come
Perché
Esporta come
Perché
Esporta come
Perché
PNG o JPG per un logo
PNG, sempre, se ti serve un file a pixel. Un logo è fatto di forme piatte e bordi netti, che il PNG comprime bene e il JPG rovina, e un logo quasi sempre ha bisogno di uno sfondo trasparente per stare su foto, colori e modalità scura. Meglio ancora, tieni il master in SVG, che resta nitido a qualsiasi misura. SVG o PNG spiega quando usare quale, e dimensioni del logo elenca i file che ti servono.
Perché i gradienti fanno banding in JPG
I gradienti morbidi sono la prova più dura per qualsiasi formato. Una fusione scura da quasi nero a viola profondo ha solo poche decine di valori di colore distinti con cui lavorare, e la compressione JPG unisce i vicini in strisce visibili. Questo è il banding dei gradienti, ed è peggiore sugli sfondi scuri e a basso contrasto.
linear-gradient(180deg, #0b0a14 0%, #1a1233 45%, #2e1a5c 100%)Causa il banding
- JPG a qualità 60 o meno
- Salvare un JPG, modificarlo e salvarlo di nuovo
- Una fusione digitale perfettamente pulita senza texture
- Caricare una misura che la piattaforma deve ridimensionare
Lo previene
- PNG per tutto ciò che ha un gradiente
- JPG a 90 o più se devi usare il JPG
- Un livello di grana leggera, che spezza i gradini
- Esportare alla misura esatta in pixel della piattaforma
La grana aiuta più di qualsiasi impostazione, perché dà al compressore una texture su cui lavorare invece di una distesa piatta di colori quasi identici. Gradienti granulosi mostra quanta ne basta. I Mark di Gradiently portano la propria grana e luce, che è esattamente la texture che aiuta un design con gradiente a sopravvivere alla ricompressione di una piattaforma.
E WebP e AVIF?
Sul tuo sito, i formati più recenti battono entrambi: WebP e AVIF possono essere con o senza perdita, supportano la trasparenza e sono più piccoli a pari qualità. Ogni browser attuale supporta WebP. Tieni PNG e JPG per i caricamenti sulle piattaforme e per condividere file, e leggi WebP rispetto a PNG e JPG prima di rifare le immagini del tuo sito. Per le impostazioni vere e proprie, vedi compressione delle immagini senza rovinare i gradienti.
Le domande più frequenti
Il PNG ha una qualità migliore del JPG?
Il PNG è senza perdita, quindi non perde mai qualità, per quante volte lo salvi. Per le fotografie un JPG di alta qualità sembra uguale all’occhio ed è molto più piccolo, quindi «migliore» dipende dal contenuto.
Devo pubblicare PNG o JPG su Instagram?
PNG per testo, grafiche e gradienti, JPG a qualità 85 o più per le foto. Instagram ricomprime entrambi, quindi esporta alla misura esatta che si aspetta, come 1080×1350 per un post verticale.
Il JPG supporta gli sfondi trasparenti?
No. Il JPG non ha un canale alfa, quindi le aree trasparenti vengono riempite con un colore pieno, di solito il bianco. Usa PNG, WebP o SVG per la trasparenza.
Perché il mio gradiente è a strisce dopo averlo salvato come JPG?
La compressione JPG unisce colori simili nelle fusioni morbide in bande visibili. Esporta il design come PNG, alza la qualità JPG a 90 o più, oppure aggiungi un livello di grana leggera.
JPEG è lo stesso di JPG?
Sì. Sono lo stesso formato; JPG è semplicemente la versione di tre lettere dell’estensione.
Scritto da Gradiently
Il team dietro Gradiently, uno strumento di design costruito attorno ai Mark: gradienti vivi che fanno sembrare tuo tutto ciò che progetti.
Vedi il nostro profilo