WebP-kwaliteit instellen
- cwebp (Google):
cwebp -q 80 input.jpg -o output.webpvoor lossy,cwebp -lossless input.png -o output.webpvoor lossless. De standaard is kwaliteit 75. - Photoshop 23.2+: File → Save a Copy, kies WebP en daarna Lossy met een kwaliteitsschuif, of Lossless.
- GIMP: Bestand → Exporteren als met een .webp-naam; stel de kwaliteit in of vink Lossless aan.
- CleverUtils: alleen lossy; standaard kwaliteit 90, met 60, 80, 92 en 100 op de JPG-naar-WebP-pagina.
Twee compressiemodi
WebP is uniek onder de 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. Elk blok pixels wordt voorspeld op basis van naburige blokken, waarna alleen het verschil (residu) wordt gecodeerd. 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 drastisch kleinere bestanden. Bij kwaliteit 80 is een lossy WebP vaak meer dan 90% kleiner dan de ongecomprimeerde pixels, zonder zichtbaar verschil op normale weergavegrootte (zie de tabel hieronder).
Lossless-modus
WebP lossless-compressie gebruikt een volledig ander algoritme, gebaseerd op ruimtelijke predictie, kleurtransformaties, LZ77-terugverwijzingen en geoptimaliseerde Huffman-codering. Elke pixel van de originele afbeelding blijft exact bewaard — het decomprimeren van een lossless WebP levert een afbeelding op die bit voor bit identiek is aan 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. In lossless-modus bepaalt de -q-waarde van cwebp (0–100) de compressie-inspanning, niet de kwaliteit, en is -z (0–9) een preset voor dezelfde afweging. Elke instelling decodeert naar identieke pixels; meer inspanning maakt het bestand alleen kleiner en het coderen trager.
Belangrijk onderscheid: In lossy-modus bepaalt de kwaliteitsparameter (0–100) de uitvoerkwaliteit. In lossless-modus bepalen -q en -m (method, 0–6) de coderingsinspanning. 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 kleurovergangen en een "plastic" uiterlijk van 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 op normale kijkafstand en schermgrootte niet waarneembaar. Fijne texturen blijven goed bewaard, kleurovergangen zijn vloeiend en de besparing ten opzichte van kwaliteit 100 is aanzienlijk (doorgaans 60–70% kleiner).
Kwaliteit 75 is de standaard van Google voor de cwebp-encoder en de meest gebruikte instelling voor weblevering. Kwaliteit 80 is de op één na populairste keuze en behoudt iets meer detail voor een bescheiden groter bestand.
Toepassing: Algemene webafbeeldingen, productfoto's voor e-commerce, blogafbeeldingen, socialemedia-inhoud, nieuwsfotografie. Dit is het juiste bereik voor de overgrote meerderheid van webtoepassingen.
Kwaliteit 85–90: hoge kwaliteit
Bij deze instellingen behoudt WebP vrijwel alle zichtbare details. Zelfs een zorgvuldige vergelijking op pixelniveau met het origineel laat minimale verschillen zien. Het bestand is groter dan bij Q75–80, maar nog steeds aanzienlijk kleiner dan lossless of ongecomprimeerd.
De standaardinstellingen van CleverUtils liggen aan de bovenkant van dit bereik: WebP-uitvoer wordt opgeslagen met kwaliteit 90 (92 op de JPG-naar-WebP-pagina, die ook 60, 80 en 100 aanbiedt), altijd in lossy-modus. Dit is ook het aanbevolen bereik voor fotoportfolio's, hoogwaardige e-commerce (waarbij productdetail belangrijk is voor aankoopbeslissingen) en elke context waarin beeldkwaliteit prioriteit heeft maar bandbreedte nog steeds telt.
Toepassing: Fotoportfolio's, hoogwaardige productafbeeldingen, medische referentieafbeeldingen (niet-diagnostisch), professionele presentaties en situaties waarin 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 — tijdens de predictie- en transformatiestappen gaat nog steeds wat data verloren — maar het verlies is wiskundig minimaal. In het voorbeeld hieronder is een bestand met kwaliteit 100 nog steeds ongeveer 63% kleiner dan lossless (820 KB vs 2,2 MB), dus kies alleen voor lossless als je exacte pixels nodig hebt.
Het praktische visuele verschil tussen Q100 lossy en echt lossless is voor het menselijk oog onzichtbaar. 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 nog verder worden bewerkt.
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 14 modi, meer dan de vier 16×16-intra-modi van de lossy-modus
- Kleurtransformatie — decorreleert RGB-kanalen om de entropie te verlagen
- Groen-aftrekken-transformatie — benut de hoge correlatie tussen groen en de andere kanalen in natuurlijke afbeeldingen
- Paletcodering — herkent 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 paletcodering en LZ77-terugverwijzingen bij deze afbeeldingstypen zeer effectief zijn.
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 slaat de JPG op met kwaliteit 92 en vult transparante gebieden met wit.
Gebruikt de bron-WebP lossy-compressie (wat bij de meeste van websites opgeslagen afbeeldingen het geval is), dan veroorzaakt converteren naar JPG minimaal extra kwaliteitsverlies, omdat beide formaten vergelijkbare perceptuele compressiestrategieën gebruiken. Is de bron een lossless WebP, dan is de JPG-uitvoer een uitstekende lossy-versie van hoge kwaliteit. Onze vergelijking van WebP en JPG laat zien wanneer welk formaat de betere keuze is.