Optimaliseer PNG-afbeeldingen door de bestandsgrootte te reduceren, met behoud van visuele scherpte.
Niet elke afbeelding hoeft privé behandeld te worden. Maar er zijn verrassend veel situaties waarin het uploaden van een afbeelding naar een onbekende server onverstandig is:
Screenshots met persoonlijke data — chats, e-mails, bankoverzichten, notificaties. Zelfs een geblurde screenshot kan bij hoge resolutie voldoende informatie bevatten. De enige veilige optie is: niet uploaden.
Zakelijke documenten — contracten, offertes, interne rapportages die als PNG zijn opgeslagen. Conformiteit met AVG en bedrijfsbeleid vereist vaak dat vertrouwelijke bestanden het netwerk niet verlaten.
Medische en juridische afbeeldingen — röntgenfoto's, scans, bewijsmateriaal. De gevolgen van een datalek bij deze categorie zijn dermate ernstig dat een browser-based oplossing de enige verantwoorde keuze is.
Prototype- en ontwerpwerk — nog niet gepubliceerde visuals, merkassets, klantpresentaties. Concurrentiegevoelig materiaal dat niet in andermans handen mag vallen.
De besparing varieert sterk per type afbeelding. Hieronder een realistisch overzicht op basis van veelvoorkomende PNG-gebruik:
Schermopnames (bijv. 1920×1080, tekst en UI-elementen): origineel vaak 1-3 MB, na lossy compressie 200-500 KB. Dat is een reductie van 70-85%.
Logo's en iconen met transparantie: origineel 50-200 KB, na lossless compressie 35-140 KB. De transparantie blijft perfect behouden.
Foto's opgeslagen als PNG (wat op zich al niet ideaal is): origineel 5-15 MB, na lossy compressie 1-4 MB. Bij dit type afbeelding is een WebP compressor vaak een slimmere keuze.
Digitale illustraties met grote effen kleurvlakken: origineel 500 KB-2 MB, na lossy compressie 100-400 KB. Dit type afbeelding comprimeert bijzonder goed omdat de compressor grote uniforme kleurzones efficiënt kan samenvatten.
PNG is een verliesloos formaat dat zijn waarde bewijst bij afbeeldingen met tekst, scherpe randen, transparantie en beperkte kleurvlakken. Maar het wordt vaak verkeerd gebruikt:
Foto's als PNG opslaan — een 4K-foto als PNG kost al snel 15 MB. Dezelfde foto als JPEG kost 2-3 MB met nauwelijks zichtbaar verschil. Compressie helpt, maar het fundament is verkeerd. Gebruik in plaats daarvan een JPG compressor.
Animaties — PNG ondersteunt geen animatie. APNG bestaat maar wordt slecht ondersteund. Voor bewegende content is WebM of GIF de betere keuze.
Webfoto's zonder transparantie — als je afbeelding geen transparante achtergrond nodig heeft en vooral fotografisch is, bespaar je meer met JPEG of WebP dan met PNG compressie.
Het is dus de moeite waard om vóór het comprimeren eerst te controleren of PNG wel het juiste formaat is. In veel gevallen bespaart het wisselen van formaat meer dan het comprimeren van het huidige bestand.
Bij traditionele online compressors stuur je een HTTP-verzoek met je afbeelding naar een server. Die server draait een tool als pngquant of optipng en geeft het resultaat terug. Jouw afbeelding staat tijdens dit proces op een machine die je niet controleert.
Pixes gebruikt een andere aanpak. De compressiealgoritmen — waaronder pngquant (lossy) en zopflipng (losslossless) — zijn gecompileerd naar WebAssembly. Dat betekent dat ze in jouw browser draaien, op jouw CPU, met jouw RAM. Er is geen server nodig voor het rekenwerk.
De voordelen gaan verder dan privacy. Doordat er geen upload- en downloadronde naar een server is, gaat het proces sneller bij kleine en middelgrote bestanden. Het enige nadeel: hele zware bestanden (50+ MB) kunnen op oudere apparaten langzaam zijn, omdat de browser minder krachtig is dan een dedicated server.
De keuze tussen lossy en lossless is niet puur technisch — het hangt af van wat er met het bestand gebeurt:
Kies lossless als de afbeelding nog bewerkt wordt (bijv. in Photoshop of Figma), als elke pixel telt (wetenschappelijke afbeeldingen, technische tekeningen), of als je het bestand later opnieuw wilt comprimeren. Elke lossy bewerking introduceert artefacten die zich opstapelen.
Kies lossy als de afbeelding een eindproduct is (webpublicatie, e-mailbijlage, presentatie), als bestandsgrootte de prioriteit heeft, en als het verschil op een scherm niet zichtbaar is. De meeste webafbeeldingen zijn prima geschikt voor lossy.
Twijfel je? Start met lossy op 80% kwaliteit en vergelijk het resultaat met het origineel. Zie je geen verschil, dan heb je de juiste instelling te pakken. Je kunt ook onze lossless image compressor proberen als je liever geen kwaliteitsverlies riskeert.
Eenmalig comprimeren lost een momenteel probleem op. Maar structureel kleinere afbeeldingen leveren pas echt waarde op als compressie deel wordt van je werkproces:
Ontwerpers — exporteer uit Figma of Sketch met de hoogste kwaliteit en comprimeer daarna. Zo behoud je de optie om later te herexporteren zonder kwaliteitsverlies, maar lever je aan developers altijd geoptimaliseerde bestanden aan.
Content creators — comprimeer elke afbeelding vóór publicatie. Een CMS laadt sneller, je SEO-scores verbeteren, en je hostingverbruik daalt. Bij 50 afbeeldingen per maand scheelt dat al snel honderden MB's.
Developers — voeg PNG-compressie toe aan je build pipeline. Tools als sharp voor Node.js of imagemin automatiseren dit, maar voor handmatige checks en one-off optimalisaties is een browser-tool sneller dan een lokaal script opzetten.