PNG vs JPG

JPG voor foto’s; PNG voor alles met tekst, harde randen of doorzichtigheid.

Kies PNG wanneer

PNG zodra er letters, schone lijnen of vlakken met scherpe randen in zitten: schermafbeeldingen, logo’s, diagrammen. En altijd als de achtergrond doorzichtig moet blijven.

Kies JPG wanneer

JPG voor foto’s. Bij zachte overgangen en korrel neemt hij een fractie in beslag zonder dat het verschil te zien is.

Het detail waar mensen op stuklopen

Een schermafbeelding die als JPG is opgeslagen krijgt een vuile rand om elke letter, en die gaat er niet meer af. Andersom wordt een foto als PNG enorm zonder er beter van te worden: dezelfde afbeelding die tien keer zoveel ruimte inneemt.

Wat de omzetting van PNG naar JPG werkelijk doet

A generated landscape with a low sun and three ridges, used to show what JPEG does to continuous tone. Shown as PNG.

PNG139 KB

A generated landscape with a low sun and three ridges, used to show what JPEG does to continuous tone. Shown as JPG.

JPG9 KB15.9× smaller

Een fotografisch tafereel — zachte overgangen, vage randen, korrel. Dit is het geval waarvoor JPG is bedacht, of waartegen, en de cijfers laten zien welke van de twee. Beide afbeeldingen worden door code getekend en gecodeerd door dezelfde omzetter die op deze pagina draait, dus de groottes zijn de uitvoer van de site zelf.
A generated badge: a circular gradient on a transparent background with a white bar across it, used to show what each format does with transparency and with hundreds of shades. Shown as PNG.

PNG7 KB

A generated badge: a circular gradient on a transparent background with a white bar across it, used to show what each format does with transparency and with hundreds of shades. Shown as JPG.

JPG6 KB18% smaller

Een doorzichtige achtergrond en een verloop dwars door de vorm. JPG houdt beide, of één van beide, of vult de doorzichtigheid met een effen kleur — en juist dat verschil overvalt mensen. Beide afbeeldingen worden door code getekend en gecodeerd door dezelfde omzetter die op deze pagina draait, dus de groottes zijn de uitvoer van de site zelf.
A generated application window with a sidebar, a table and a bar chart, used to show what JPEG does to flat colour and hard edges. Shown as PNG.

PNG3 KB

A generated application window with a sidebar, a table and a bar chart, used to show what JPEG does to flat colour and hard edges. Shown as JPG.

JPG16 KB6.3× larger

Vlakke kleur en harde randen, zoals in een interface, een diagram of een logo. Gedraagt zich heel anders dan de foto hierboven, en dat is waarom het antwoord «het hangt ervan af wat er in het bestand zit» is. Beide afbeeldingen worden door code getekend en gecodeerd door dezelfde omzetter die op deze pagina draait, dus de groottes zijn de uitvoer van de site zelf.

Naast elkaar

PNG en JPG regel voor regel vergeleken: wat elk bewaart en wat dat kost.
PNGJPG
Full namePortable Network GraphicsJPEG Image
Extensie.png.jpg, .jpeg, .jpe
Mediatypeimage/pngimage/jpeg
CompressieZonder verlies — er gaat niets wegMet verlies — grootte wordt met kwaliteit betaald
Deze site kan het schrijvenJaJa

Gekozen? Zet het hier om

Waar deze cijfers vandaan komen

Wat deze pagina over PNG and JPG beweert, is na te gaan, en dit zijn de documenten die de zaak beslechten.