De korte versie
- PNG is verliesvrij en bewaart dus elke pixel exact, terwijl JPG verlies geeft en detail weggooit dat het oog minder snel opmerkt.
- Gebruik PNG voor tekst, logo’s, screenshots, vlakke kleur en alles wat een transparante achtergrond nodig heeft.
- Gebruik JPG voor foto’s, waar de compressie moeilijk te zien is en het bestand een paar keer kleiner is.
- JPG ondersteunt geen transparantie en laat vaak blokken en banden zien in vloeiende verlopen en rond scherpe letters.
- Socialemediaplatforms comprimeren elke upload opnieuw, dus starten met een schone PNG of een JPG van hoge kwaliteit geeft hun compressie minder om te beschadigen.
Op deze pagina
Het korte antwoord op PNG of JPG: gebruik PNG voor alles met tekst, logo’s, vlakke kleur, scherpe randen of een transparante achtergrond, en gebruik JPG voor foto’s. PNG is verliesvrij, dus elke pixel die je exporteert is de pixel die aankomt. JPG geeft verlies: het gooit detail weg om het bestand klein te maken, en het detail dat het weggooit maakt juist letters scherp en verlopen vloeiend. Een foto verbergt dat verlies goed. Een kop op een verloop niet.
Het verschil tussen PNG en JPG
Beide formaten slaan een raster van pixels op, dus geen van beide schaalt omhoog zonder zacht te worden. Wat ze scheidt is hoe ze dat raster in een bestand persen.
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
JPG (JPEG)
JPG werkt door het beeld in kleine vierkantjes van 8×8 pixels te splitsen en dan de kleur en het fijne detail in elk vierkantje te vereenvoudigen. In een foto vol textuur verdwijnt die vereenvoudiging in de ruis. In een vloeiend verloop of rond de rand van een letter verschijnt ze als vage blokken, uitgesmeerde halo’s en getrapte kleurbanden.
Wanneer je PNG gebruikt
- Graphics met veel tekst: quotekaarten, aankondigingen, carrousels, slides.
- Logo’s en pictogrammen, vooral op een transparante achtergrond.
- Screenshots van interfaces, waar JPG kleine letters vervaagt.
- Verlopen en vlakke kleur, die bij JPG-compressie banden en blokken krijgen.
- Masterbestanden die je opnieuw bewerkt, zodat er niet bij elke keer opslaan kwaliteit verloren gaat.
Een tekstpost op een verloop geëxporteerd als PNG: scherpe letters, geen banden.
Opgeslagen als sterk gecomprimeerde JPG zie je hier eerst artefacten: halo’s rond de letters en trappen in de donkere hoeken.
Wanneer je JPG gebruikt
Gebruik JPG voor foto’s: productfoto’s, portretten, reizen, eten. Echte foto’s zitten vol korrel en textuur, wat compressie maskeert, en een JPG op een kwaliteit van ongeveer 80 tot 85 ziet er meestal identiek uit aan het origineel op een fractie van de grootte. Een grote PNG-foto kan makkelijk een paar keer zwaarder zijn zonder zichtbare winst.
JPG past ook bij ontwerpen die vooral foto zijn met een beetje tekst, zolang de tekst groot is. Is de tekst klein of dun, of staat hij over een vloeiende lucht, exporteer dan PNG, of test beide en vergelijk op 100% zoom.
PNG of JPG voor social media
Instagram, Facebook, X en LinkedIn comprimeren alles wat je uploadt opnieuw, meestal naar JPG. Dat klinkt als een reden om je er niets van aan te trekken, maar het is het tegenovergestelde: compressie stapelt. Een JPG die al is samengeperst, wordt opnieuw samengeperst en artefacten verdubbelen. Geef het platform het schoonste bestand dat je kunt, op het exacte formaat dat het verwacht, zodat het niets hoeft te schalen. De formaten staan in afbeeldingsformaten voor social media.
Instagrampost 1080×1350
1080 × 1350
Story 1080×1920
1080 × 1920
X-post 1600×900
1600 × 900
LinkedIn-post 1200×1200
1200 × 1200
Exporteer als
Waarom
Exporteer als
Waarom
Waarom
Exporteer als
Waarom
Exporteer als
Waarom
PNG of JPG voor een logo
PNG, altijd, als je een pixelbestand nodig hebt. Een logo bestaat uit vlakke vormen en harde randen, die PNG goed comprimeert en JPG beschadigt, en een logo heeft bijna altijd een transparante achtergrond nodig om op foto’s, kleuren en donkere modus te kunnen staan. Beter nog: bewaar de master als SVG, dat op elk formaat scherp blijft. SVG of PNG legt uit wanneer je wat gebruikt, en logoformaten somt de bestanden op die je nodig hebt.
Waarom verlopen banden krijgen in JPG
Vloeiende verlopen zijn de zwaarste test voor elk formaat. Een donkere overgang van bijna zwart naar diep violet heeft maar enkele tientallen verschillende kleurwaarden om mee te werken, en JPG-compressie voegt buren samen tot zichtbare strepen. Dat is banding in verlopen, en het is het ergst op donkere achtergronden met weinig contrast.
linear-gradient(180deg, #0b0a14 0%, #1a1233 45%, #2e1a5c 100%)Veroorzaakt banding
- JPG op kwaliteit 60 of lager
- Een JPG opslaan, bewerken en weer opslaan
- Een volkomen schone digitale overgang zonder textuur
- Een formaat uploaden dat het platform moet herschalen
Voorkomt het
- PNG voor alles met een verloop
- JPG op 90 of hoger als je JPG moet gebruiken
- Een lichte korrellaag, die de trappen breekt
- Exporteren op het exacte pixelformaat van het platform
Korrel helpt meer dan welke instelling ook, omdat het de compressor textuur geeft om mee te werken in plaats van een vlakke reeks bijna identieke kleuren. Korrelige verlopen toont hoeveel genoeg is. De Marks van Gradiently dragen hun eigen korrel en licht, precies de textuur die een verloopontwerp helpt de hercompressie van een platform te overleven.
En WebP en AVIF dan
Op je eigen website winnen nieuwere formaten van beide: WebP en AVIF kunnen met of zonder verlies zijn, ondersteunen transparantie en zijn kleiner bij dezelfde kwaliteit. Elke huidige browser ondersteunt WebP. Houd PNG en JPG voor uploads naar platforms en voor het delen van bestanden, en lees WebP vs PNG en JPG voordat je de afbeeldingen van je site opnieuw opbouwt. Voor de instellingen zelf, zie afbeeldingscompressie zonder verlopen te verpesten.
Vragen die mensen stellen
Is PNG van betere kwaliteit dan JPG?
PNG is verliesvrij en verliest dus nooit kwaliteit, hoe vaak je het ook opslaat. Voor foto’s ziet een JPG van hoge kwaliteit er voor het oog hetzelfde uit en is veel kleiner, dus beter hangt af van de inhoud.
Moet ik PNG of JPG op Instagram posten?
PNG voor tekst, graphics en verlopen, JPG op kwaliteit 85 of hoger voor foto’s. Instagram comprimeert beide opnieuw, dus exporteer op het exacte formaat dat het verwacht, zoals 1080×1350 voor een staande post.
Ondersteunt JPG transparante achtergronden?
Nee. JPG heeft geen alfakanaal, dus transparante gebieden worden gevuld met een effen kleur, meestal wit. Gebruik PNG, WebP of SVG voor transparantie.
Waarom ziet mijn verloop er gestreept uit na opslaan als JPG?
JPG-compressie voegt vergelijkbare kleuren in vloeiende overgangen samen tot zichtbare banden. Exporteer het ontwerp als PNG, verhoog de JPG-kwaliteit naar 90 of meer, of voeg een lichte korrellaag toe.
Is JPEG hetzelfde als JPG?
Ja. Het is hetzelfde formaat; JPG is gewoon de versie van de extensie met drie letters.
Geschreven door Gradiently
Het team achter Gradiently, een ontwerptool rond Marks: levende kleurverlopen die alles wat je ontwerpt op jou laten lijken.
Bekijk ons profiel