Prijeđi na sadržaj

Optimizacija slika za web: koliko bi fotografija u web trgovini trebala težiti? Provjerili smo JPG i WebP

Narančasta keramička šalica sa sjajnom glazurom i sitnim tamnim točkicama, na pozadini krem boje

Upišite u tražilicu „optimizacija slika za web” i dobit ćete posve različite odgovore na pitanje koliko bi slika trebala težiti. Većina vodiča napisana je za blogere ili programere, a ne za nekoga tko vodi trgovinu sa stotinama fotografija proizvoda.

U nastavku ćete pronaći konkretan broj, objašnjenje odakle dolazi i način da do njega dođete, a da fotografije ne izgube na izgledu. Sve se svodi na dva koraka: smanjiti dimenzije fotografije i spremiti je u formatu WebP. WebP je razvio Google; noviji je od JPG-a i uz sličnu kvalitetu obično daje lakše datoteke. Provjerili smo to na jednoj fotografiji i pokazujemo rezultat. Ne obećavamo da će promjena formata udvostručiti prodaju, jer to nitko ne može pošteno obećati.

Kratak odgovor: oko 130 KB po fotografiji proizvoda

Za fotografiju koju kupac gleda na stranici proizvoda razuman je cilj oko 130 KB. Sličica na popisu proizvoda može težiti do petnaestak kilobajta.

To nije norma Googlea ni bilo koje organizacije. Takva norma jednostavno ne postoji. To je praktičan kompromis: ispod određenog praga fotografija gubi detalje koje kupac želi vidjeti, poput teksture tkanine, godova drva ili sjaja glazure. Iznad tog praga vremenom učitavanja plaćate detalje koje na zaslonu mobitela ionako nitko neće primijetiti.

Prije nego što počnete, provjerite odakle krećete. Ako fotografije proizvoda danas teže po nekoliko megabajta, dobitak će biti velik. Ako teže po 200 KB, bit će malen.

Zašto je težina fotografija važna

Slike su najveći dio tipične naslovnice. Prema izvješću HTTP Archive Web Almanac 2025 medijan težine naslovnice otvorene na mobitelu iznosi 2,56 MB, a medijan ukupne težine slika na takvoj stranici oko 911 KB. To je otprilike trećina stranice i više nego sav JavaScript kod.

Drugi je razlog za trgovinu važniji. Google mjeri koliko se brzo pojavi najveći element vidljiv na zaslonu. Taj se pokazatelj zove LCP. Na 76% stranica otvorenih na mobitelu taj je najveći element upravo slika, a u trgovini je to obično fotografija proizvoda ili baner.

Google očekuje da se taj element pojavi unutar 2,5 sekunde. Ne u jednom testu, nego u najmanje tri četvrtine stvarnih posjeta. Rezultat iznad 4 sekunde smatra lošim.

Hoće li brža stranica poboljšati vašu poziciju na Googleu?

Može malo pomoći, ali manje nego što sugeriraju mnogi vodiči. Google piše da se njegovi sustavi rangiranja služe pokazateljima brzine. No odmah dodaje da dobri rezultati ne jamče visoku poziciju, a stranica s relevantnim sadržajem i dalje pobjeđuje bržu, ali manje relevantnu.

Brzina je najvažnija kad nekoliko stranica ima podjednako dobar sadržaj. Sam format datoteke nije čimbenik rangiranja. Google ne nagrađuje sliku zato što je u formatu WebP. Neizravno nagrađuje stranicu koja se brže učitava.

Budite oprezni i s brojkama koje kruže internetom. Popularna tvrdnja da sekunda kašnjenja znači 7% manje konverzija potječe iz ankete koju je tvrtka Aberdeen Group 2008. provela među više od 160 tvrtki, a ne iz mjerenja ponašanja kupaca. Ne temeljite odluke na njoj.

Dimenzije dolaze prije formata

Ovdje se događa najčešća pogreška. Prelazak na WebP drugi je korak, a ne prvi.

