Hur du optimerar bilder för e-handelsproduktsidor | Bulk Image Compressor

Produktbilder säljer saker. Om en shoppare inte kan se detaljerna tydligt köper de inte. Men om dina bilder är för stora och dina sidor laddas långsamt lämnar de innan bilderna ens har laddats klart. Att få denna balans rätt är en av de mest praktiska saker du kan göra för en onlinebutik.

Den goda nyheten är att du inte behöver välja mellan kvalitet och hastighet. Med rätt komprimeringsinställningar och format kan dina produktfoton se skarpa ut på skärmen samtidigt som de laddas snabbt på vilken enhet som helst.

Varför produktbildstorlek spelar roll

En typisk produktsida har mellan 4 och 8 bilder: huvudfotot, några vinklar, kanske en detaljbild och en livsstilsbild som visar produkten i användning. Om var och en av dessa är en okomprimerad 4MB-fil från din fotograf är det 16 till 32MB bilder per sida.

Långsamma produktsidor skadar direkt försäljningen. Forskning från Deloitte fann att en förbättring på 0,1 sekund i mobil webbplatss hastighet ledde till en 8,4% ökning i konverteringar för detaljhandelswebbplatser. Den största faktorn i sidhastighet för e-handel är nästan alltid bilder.

Det finns också mobilfaktorn. De flesta onlineshopping sker på telefoner. Dina produktbilder måste laddas snabbt på mobilnätverk, inte bara snabb Wi-Fi.

Vita bakgrundsbilder vs livsstilsfoton

Dessa två typer av produktbilder har olika komprimeringsegenskaper.

Produktbilder med vit bakgrund är vad du ser på Amazon, eBay och de flesta produktlistningssidor. De har vanligtvis en ren vit bakgrund med produkten i mitten. Dessa bilder komprimeras mycket bra eftersom stora områden med solid vit färg kräver mycket lite data. Du kan ofta komprimera dessa vid 75 till 80% JPEG-kvalitet och se nästan ingen skillnad.

Livsstilsfoton visar produkter i verkliga miljöer. En kaffemugg på en köksbänk, en jacka på en modell utomhus, skor på en stadstrottoar. Dessa bilder har mer visuell komplexitet med varierade bakgrunder, texturer och belysning. De behöver något högre kvalitetsinställningar, runt 80 till 85%, för att bibehålla detaljer.

Båda typerna kan vara betydligt mindre än original. En 5MB produktbild med vit bakgrund komprimeras vanligtvis till 200 till 400KB. Ett 6MB livsstilsfoto komprimeras till 300 till 600KB.

Plattformskrav och rekommendationer

Olika e-handelsplattformar har sina egna bildriktlinjer. Här är specifikationerna för de största:

Shopify rekommenderar bilder vid 2048 x 2048 pixlar. Max filstorlek är 20MB, men de rekommenderar starkt att hålla bilder långt under det. Shopify gör viss automatisk komprimering och serverar WebP när webbläsaren stöder det, men att börja med optimerade bilder ger bättre resultat.

WooCommerce tillämpar inte strikta gränser eftersom det körs på din egen hosting. Det innebär att bildoptimering är helt ditt ansvar. Standardminatyrstorlekarna är 600 x 600 för katalogen och full bildstorlek för produktsidan. Du bör ändra storlek och komprimera före uppladdning.

Amazon kräver minst 1000 pixlar på den längsta sidan (för zoomfunktion) och rekommenderar 2000 pixlar. Max filstorlek är 10MB. Huvudbilden måste ha en ren vit bakgrund (RGB 255, 255, 255). Amazon komprimerar bilder i sin ände, men att ladda upp redan optimerade bilder ger dig mer kontroll över slutresultatet.

Etsy rekommenderar 2000 pixlar på den kortaste sidan. De accepterar filer upp till 1MB. Eftersom Etsys gräns är relativt liten behöver du nästan säkert komprimera före uppladdning.

Rekommenderade dimensioner och filstorlekar

För de flesta e-handelsplattformar, här är ett praktiskt mål:

