Twee compressiemodi
WebP is uniek onder gangbare afbeeldingsformaten omdat het zowel lossy als lossless compressie in één formaat biedt. JPG ondersteunt alleen lossy. PNG ondersteunt alleen lossless. WebP ondersteunt beide, en de twee modi gebruiken volledig verschillende compressie-algoritmen.
Lossy-modus
WebP lossy-compressie is gebaseerd op de intra-framepredictie van de VP8-videocodec. Het werkt door elk blok pixels te voorspellen op basis van naburige blokken en vervolgens alleen het verschil (residu) te coderen. De kwaliteitsparameter bepaalt hoe agressief het residu wordt gekwantiseerd — hogere kwaliteit betekent minder kwantisering en meer bewaarde data, lagere kwaliteit betekent agressievere kwantisering en kleinere bestanden.
Lossy WebP is ideaal voor foto's en complexe natuurlijke afbeeldingen waarbij een kleine hoeveelheid onmerkbaar dataverlies leidt tot drastische bestandsverkleining. Bij kwaliteit 80 is een lossy WebP doorgaans 65–70% kleiner dan het ongecomprimeerde origineel, zonder zichtbaar verschil voor het menselijk oog.
Lossless-modus
WebP lossless-compressie gebruikt een volledig ander algoritme op basis van ruimtelijke predictie, kleurtransformaties, LZ77-terugverwijzingen en geoptimaliseerde Huffman-codering. Elk pixel van de originele afbeelding blijft precies bewaard — het decomprimeren van een lossless WebP levert een bit-voor-bit identieke afbeelding op ten opzichte van de bron.
Lossless WebP is doorgaans 26% kleiner dan PNG voor dezelfde afbeelding. Het is ideaal voor schermafbeeldingen, pictogrammen, logo's, UI-elementen, technische diagrammen en elke afbeelding waarbij pixelnauwkeurigheid belangrijk is. De kwaliteitsparameter in lossless-modus (0–9) bepaalt de compressie-inspanning (coderingssnelheid), niet de uitvoerkwaliteit — alle instellingen leveren identieke uitvoer op, alleen met verschillende coderingssnelheden.
Belangrijk onderscheid: In lossy-modus bepaalt de kwaliteitsparameter (0–100) de uitvoerkwaliteit. In lossless-modus bepaalt de "method"-parameter (0–6) de coderingssnelheid. De uitvoer van lossless-compressie is altijd pixelzuiver, ongeacht de instellingen.
De kwaliteitsparameter (0–100)
De lossy kwaliteitsparameter van WebP werkt vergelijkbaar met de kwaliteitsinstelling van JPEG, maar de schalen zijn niet direct equivalent. Dit levert elk kwaliteitsbereik op:
Kwaliteit 50–60: zware compressie
Bij deze instellingen produceert WebP zeer kleine bestanden ten koste van zichtbaar kwaliteitsverlies. Compressie-artefacten worden merkbaar: vervaging van fijne texturen, verlies van subtiele kleurgradiënten en een "plastic" uiterlijk op huidtinten. Fijne details zoals afzonderlijke haren, stofweefsel en tekst in foto's worden zichtbaar aangetast.
Toepassing: Omgevingen met extreem beperkte bandbreedte waarbij bestandsgrootte cruciaal is en beeldkwaliteit ondergeschikt. Achtergrondafbeeldingen met lage prioriteit op trage mobiele verbindingen. Voorbeeldminiaturen die nooit op volledige grootte worden bekeken.
Kwaliteit 70–80: webstandaard
Dit is de sweet spot voor webafbeeldingen. Bij kwaliteit 75–80 zijn compressie-artefacten voor de meeste kijkers bij normale kijkafstanden en schermformaten niet waarneembaar. Fijne texturen zijn goed bewaard, kleurovergangen zijn vloeiend en de bestandsgroottebesparing ten opzichte van kwaliteit 100 is aanzienlijk (doorgaans 60–70% kleiner).
Kwaliteit 75 is de standaard van Google voor de cwebp-encoder en is de meest gebruikte instelling voor weblevering. Kwaliteit 80 is de op één na populairste keuze en biedt iets betere detailbehoud voor een bescheiden toename in bestandsgrootte.
Toepassing: Algemene webafbeeldingen, e-commerceproductfoto's, blogafbeeldingen, social-media-inhoud, nieuwsfotografie. Dit bereik is correct voor de overgrote meerderheid van webtoepassingen.
Kwaliteit 85–90: hoge kwaliteit
Bij deze instellingen behoudt WebP vrijwel alle zichtbare details. Zelfs zorgvuldige pixelniveauvergelijking met het origineel laat minimale verschillen zien. De bestandsgrootte is groter dan Q75–80, maar nog steeds aanzienlijk kleiner dan lossless of ongecomprimeerd.
De standaard van CleverUtils.com valt in dit bereik, zodat geconverteerde afbeeldingen uitstekende kwaliteit behouden voor alle praktische doeleinden. Dit is ook het aanbevolen bereik voor fotoportfolio's, hoogwaardige e-commerce (waarbij productdetail belangrijk is voor aankoopbeslissingen) en elke context waar beeldkwaliteit prioriteit heeft maar bandbreedte nog steeds telt.
Toepassing: Fotoportfolio's, hoogwaardige productafbeeldingen, medische referentieafbeeldingen (niet-diagnostisch), professionele presentaties en situaties waarbij de afbeelding op 100% zoom kan worden bekeken.
Kwaliteit 95–100: bijna-lossless
Kwaliteit 100 past de minimaal mogelijke kwantisering toe op de DCT-coëfficiënten. Het is niet lossless — er wordt nog steeds wat data verwijderd tijdens de predictie- en transformatiestappen — maar het verlies is wiskundig minimaal. Bestanden met kwaliteit 95–100 zijn slechts 20–30% kleiner dan het lossless equivalent, wat de vraag oproept of je dan gewoon lossless-modus moet gebruiken.
Het praktische visuele verschil tussen Q100 lossy en echt lossless is onzichtbaar voor het menselijk oog. Voor toepassingen waarbij aantoonbaar nul dataverlies belangrijk is (archivering, wetenschappelijke beeldvorming, pixel-art) is echt lossless de juiste keuze, omdat Q100 technisch gezien wel pixelwaarden wijzigt.
Toepassing: Archivering waarbij lossless te groot is, masterkopieën waarbij verwaarloosbaar verlies acceptabel is, bronafbeeldingen die verdere verwerking ondergaan.
Lossless-modus in detail
WebP lossless-modus is niet simpelweg "kwaliteit 100+" — het gebruikt een volledig ander compressie-algoritme. Terwijl lossy WebP gebaseerd is op VP8-videopredictie en DCT, gebruikt lossless WebP een systeem dat speciaal is ontworpen voor exacte pixelbehoud:
- Ruimtelijke predictie met 13 modi — veel meer predictieopties dan de 4 intra-modi van lossy-modus
- Kleurtransformatie — decorrelleert RGB-kanalen om entropie te verminderen
- Groen-aftrekken-transformatie — benut de hoge correlatie tussen groen en de andere kanalen in natuurlijke afbeeldingen
- Paletcodering — detecteert automatisch afbeeldingen met 256 of minder unieke kleuren en schakelt over naar geïndexeerde modus
- LZ77-terugverwijzingen — vindt en vervangt herhaalde pixelpatronen
- Huffman-codering — optimale entropiecodering voor de gecomprimeerde stroom
Het resultaat is dat lossless WebP-bestanden ongeveer 26% kleiner zijn dan equivalente PNG-bestanden. Voor afbeeldingen met een beperkt kleurenpalet (pictogrammen, eenvoudige logo's, flat-design UI) kan de besparing meer dan 40% bedragen, omdat de paletcodering en LZ77-terugverwijzingen zeer effectief zijn voor deze afbeeldingstypen.
Lossless WebP garandeert: Elke pixelwaarde in de gedecodeerde afbeelding is identiek aan het origineel. Dit is een wiskundige garantie — de compressie is volledig omkeerbaar. De bestandsgrootte hangt af van de afbeeldingsinhoud: eenvoudige afbeeldingen comprimeren uiterst goed, complexe foto's comprimeren matig.
Aanbevolen instellingen per gebruiksscenario
| Gebruiksscenario | Modus | Kwaliteit | Waarom |
|---|---|---|---|
| Webfoto's (algemeen) | Lossy | 75–85 | Beste balans tussen grootte en kwaliteit |
| E-commerceproducten | Lossy | 80–90 | Productdetail is belangrijk voor verkoop |
| Fotoportfolio | Lossy | 85–92 | Toonkwaliteit is cruciaal |
| Miniaturen | Lossy | 60–70 | Klein weergaveformaat verbergt artefacten |
| Hero-/bannerafbeeldingen | Lossy | 75–85 | Grote bestanden; groottebesparing telt het meest |
| UI-elementen / pictogrammen | Lossless | N/A | Scherpe randen degraderen bij lossy-compressie |
| Logo's | Lossless | N/A | Pixelzuivere merkidentiteit vereist |
| Schermafbeeldingen | Lossless | N/A | Tekst en UI-elementen vereisen scherpe randen |
| Archivering / back-up | Lossless | N/A | Geen dataverlies, 26% kleiner dan PNG |
Bestandsgrootte bij verschillende kwaliteitsniveaus
Zo varieert de bestandsgrootte met de kwaliteit voor een typische 1200×800-foto (representatief voor webgebruik):
| Instelling | Bestandsgrootte | vs. origineel | Visuele kwaliteit |
|---|---|---|---|
| Lossy Q50 | 85 KB | 97% kleiner | Zichtbare artefacten, "plastic" vervaging |
| Lossy Q60 | 110 KB | 96% kleiner | Kleine artefacten bij nauwkeurige inspectie |
| Lossy Q70 | 150 KB | 95% kleiner | Goed — artefacten zelden merkbaar |
| Lossy Q75 | 185 KB | 94% kleiner | Uitstekend — Google-standaard |
| Lossy Q80 | 230 KB | 92% kleiner | Uitstekend — populairste webinstelling |
| Lossy Q85 | 290 KB | 90% kleiner | Zeer hoog — verwaarloosbaar verschil met origineel |
| Lossy Q90 | 395 KB | 86% kleiner | Bijna perfect — verschillen alleen bij 200%+ zoom |
| Lossy Q100 | 820 KB | 72% kleiner | Minimale kwantisering — technisch nog steeds lossy |
| Lossless | 2,2 MB | 25% kleiner | Perfect — bit-voor-bit identiek aan bron |
Bron: 1200×800-foto, 2,9 MB als PNG. Groottes zijn representatief; werkelijke waarden variëren per afbeeldingsinhoud.
De tabel illustreert een cruciaal punt: de relatie tussen kwaliteit en bestandsgrootte is niet lineair. Van Q50 naar Q75 gaan verdubbelt de bestandsgrootte ongeveer terwijl de kwaliteit dramatisch verbetert. Van Q90 naar Q100 gaan verdubbelt de bestandsgrootte opnieuw maar levert vrijwel geen zichtbare verbetering op. Dat is waarom Q75–85 de "sweet spot" is — het bevindt zich op het knikpunt van de kwaliteit-grootttecurve waar de meeropbrengst begint af te nemen.
Lossy vs. lossless: hoe kies je?
De keuze tussen lossy en lossless WebP hangt af van je afbeeldingsinhoud en gebruiksscenario:
Kies lossy wanneer:
- De afbeelding een foto is of complexe, continue toonvariatie heeft
- Bestandsgroottereductie belangrijk is (weblevering, bandbreedtebeperkingen)
- De afbeelding op normale formaten wordt bekeken, niet ingezoomd tot 200%+
- Een kleine hoeveelheid onmerkbaar dataverlies acceptabel is
Kies lossless wanneer:
- De afbeelding tekst, scherpe randen of geometrische vormen bevat (schermafbeeldingen, logo's, pictogrammen)
- Pixelzuivere nauwkeurigheid vereist is (wetenschappelijke beeldvorming, pixel-art, technische diagrammen)
- De afbeelding verder bewerkt of verwerkt wordt (lossless voorkomt cumulatieve degradatie)
- Je een kleiner alternatief voor PNG wilt zonder kwaliteitsverlies
- De afbeelding weinig unieke kleuren heeft (lossless WebP met paletcodering is zeer efficiënt)
Eenvoudige regel: Als de afbeelding van een camera komt, gebruik dan lossy (Q75–85). Als die van een computer komt (schermafbeelding, ontwerptool, code-editor), gebruik dan lossless. Deze vuistregel is correct voor de overgrote meerderheid van gevallen.
Probeer converteren met verschillende instellingen
De beste manier om kwaliteitsinstellingen te begrijpen is experimenteren met je eigen afbeeldingen. Upload een WebP-bestand naar CleverUtils.com en bekijk het resultaat — onze converter gebruikt hoogwaardige instellingen die zijn ontworpen om maximale details te bewaren terwijl je een universeel compatibel JPG-bestand krijgt.
Wanneer de bron-WebP lossy-compressie gebruikt (wat het geval is voor de meeste afbeeldingen opgeslagen van websites), introduceert het converteren naar JPG minimaal extra kwaliteitsverlies omdat beide formaten vergelijkbare perceptuele compressiestrategieën gebruiken. Wanneer de bron een lossless WebP is, is de JPG-uitvoer een uitstekende hoogwaardige lossy-versie.