Fotografija s mobitela rezolucije 12 MP ima 4000 × 3000 piksela. Google Merchant Center, preko kojeg trgovine šalju proizvode na Google Shopping, preporučuje fotografije proizvoda dimenzija oko 1500 × 1500 piksela. To je razumno polazište i za vašu trgovinu.

Ako trgovina pošalje datoteku veću od prostora koji fotografija zauzima na zaslonu, preglednik će je ionako smanjiti, ali je najprije mora cijelu preuzeti.

Provjerili smo to na jednoj fotografiji

Uzeli smo fotografiju proizvoda — keramičke šalice na glatkoj pozadini — i spremili je na četiri načina. Odabrali smo je namjerno: zasićena narančasta boja i glatki prijelaz boja u pozadini mjesta su na kojima sažimanje lako ostavlja tragove. Što se same težine datoteke tiče, to je pak jednostavniji slučaj od fotografije iz fotoaparata.

VerzijaDimenzijeTežina
Original u JPG-u2880 × 2880 px1826 KB
Samo smanjena, i dalje JPG1500 × 1500 px550 KB
Samo WebP, izvorne dimenzije2880 × 2880 px128 KB
Smanjena i spremljena kao WebP1500 × 1500 px122 KB

Samo smanjivanje dimenzija snizilo je težinu datoteke za 70%. Spremanje u formatu WebP s ciljanom težinom od 130 KB zatim je datoteku olakšalo još više od četiri puta. Ukupno je fotografija petnaest puta lakša od originala.

To drugo smanjenje ipak nije zasluga samog formata. Smanjeni JPG i dalje je imao kvalitetu 95, a dodatak je WebP sažeo jače kako bi stao u 130 KB. Koliko donosi sam format, pišemo u nastavku.

Najviše govori usporedba posljednjih dvaju redaka. Obje verzije teže gotovo jednako, ali nisu jednako dobre. Kvaliteta spremanja zadaje se na ljestvici do 100, a što je niža, to više sitnih detalja nestaje. Da bi fotografiju u izvornim dimenzijama smjestio u 130 KB, dodatak je morao spustiti kvalitetu na 55. Smanjena fotografija stala je u istih 130 KB uz kvalitetu 87 i, prema našem mjerenju, sažimanje ju je manje izobličilo. Upravo zato dimenzije idu prije formata.

Test smo proveli 13. rujna 2026. našim dodatkom ConverterSEO 1.31.1, postavljenim na ciljanu težinu od 130 KB, na poslužitelju s WordPressom 7.1 i grafičkom bibliotekom GD. Fotografija šalice nije snimljena fotoaparatom: generirali smo je posebno za ovaj test i spremili kao JPG u kvaliteti 95. Prave fotografije iz fotoaparata imaju više šuma i obično teže više, pa će kod vas brojke biti drukčije. Važan je smjer: prvo dimenzije, zatim format.

Pogoršava li WebP kvalitetu fotografija?

Donekle da. WebP kakav se koristi za fotografije sažima s gubicima, pa pri spremanju uvijek nešto odbaci. Izraz „bez gubitka kvalitete” pojavljuje se u vodičima, pa čak i kod samog Googlea, ali iza njega stoji usporedba u kojoj je kvalitetu obiju datoteka ocjenjivao algoritam. To ne znači da datoteka ništa nije izgubila. Sažimanje bez gubitaka rijetko se koristi za fotografije proizvoda, jer su datoteke tada višestruko veće.

Uz razumne postavke ta razlika ipak može biti vrlo mala. Evo istog dijela šalice iz našeg testa u obje verzije.

Isti isječak narančaste šalice uvećan na 200 %: lijevo JPG od 550 KB, desno WebP od 122 KB
Povećanje 200%. Lijevo JPG, 550 KB. Desno WebP, 122 KB. Obje imaju 1500 × 1500 px.

Usporedba piksel po piksel pokazuje da WebP od originala odstupa malo više nego JPG s lijeve strane. Na zaslonu, čak i uz povećanje, tu je razliku teško uočiti. Točkice u glazuri, odsjaj i rub šalice ostali su na svojem mjestu.

