WebP vs PNG voor productfoto's: formaten, bestandsgrootte en kanaaleisen

WebP of PNG, het korte antwoord: WebP geeft kleinere bestanden voor hetzelfde beeld, ondersteunt transparantie en werkt in alle actuele browsers. Voor productfoto's in je eigen webshop is WebP dus het betere formaat. PNG is lossless en wordt overal geaccepteerd, en is daarom beter voor masterbestanden, transparante vrijstaande foto's die je nog bewerkt en uploads naar kanalen die geen WebP nemen. Volgens Google is lossless WebP 26% kleiner dan PNG en lossy WebP 25 tot 34% kleiner dan vergelijkbare JPEG.

Bij productfoto's heeft de formaatvraag een tweede helft: wat elk verkoopkanaal accepteert. De afbeeldingengids van Amazon noemt WebP niet, Google Merchant Center neemt WebP maar geen AVIF, en Shopify raadt PNG of JPEG aan omdat het zelf per browser een geoptimaliseerd formaat serveert. Hieronder vind je de formaten vergeleken, de kanaalregels naast elkaar en een veilige manier om een hele catalogus te converteren.

PNG, JPEG, WebP en AVIF vergeleken op compressie en transparantie

De vier formaten die een catalogusteam het vaakst tegenkomt, verschillen op drie punten die voor productfoto's tellen: of compressie data weggooit, of het beeld een transparante achtergrond kan hebben en hoe breed het wordt ondersteund. De feiten hieronder komen uit de formatengids van MDN en de WebP-documentatie van Google.

Twee punten uit die tabel zorgen voor de meeste verwarring. WebP is niet alleen lossy: lossless WebP behoudt elke pixel, net als PNG, en is toch kleiner. En transparantie is niet voorbehouden aan PNG. Volgens Google is lossy WebP met transparantie doorgaans ongeveer drie keer kleiner dan hetzelfde beeld als PNG, handig voor vrijstaande productfoto's op een gekleurde paginaachtergrond.

Bestandsgrootte: hoeveel WebP bespaart ten opzichte van PNG en JPEG

Kleinere afbeeldingen laden sneller, en op een categoriepagina met 48 productthumbnails telt dat op. De gepubliceerde gemiddelden van Google:

• Lossless WebP tegenover PNG: ongeveer 26% kleiner.
• Lossy WebP tegenover JPEG: 25 tot 34% kleiner bij gelijke SSIM-kwaliteit.
• Transparantie in lossless WebP: voegt volgens Google maar ongeveer 22% aan bytes toe.

Dit zijn gemiddelden over testsets, geen belofte voor jouw catalogus. Een productfoto op een witte achtergrond comprimeert anders dan een sfeerfoto vol textuur, en een PNG van een simpele lijntekening is vaak al piepklein. Test met tien typische foto's uit je eigen catalogus voordat je er duizenden converteert, en vergelijk op het formaat waarop de foto echt wordt getoond, niet op 100% zoom.

AVIF gaat bij foto's meestal nog verder dan WebP, maar coderen is trager en de ondersteuning is jonger. MDN adviseert voor rasterbeelden WebP of AVIF, met JPEG als fallback voor foto's en PNG als fallback voor alles met transparantie, via het HTML-element picture.

Pixelafmetingen tellen vaak zwaarder dan het formaat. Een foto van 2048 x 2048 px die als categoriethumbnail van 300 px wordt getoond, verspilt veel meer bytes dan de overstap van JPEG naar WebP bespaart. Serveer per layout de maat die nodig is, met responsive images (srcset) in je eigen templates of de beeldmaten die je platform aanmaakt, en bewaar het grote origineel voor zoom en voor kanalen die 1.000 px of meer vragen.

Vrijstaande productfoto's: wanneer je PNG houdt en wanneer je afvlakt

Een vrijstaande foto (het product zonder achtergrond) is het flexibelste beeld in een catalogus. Het past op elke paginakleur, werkt in banners en kun je op wit zetten voor marktplaatsen. Bewaar de master als PNG of lossless WebP, zodat elke bewerking op volle kwaliteit begint, en maak kanaalkopieën vanuit die master.

