Waarom ik PNG naar WebP converteer (en die ene keer niet)

Op mijn bureaublad staat een map die to-shrink heet. Jarenlang was dat de plek waar schermafbeeldingen kwamen sterven — PNG’s van 2 MB van dashboards en half afgemaakte mock-ups die ik mailde naar mensen die absoluut geen 2 MB van mijn scherm nodig hadden. Op een middag opende ik de map echt en maakte ik de rekensom: hij was groter dan de app die ik diezelfde week had uitgebracht. Dat is het stille probleem met PNG. Het is een prachtig formaat dat een verbijsterende hoeveelheid ruimte verspilt, en de meesten van ons merken het nooit, omdat bandbreedte goedkoop is en het bestand „gewoon opent”.

Dus laat me het betoog houden dat ik zelf veel eerder had willen horen. Gaat een PNG naar een website — ergens waar hij wordt bekeken in plaats van bewerkt — dan hoort het vrijwel zeker een WebP te zijn.

Waar PNG echt goed in is

PNG is verliesvrij. Elke pixel die je erin stopt, komt er exact zo weer uit, elke keer. Dat is een echte deugd — voor een masterbestand. Daarom exporteert je ontwerptool PNG, daarom zijn schermafbeeldingen PNG, daarom grijp je ernaar bij alles met scherpe randen en transparantie. Verliesvrij betekent dat je het honderd keer kunt openen, aanpassen en herbewaren zonder dat er iets achteruitgaat.

De keerzijde is dat „elke pixel perfect bewaren” een belofte is die je in bytes betaalt. Bewaar een foto als PNG en hij legt trouw de verlopen, sensorruis en subtiele kleurverschuivingen vast die je oog nooit zou missen als ze slechts benaderd waren. Je betaalt de volle prijs voor detail dat niemand ziet.

Wat WebP kan wat PNG niet kan

WebP was Googles antwoord op een simpele vraag: wat als we gewoon een beter formaat maken? Het doet twee dingen die PNG niet kan. Het kan met verlies comprimeren wanneer je dat wilt — het onmerkbare weggooien zoals JPEG doet, maar dan slimmer — en het houdt daarbij een volledig alfakanaal. Dat tweede deel is het stille wonder. Jarenlang was de ruil „transparantie of een klein bestand, kies er één”. WebP is allebei tegelijk.

In de praktijk landt het converteren van een fotografische of schermafbeelding-zware PNG op een verstandige kwaliteit ergens tussen de 60% en 90% kleiner. Niet 10%. Een schermafbeelding van 1,8 MB wordt ongeveer 250 KB, en naast elkaar gelegd zie je niet welke welke is. Ik heb die test vaker op mezelf gedaan dan ik durf toe te geven, telkens overtuigd dat ik de WebP zou betrappen. Het lukt me nooit.

De vergelijking die mij overtuigde

Ruwe cijfers uit een partij die ik vorige maand converteerde:

Kijk naar het logo. Het bewoog nauwelijks — en dat voetnootje is precies wat telt.

Wanneer ik de moeite niet neem

Simpele graphics — platte kleuren, een handjevol ervan, harde randen — zijn precies waar PNG voor gebouwd is om te comprimeren, en het doet dat zo goed als wat dan ook. Een tweekleurig icoon, een lijntekening, een QR-code: laat ze in PNG, of nog beter, lever ze als SVG als je de vector hebt. WebP schaadt die bestanden niet, maar helpt ze ook niet noemenswaardig, en je hebt voor niets een stap toegevoegd.

De andere keer dat ik niet converteer is de master. Ik raak de enige kopie van iets nooit aan. De verliesmodus van WebP is een deur in één richting: het detail dat je weggooit, krijg je niet terug. Dus hier is de ene regel die ik nooit breek — converteer de kopie die je publiceert, bewaar het origineel waar je bewerkt. Op mijn machine zijn dat letterlijk twee bestanden: de PNG blijft in de projectmap, de WebP gaat naar de site. Goedkope verzekering, en ik heb er nog geen enkele keer spijt van gehad.

„Maar werkt het echt overal?”

Dit was vroeger het echte bezwaar, en het is het gewoon niet meer. Elke browser die mensen daadwerkelijk gebruiken ondersteunt WebP sinds ongeveer 2020 — Chrome, Safari, Firefox, Edge, allemaal. E-mailclients zijn nog wisselvallig en sommige oude bedrijfssoftware doet er raar over, dus voor een nieuwsbrief grijp ik nog steeds naar JPEG. Maar voor het open web? WebP zonder terugval uitleveren stopte jaren geleden al met een gewaagde keuze te zijn.

Hoe ik het echt zou doen

De eerlijke reden dat ik de PNG-naar-WebP-converter op deze site heb gebouwd, is dat ik het zat werd om schermafbeeldingen naar willekeurige webtools te slepen om ze te verkleinen, nooit helemaal zeker waar mijn bestanden daarna belandden. Dus de versie die ik zou aanraden is de saaie, private: converteer op je eigen machine, in de browser, waar het bestand je apparaat nooit verlaat. Sleep de PNG’s erin, kijk hoe de groottekolom daalt, download de WebP.

Maar de tool is bijzaak. Het gaat om de gewoonte. Zodra „PNG om te bewerken, WebP om uit te leveren” automatisch wordt, stop je met mensen schermafbeeldingen van 2 MB te sturen, worden je pagina’s gratis sneller, en blijft die to-shrink-map op je bureaublad eindelijk leeg. De mijne is dat — al zo’n jaar. Kleine overwinning, ik neem hem.