Oprez je potreban u dva slučaja:

  • Glatki prijelazi boja, na primjer pozadina studijske fotografije. Uz prejako sažimanje umjesto glatkog prijelaza mogu se pojaviti pruge.
  • Vrlo visoka kvaliteta. Tu WebP teško sustiže JPG, pa datoteka neće uvijek ispasti manja.

Prije nego što sve fotografije u trgovini prebacite u WebP, isprobajte to na nekoliko njih i pogledajte ih uz povećanje pored originala. Počnite s onima koje imaju glatku pozadinu i intenzivnu boju.

WebP ili JPG: koliko zapravo dobivate

Google je u svojoj studiji naveo da je WebP 25–34% manji od JPG-a kad algoritam kvalitetu obiju datoteka ocijeni jednakom. To je istina, ali uz ogradu koju vodiči obično ne spominju. Test je proveden oko 2011., a WebP je uspoređen s JPG-om spremljenim starim programom, koji uz istu kvalitetu stvara veće datoteke od novijih alata.

Novija analiza tvrtke Cloudinary iz 2023. daje potpuniji uvid. Uz niže postavke kvalitete WebP je 25–35% manji od JPG-a spremljenog bez optimizacije, a uz više postavke ta se prednost smanjuje. Od JPG-a spremljenog modernim programom koji i sam snažno smanjuje datoteke, na primjer mozjpegom, manji je tek za 3–5%.

Što to znači za vas? Ako učitavate fotografije ravno iz fotoaparata, dobitak će biti osjetan, ali velikim dijelom zahvaljujući manjim dimenzijama i jačem sažimanju, a ne samom formatu. Ako je netko nekad dobro sažeo vaše JPG datoteke, sama promjena formata donijet će malo, a više ćete dobiti na dimenzijama.

Postoji i noviji format AVIF. U istoj analizi Cloudinaryja pokazao se oko 10–15% manjim od WebP-a, ali uz zadane postavke njegovo je spremanje trajalo otprilike deset puta dulje. Kod trgovine s tisućama fotografija to je stvarna razlika.

Gdje možete poslati WebP, a gdje ne

Fotografija proizvoda ne završava samo u vašoj trgovini. Šaljete je i na Google Shopping, ponekad na Amazon ili druge prodajne platforme. WebP neće svugdje proći.

GdjePrihvaća li WebP
Vaša trgovina na WordPressuDa, od verzije 5.8, ako poslužitelj podržava WebP
Google Merchant CenterDa
AmazonVjerojatno ne: nije ga bilo na popisu dopuštenih formata (stanje iz 2024.)
Uvoz proizvoda u WooCommerce iz CSV datoteke ili iz drugog programaDa, od verzije 7.7

Odatle jednostavno pravilo: originale fotografija čuvajte u JPG-u ili PNG-u, a WebP koristite na stranicama svoje trgovine. Ne pretvarajte jedinu kopiju koju imate.

Podržavaju li preglednici vaših kupaca WebP?

Da. Prema stranici Can I Use, na temelju podataka iz kolovoza 2026., oko 97% preglednika koji se koriste u svijetu u potpunosti podržava WebP.

Safari podržava WebP od verzije 14, objavljene u rujnu 2020. zajedno s iOS-om 14. Na Mac računalima to ipak radi tek od sustava macOS 11 Big Sur. Rečenica „Safari ne podržava WebP”, koja se još pojavljuje u starijim vodičima, stoga je već godinama zastarjela. I Googleova tražilica službeno podržava slike u formatu WebP.

Što WordPress radi sam, a što ne

WordPress od verzije 5.8 iz srpnja 2021. omogućuje učitavanje WebP fotografija u medijsku knjižnicu, ako poslužitelj podržava taj format. No sam neće pretvoriti vaše JPG ni PNG datoteke. Godine 2022. pokušalo se u verziju 6.1 dodati automatsko stvaranje WebP datoteka iz učitanih JPG-ova, ali je ta promjena povučena prije izlaska verzije.