Marktplaatsen willen die transparantie juist niet. Amazon eist voor de hoofdafbeelding een zuiver witte achtergrond met RGB-waarden 255, 255, 255, en bol vraagt voor de hoofdafbeelding een witte, neutrale achtergrond zonder zichtbare schaduwen. Vlak voor die kanalen de vrijstaande foto zelf af op zuiver wit, in plaats van het aan het kanaal over te laten welke kleur de lege pixels krijgen.

Een transparante PNG omzetten naar JPEG is de klassieke fout: JPEG heeft geen alfakanaal, dus het transparante deel krijgt een vulkleur die de converter kiest, vaak zwart. Stel altijd zelf de achtergrondkleur in als je vrijstaande foto's naar JPEG omzet.

Welke afbeeldingsformaten Shopify, Google Merchant Center, Amazon en bol accepteren

Elk kanaal publiceert eigen regels, en die zijn het niet met elkaar eens. Deze zijn in oktober 2026 gecontroleerd op de officiële helppagina's:

Een paar details van die pagina's zijn handig om te weten voordat je een feed bouwt:

• Shopify converteert zelf. De helppagina over productmedia zegt dat de afbeeldingsservice van Shopify detecteert welke formaten de browser van een klant ondersteunt en de foto in het beste beschikbare formaat toont. PNG eerst naar WebP omzetten voordat je uploadt, voegt een lossy stap toe zonder voordeel bij de levering. Upload dus goede PNG- of JPEG-bestanden.
• Merchant Center controleert de extensie. De image_link-specificatie waarschuwt dat een extensie die niet bij het formaat past, zoals een PNG opgeslagen als .jpg, een fout 'Unsupported image type' kan geven. Dezelfde pagina kondigt vanaf 31 januari 2027 een minimum van 500 x 500 pixels aan voor alle producten; onze gids over de fout image too small legt de oplossing uit.
• Marktplaatsen zijn de kanalen voor veilige formaten. Stuur JPEG naar Amazon, het formaat dat Amazon aanraadt. De pagina met afbeeldingsregels van bol noemt geen bestandsformaten; ons advies is daar JPEG binnen de genoemde pixel- en bestandsgrenzen, als voorzichtige keuze. Lees onze gids voor bol.com-listings voor de overige contentregels.

Formaatkeuze voor hoofdfoto's, galerijfoto's en maattabellen

Een productpagina bevat verschillende soorten beelden, en die hebben niet allemaal hetzelfde formaat nodig. Een praktische verdeling voor een gemiddelde catalogus:

• Hoofdfoto op wit: bewaar een JPEG- of PNG-origineel in hoge resolutie. Je webshop of CDN kan daaruit WebP of AVIF serveren, en hetzelfde bestand gaat zonder conversie naar Amazon, bol en Merchant Center.
• Galerijaanzichten en detailfoto's: net als de hoofdfoto. Juist op detailfoto's zoomen shoppers in, dus houd ze minimaal 1.000 px aan de langste zijde voor Amazon en 1200 x 1200 px voor zoom op bol.
• Vrijstaande foto's: masters als PNG of lossless WebP, afgevlakt op wit voor marktplaatsen en als WebP geserveerd op je eigen pagina's.
• Sfeer- en gebruiksfoto's: lossy formaten passen hier het best, omdat textuur compressie verbergt. Hier besparen WebP en AVIF de meeste bytes.
• Maattabellen, maattekeningen en specificatiegraphics: PNG of lossless WebP. Lossy compressie maakt dunne lijnen en kleine cijfers wazig, en dat telt als een shopper een maat afleest.
• Kleurstalen: piepkleine bestanden in elk formaat; de moeite zit in het laten kloppen van de kleur met de productfoto, niet in compressie.
• Geanimeerde beelden: WebP en GIF kunnen animeren, en Shopify accepteert van beide de geanimeerde versie. Amazon accepteert alleen niet-geanimeerde GIF en de afbeeldingsspecificatie van Merchant Center noemt animatie niet. Bewaar dus een stilstaand eerste frame als apart bestand voor feeds en marktplaatsen.

Telefoons voegen een zesde formaat toe: HEIC, de standaard op iPhones. Shopify accepteert HEIC-uploads, maar HEIC staat niet in de lijsten van Merchant Center en Amazon hierboven. Zet telefoonfoto's dus om naar JPEG voordat ze in een feed of op een marktplaats belanden.