BildtypDimensionerMål filstorlek
Huvudproduktfoto2000 x 2000px200 till 400KB
Alternativa vinklar2000 x 2000px200 till 400KB
Detalj-/zoombild2000 x 2000px250 till 500KB
Livsstilsfoto2000 x 1333px300 till 600KB
Miniatyr600 x 600px30 till 60KB

Dessa storlekar ger dig tillräcklig upplösning för zoomfunktioner samtidigt som sidorna hålls snabba. Din totala bildbelastning per produktsida bör helst hållas under 2MB.

Välja rätt format

JPEG är standarden för produktfotografering. Det hanterar fotografier bra och stöds överallt. Använd det som standard.

WebP erbjuder cirka 25 till 35% bättre komprimering än JPEG med samma visuella kvalitet. Om din plattform stöder det (Shopify gör det automatiskt, WooCommerce behöver ett plugin) är WebP en solid uppgradering. För en djupare jämförelse av format, läs vår JPEG vs PNG vs WebP-guide.

PNG behövs bara när dina produktbilder kräver genomskinlighet. Till exempel om du säljer föremål som måste visas utan någon bakgrund alls, bevarar PNG den genomskinligheten. Annars, undvik PNG för produktfoton eftersom filstorlekarna är mycket större.

Batch-bearbetning för produktkataloger

Om du har en butik med dussintals eller hundratals produkter är det inte realistiskt att komprimera bilder en och en. En produktkatalog med 200 artiklar och 5 bilder var innebär 1 000 bilder att bearbeta.

Det är här batch-komprimering sparar timmar. Med Bulk Image Compressor kan du släppa en hel mapp med produktbilder och komprimera dem alla samtidigt. Allt körs i din webbläsare, så dina produktfoton laddas aldrig upp till någon extern server. Det spelar roll när du arbetar med icke offentliggjorda produkter eller bilder du inte vill ska delas före lansering.

Här är ett arbetsflöde som fungerar bra för produktkataloger:

  1. Ändra storlek först. Få alla dina bilder till rätt dimensioner (2000 x 2000px för de flesta plattformar). Skicka inte 6000px-bilder genom komprimering när de bara kommer att visas i 2000px.

  2. Separera efter typ. Lägg bilder med vit bakgrund i en batch och livsstilsfoton i en annan. Detta låter dig använda olika kvalitetsinställningar för varje.

  3. Komprimera bilder med vit bakgrund vid 75 till 80% kvalitet. De rena bakgrunderna komprimeras effektivt vid lägre inställningar.

  4. Komprimera livsstilsfoton vid 80 till 85% kvalitet. Den extra detaljen i dessa bilder drar nytta av något högre kvalitet.

  5. Punktkolla några resultat. Öppna en handfull komprimerade bilder och jämför dem med originalen. Se till att text på förpackningar fortfarande är läsbar och produktdetaljer är tydliga. För mer om detta, se vår guide om att minska filstorlek utan att förlora kvalitet.

  6. Ladda upp till din plattform. Ersätt originalen med de komprimerade versionerna.

Effekten på din bottenlinje

Snabbare produktsidor innebär mer försäljning. Det är så direkt. När en shoppare klickar på din produkt från ett sökresultat eller en annons har du ungefär två till tre sekunder på dig innan de bestämmer sig för att vänta eller trycka på bakåtknappen.

Optimerade bilder minskar också dina hosting- och CDN-kostnader. Om du serverar 500 000 produktvisningar per månad och du minskar din genomsnittliga bildbelastning från 8MB till 1,5MB per sida, är det terabyte av bandbredd som sparas.

Dina produktfoton är den viktigaste tillgången i din onlinebutik. Att komprimera dem på rätt sätt låter dig behålla den visuella kvalitet dina shoppare behöver samtidigt som du ger dem den snabba upplevelse som faktiskt leder till köp.

Ready to compress your images?

Bulk compress JPEG, PNG, WebP, and AVIF images right in your browser. No uploads, no sign-ups.

Try Bulk Image Compressor