JPG vs PNG vs WebP: Welk afbeeldingsformaat moet u gebruiken?
Een praktische gids om het juiste beeldformaat te kiezen . . waar elk van hen eigenlijk goed in is, en de conversies die het maken waard zijn.
Drie formaten dekken bijna elke afbeelding die u ooit zult behandelen. Het kiezen van de verkeerde kost u ofwel bestandsgrootte of kwaliteit, en meestal kun je niet zeggen welke totdat het te laat is.
Hier is de korte versie, dan de redenering.
De korte versie
| Gebruik | Formaat | Waarom |
|---|---|---|
| Foto's | JPG | Kleinste bestanden voor fotografische inhoud, overal ondersteund |
| Schermafbeeldingen, logo's, scherpe randen | PNG | Verliesloos, geen artefacten rond tekst, ondersteunt transparantie |
| Alles op een website die u beheert | WebP | 25-35% kleiner dan PNG, en ook kleiner dan JPG |
| Lopende werkzaamheden | PNG | Verliesloos, dus herhaalde besparingen niet afbreken |
JPG: lossy, universeel, het beste voor foto's
JPG gooit gegevens weg om zijn grootte te bereiken, en het is zeer goed in het weggooien van de gegevens die u het minst waarschijnlijk mist in een foto . . subtiele kleurvariatie over gladde gradiënten zoals huid en lucht.
Het is de verkeerde keuze voor twee dingen:
- Tekst en scherpe randen. JPG produceert zichtbare halo's rond de grenzen van hoge contrasten. Een screenshot die is opgeslagen als JPG ziet er merkbaar slechter uit dan dezelfde screenshot als PNG, op een grotere bestandsgrootte.
- Alles wat je weer wilt bewerken. Elke opslaan gooit meer. Vijf rondes van bewerken-en-opslaan en de schade is duidelijk. Als u nog steeds bezig bent met een afbeelding, converteren naar PNG Eerst.
JPG heeft ook geen enkele transparantie. Een logo dat wordt geëxporteerd als JPG komt met een witte doos eromheen.
PNG: verliesloos, transparant, groter
PNG slaat elke pixel precies op. Niets wordt weggegooid, hoe vaak je het ook opslaat. Dat maakt het juist voor screenshots, diagrammen, logo's, pictogrammen, en alles met een alfakanaal.
De kosten zijn groot. Een foto die als PNG wordt opgeslagen kan gemakkelijk vijf keer het JPG equivalent zijn zonder zichtbaar voordeel, omdat verliesloze compressie niet kan overeenkomen met wat JPG bereikt door informatie weg te gooien.
Eén ding kan PNG niet doen: herstel wat JPG al vernietigd heeft. Het omzetten van een zwaar gecomprimeerde JPG naar PNG behoudt het getrouw, artefacten inbegrepen. Het stopt verder verlies; het doet niet ongedaan verleden verlies.
WebP: de moderne standaard voor het web
WebP doet beide taken 25-35% kleiner dan PNG van vergelijkbare kwaliteit, en aanzienlijk kleiner dan JPG.
Browser ondersteuning stopte jaren geleden een zorg: Chrome, Firefox, Safari en Rand allemaal te behandelen, op desktop en mobiel.
Waarom is er nog iets PNG? uit het web. Veel desktop editors, drukkerijen, fotodiensten en upload formulieren weigeren het nog steeds. Dat is de enige echte beperking, en het is waarom de twee meest nuttige conversies zijn tegenover elkaar:
- PNG naar WebP — wanneer de afbeelding gaat op een pagina die u controleert
- WebP naar JPG — wanneer iets stroomafwaarts WebP niet accepteert
De regel die de meeste gevallen bestrijkt
Foto op het web? WebP, terugvallen op JPG. Gaat de foto ergens anders heen? JPG. Iets met tekst, scherpe randen of transparantie? PNG op het bureaublad, WebP op het web. Nog steeds aan het bewerken? PNG, altijd, totdat je klaar bent.
En op wie je ook landt, formaat wijzigen naar de grootte die het daadwerkelijk zal worden weergegeven op voordat u comprimeren. Format keuze is veel minder waard dan niet het verschepen van een 4000-pixel afbeelding in een 800-pixel slot.