Productfoto's in bulk converteren zonder kwaliteitsverlies

Eén foto converteren is een rechtermuisklik. 8.000 productfoto's met elk drie tot zes aanzichten converteren is een dataproject. Er zijn drie gangbare aanpakken, elk voor een ander soort team:

1. Commandoregeltools. Googles cwebp-encoder en ImageMagick (met het commando mogrify voor hele mappen) converteren duizenden bestanden in een paar minuten. Ze zijn gratis en precies, maar iemand moet ze scripten, originelen bewaren en de resultaten opnieuw uploaden.
2. Laat het platform het doen. De afbeeldingsservice van Shopify, image-CDN's en WordPress-plugins maken bij levering WebP- of AVIF-kopieën. Je opgeslagen bestanden blijven PNG of JPEG, zodat ze geldig blijven voor feeds en marktplaatsen.
3. Converteer in je productdatatool. Als foto's naast de productdata staan, maak je per formaat een kanaalkopie en koppel je die aan de juiste producten, in plaats van bestanden met de hand te hernoemen.

Welke tool je ook gebruikt, stel drie dingen zelf in in plaats van op standaardwaarden te vertrouwen: het kwaliteitsniveau (een gangbaar startpunt voor lossy WebP is rond 80; vergelijk daarna met het oog en stel bij), het kleurprofiel (sRGB is de veilige standaard voor web- en marktplaatsfoto's, en Amazon noemt RGB als voorkeursmodus) en de maximale afmetingen per kanaal, zodat je geen studiobestand van 6000 px naar Shopify stuurt, dat maximaal 5000 x 5000 px accepteert.

In WISEPIM zit die derde optie in de mediabibliotheek. Formaat wijzigen en converteren past de afmetingen aan en converteert naar PNG, JPEG of WebP met een kwaliteitsinstelling, voor één foto of voor een selectie via Bulkacties voor afbeeldingen. Optimaliseren voor platform past een preset toe met formaat, afmetingen en kwaliteit voor een doel zoals Shopify, Magento, WooCommerce of Lightspeed, en waarschuwt als een foto kleiner is dan het doel, omdat opschalen hem zacht maakt. Elk resultaat wordt opgeslagen als nieuwe versie die je ongedaan kunt maken. AVIF is geen uitvoerformaat, en er wordt niets omgezet tenzij je de actie zelf start, of hem zelf als afbeeldingsbewerking (Formaat converteren) in een automatisering inplant.

Vijf formaatfouten die productlistings kosten

• WebP sturen naar een kanaal dat het niet noemt. De afbeeldingengids van Amazon noemt JPEG, TIFF, PNG en niet-geanimeerde GIF. Houd een JPEG-kopie voor marktplaatsen, ook als je webshop WebP serveert.
• AVIF-URL's in een Merchant Center-feed zetten. AVIF kan op je productpagina's werken met een fallback, maar staat niet in de lijst voor image_link. Laat de feed dus naar een JPEG-, PNG- of WebP-kopie wijzen.
• Metadata strippen bij het converteren. Google vraagt verkopers de IPTC-tag DigitalSourceType niet te verwijderen uit AI-gegenereerde foto's. Batchtools hebben vaak een strip-optie die die tag ook wist.
• Opschalen om een minimum te halen. Amazon vraagt verkopers uitdrukkelijk kleine foto's niet kunstmatig te vergroten. Fotografeer opnieuw of zoek een groter origineel.
• Lossy bestanden steeds opnieuw coderen. Elke JPEG- of lossy WebP-opslag kost weer wat detail. Converteer altijd vanaf het origineel, nooit vanaf de laatste kopie.

Formaat is één onderdeel van beeldkwaliteit; alt-tekst is een ander, en onze gratis alt-tekstgenerator helpt daarbij. Voor laadsnelheid in bredere zin lees je ons artikel over technische SEO voor webshops en de woordenboekpagina over afbeeldingsoptimalisatie. Staan je productfoto's verspreid over mappen, leverancierslinks en drie platforms, dan houdt het digital asset management van WISEPIM ze gekoppeld aan de producten waar ze bij horen, zodat een geconverteerde kopie bij de juiste listing komt.