Može li vaš poslužitelj spremati WebP, provjerit ćete u administraciji WordPressa: Alati → Zdravlje web-stranice → Info → Rukovanje medijskim zapisima. Ondje pronađite retke „GD podržani formati datoteka” i „ImageMagick podržani formati datoteka”. Ako u jednom od njih vidite WEBP, sve je u redu.

Fotografije koje već imate u trgovini ostat će u starom formatu dok s njima nešto ne učinite. Postoje dva načina.

  • Pojedinačne fotografije besplatno ćete pretvoriti u WebP pretvaraču. Radi u vašem pregledniku, pa datoteke ne odlaze ni na kakav poslužitelj.
  • Sve fotografije odjednom obradit će dodatak ConverterSEO. Sažima ih na poslužitelju vaše trgovine, jednokratno: pri učitavanju fotografije ili kad sami pokrenete obradu fotografija koje su već u knjižnici. Nikad dok kupac pregledava stranicu.

Jedna važna napomena. Nakon sažimanja dodatak zamjenjuje datoteku u medijskoj knjižnici verzijom u formatu WebP, a original briše. Ako originale fotografija imate samo u WordPressu, prije početka napravite njihovu kopiju, na primjer tako da mapu wp-content/uploads preuzmete na računalo preko upravitelja datotekama na kontrolnoj ploči hostinga.

Kako provjeriti isplati li se

Pokrenite PageSpeed Insights za stranicu proizvoda i za stranicu kategorije. Ako alat ne navodi slike koje treba poboljšati, dobitak od WebP-a bit će malen.

Učinak procjenjujte prema podacima iz stvarnih posjeta, a ne prema jednom mjerenju, jer pojedinačni test jednom ispadne bolje, a drugi put lošije. Takve podatke PageSpeed Insights prikazuje u gornjem dijelu izvješća ako stranica ima dovoljno posjeta. Google provjerava učitava li se stranica brzo u najmanje tri četvrtine stvarnih posjeta.

I još jedna stvar koju je lako pokvariti. Odgođeno učitavanje (lazy loading) odgađa preuzimanje fotografije dok kupac ne dođe do nje pomicanjem stranice. Ne uključujte ga za glavnu fotografiju proizvoda. Google to izričito ne preporučuje, jer se tako najvažniji element stranice pojavljuje kasnije. Odgođeno učitavanje ima smisla za fotografije smještene niže na stranici.

Čime započeti u svojoj trgovini

  1. Provjerite koliko teže vaše fotografije proizvoda i koje su im dimenzije: u medijskoj knjižnici (Medij → Zbirka) kliknite fotografiju i pročitajte polja „Veličina zapisa” i „Dimenzije”.
  2. Smanjite ih na otprilike 1500 piksela, odnosno na veličinu koju Google Merchant Center preporučuje za fotografije proizvoda.
  3. Spremite ih u formatu WebP tako da teže oko 130 KB.
  4. Pogledajte nekoliko njih uz povećanje, osobito one s glatkom pozadinom.
  5. Originale u JPG-u sačuvajte za Amazon i druge prodajne platforme.
  6. Učinak procijenite prema stvarnim posjetima, a ne prema jednom testu.

Ako imate samo nekoliko fotografija, dovoljan je besplatan WebP pretvarač. Ako ih imate stotine, dodatak ConverterSEO obradit će ih sve odjednom, a sažimanje u WebP u njemu je besplatno i bez ograničenja. Želite li da te iste fotografije imaju i dobre nazive datoteka i opise, pogledajte članak o tome kako pripremiti slike za SEO.

KAKO POČETI

Tri koraka da ConverterSEO proradi u vašem WordPressu

Otvorite račun

Odaberite besplatan plan ili plaćeni — upravo to odlučuje na koliko jezika možete pisati opise slika.

Otvorite račun

Preuzmite i instalirajte dodatak

Uzmite besplatan dodatak i instalirajte ga u svoj WordPress.

Preuzmite dodatak

Povežite račun s dodatkom

Kopirajte ključ sa svog računa, zalijepite ga u postavke dodatka, i to je to. Provjeru trgovine možete pokrenuti odmah i izgraditi svoju bazu ključnih riječi.