Afbeeldingscompressor

Referentie

Hoe werkt afbeeldingscompressie?

Deze tool gebruikt de ingebouwde Canvas API van de browser om afbeeldingen opnieuw te coderen met een lagere kwaliteitsinstelling. De afbeelding wordt getekend op een HTML Canvas-element en vervolgens geëxporteerd met canvas.toBlob() met het geselecteerde formaat en kwaliteitsniveau. Dit is verliesgevende compressie — redundante visuele data wordt weggegooid met algoritmen zoals Discrete Cosine Transform (DCT) voor JPEG en predictieve codering voor WebP. Het resultaat is een aanzienlijk kleiner bestand met minimaal waarneembaar kwaliteitsverlies.

JPEG vs WebP vs PNG — welk formaat kiezen

JPEG: Het beste voor foto's en afbeeldingen met complexe kleurovergangen. Ondersteunt kwaliteitsaanpassing van 1–100%. Geen transparantie-ondersteuning. Het meest compatibele formaat — werkt overal. WebP: Ontwikkeld door Google, WebP bereikt 25–35% kleinere bestandsgroottes dan JPEG bij gelijkwaardige visuele kwaliteit. Ondersteunt transparantie (alfakanaal) en animatie. Ondersteund door alle moderne browsers sinds 2020. Het aanbevolen formaat voor webgebruik. PNG: Verliesvrije compressie — geen kwaliteitsverlies bij welke instelling dan ook. Het beste voor screenshots, graphics met scherpe randen, tekstoverlays, logo's en afbeeldingen die transparantie vereisen. De kwaliteitsschuif heeft geen effect op PNG-uitvoer omdat het formaat inherent verliesvrij is.

Waarom afbeeldingen voor het web optimaliseren?

Afbeeldingen vormen ruwweg 50% van het totale paginagewicht op de gemiddelde website volgens het HTTP Archive. Niet-geoptimaliseerde afbeeldingen zijn de nummer één oorzaak van een trage Largest Contentful Paint (LCP) — een Core Web Vital die direct Google-zoekrankings beïnvloedt. Het comprimeren van een hero-afbeelding van 2 MB naar 200 KB kan de laadtijd met enkele seconden verkorten op mobiele verbindingen. Google raadt aan het totale paginagewicht onder 1,6 MB te houden voor goede mobiele prestaties — goede afbeeldingscompressie is vaak de grootste winst om dit doel te bereiken.

Toepassingen voor afbeeldingscompressie

Webprestaties — verklein afbeeldingsformaten om aan Core Web Vitals-drempels te voldoen en Lighthouse-scores te verbeteren. E-mailbijlagen — comprimeer afbeeldingen onder de typische 25 MB bijlagelimiet (Gmail, Outlook). Social media — optimaliseer afbeeldingen voor uploadlimieten: Twitter (5 MB), Instagram (30 MB), LinkedIn (10 MB). E-commerce — comprimeer productfoto's zonder zichtbaar kwaliteitsverlies om paginasnelheid en conversiepercentages te verbeteren. Documentatie — verklein screenshots voor README-bestanden, wiki's en Confluence-pagina's om repositories en pagina's lichtgewicht te houden.

De juiste kwaliteitsinstelling kiezen

Voor JPEG biedt een kwaliteit van 75–85% de beste balans tussen bestandsgrootte en visuele getrouwheid — gecontroleerde onderzoeken tonen aan dat de meeste gebruikers kwaliteit boven 85% niet kunnen onderscheiden. Onder 60% worden compressieartefacten (blokkerige gebieden, kleurbanding) waarneembaar, vooral in kleurovergangen en huidtinten. WebP op kwaliteit 80 komt doorgaans overeen met JPEG op kwaliteit 90 terwijl het 30% kleiner is. Voor PNG heeft de kwaliteitsschuif geen effect — PNG is altijd verliesvrij. Gebruik PNG alleen wanneer je pixelperfecte reproductie nodig hebt (screenshots met tekst, logo's, iconen) of alfatransparantie.

Privacy

Alle beeldverwerking draait 100% in je browser via de Canvas API. Er worden geen afbeeldingen naar een server geüpload — je bestanden verlaten nooit je apparaat.