Weboldal képméret: hány KB legyen egy termékfotó? Kipróbáltuk a JPG-t és a WebP-t
Írd be a keresőbe, hogy „weboldal képméret”, és a kapott válaszok között ég és föld a különbség. A legtöbb útmutatót bloggereknek vagy programozóknak írták, nem annak, akinek a webshopjában több száz termékfotó van.
Alább találsz egy konkrét számot, azt, hogy honnan jön, és azt is, hogyan juthatsz le odáig anélkül, hogy elrontanád a fotók kinézetét. Két lépésről van szó: kisebbre veszed a kép pixelméretét, és WebP formátumban mented el. A WebP a JPG-nél újabb formátum, a Google fejlesztette ki, és hasonló minőség mellett általában könnyebb fájlt ad. Egy fotón kipróbáltuk, és megmutatjuk az eredményt. Azt nem ígérjük, hogy a formátumváltás megduplázza az eladásaidat, mert ezt becsületesen senki nem ígérheti meg.
Röviden: nagyjából 130 KB termékfotónként
A termékoldalon megjelenő fotónál ésszerű cél nagyjából 130 KB. A terméklistában látható bélyegkép legfeljebb tizenvalahány kilobájtot nyomhat.
Ez nem a Google vagy bármely más szervezet előírása. Ilyen előírás egyszerűen nincs. Ez gyakorlati kompromisszum: egy bizonyos határ alatt a fotó elveszíti azokat a részleteket, amelyeket a vevő látni akar, vagyis a szövet textúráját, a fa erezetét vagy a máz fényét. E határ fölött betöltési idővel fizetsz olyan részletekért, amelyeket egy telefon képernyőjén úgysem vesz észre senki.
Mielőtt nekiállsz, nézd meg, honnan indulsz. Ha a termékfotóid ma darabonként több megabájtot nyomnak, nagy lesz a megtakarítás. Ha 200 KB-osak, kicsi.
Miért számít, mennyit nyomnak a képek
Egy átlagos főoldal legnagyobb összetevői a képek. A HTTP Archive Web Almanac 2025 jelentése szerint a telefonon megnyitott főoldalak súlyának mediánja 2,56 MB, az ilyen oldalakon lévő képek együttes súlyáé pedig nagyjából 911 KB. Ez körülbelül az egész harmada, és több, mint az összes JavaScript-kód.
A második ok egy webshop számára fontosabb. A Google méri, milyen gyorsan jelenik meg a képernyőn látható legnagyobb elem. Ennek a mutatónak LCP a neve. A telefonon nézett oldalak 76%-ánál ez a legnagyobb elem éppen egy kép, egy webshopban pedig általában termékfotó vagy banner.
A Google azt várja, hogy ez az elem 2,5 másodpercen belül megjelenjen. Nem egyetlen tesztben, hanem a valódi látogatások legalább háromnegyedében. A 4 másodperc feletti eredményt gyengének tekinti.
Előrébb kerülsz a Google-ban, ha gyorsabb az oldalad?
Egy kicsit segíthet, de kevésbé, mint ahogy sok útmutató sugallja. A Google azt írja, hogy a rangsorolási rendszerei használják a sebességmutatókat. Rögtön hozzáteszi azonban, hogy a jó eredmények nem garantálnak előkelő helyezést, és a keresésre jobban illő tartalmú oldal továbbra is megelőzi a gyorsabb, de kevésbé odaillő oldalt.
A sebesség akkor számít a legtöbbet, amikor több oldal tartalma hasonlóan jó. Maga a fájlformátum nem rangsorolási tényező. A Google nem jutalmazza a képet azért, mert WebP formátumú. Közvetve azt az oldalt jutalmazza, amelyik gyorsabban betöltődik.
A neten keringő számokkal is bánj óvatosan. Az a népszerű állítás, hogy egy másodperc késés 7%-kal kevesebb konverziót jelent, az Aberdeen Group 2008-as kérdőíves felméréséből származik, amelyet több mint 160 cég körében készítettek, nem pedig a vásárlók viselkedésének méréséből. Ne erre alapozd a döntéseidet.
Kicsinyíts, mielőtt formátumot váltasz
Itt követik el a leggyakoribb hibát. A WebP-re váltás a második teendő, nem az első.
Egy 12 megapixeles telefonos fotó 4000 × 3000 pixeles. A Google Merchant Center, vagyis az a felület, amelyen keresztül a webshopok a termékeiket a Google Shoppingba küldik, nagyjából 1500 × 1500 pixeles termékfotókat ajánl. Ez a saját webshopodnak is ésszerű viszonyítási pont.
Ha a webshop nagyobb képet küld, mint amekkora helyet a fotó a képernyőn elfoglal, a böngésző úgyis lekicsinyíti, de előbb teljes egészében le kell töltenie.
Egy fotón kipróbáltuk
Fogtunk egy termékfotót — egy kerámiabögréről, sima háttér előtt —, és négyféleképpen mentettük el. Szándékosan ezt választottuk: a telített narancssárga szín és a háttér sima színátmenete olyan részek, ahol a tömörítés könnyen nyomot hagy. A puszta fájlméret szempontjából viszont egyszerűbb eset, mint egy fényképezőgéppel készült fotó.
| Változat | Méretek | Fájlméret |
|---|---|---|
| Eredeti JPG | 2880 × 2880 px | 1826 KB |
| Csak kicsinyítve, továbbra is JPG | 1500 × 1500 px | 550 KB |
| Csak WebP, teljes méretben | 2880 × 2880 px | 128 KB |
| Kicsinyítve és WebP-ként mentve | 1500 × 1500 px | 122 KB |
Önmagában a kicsinyítés 70%-kal csökkentette a fájlméretet. A WebP-be mentés 130 KB-os célmérettel ezután még a negyedénél is kisebbre faragta. Összességében a fotó tizenötször könnyebb az eredetinél.
Ez a második csökkenés azonban nem pusztán a formátum érdeme. A kicsinyített JPG még mindig 95-ös minőségű volt, a bővítmény pedig erősebben tömörítette a WebP-t, hogy beleférjen a 130 KB-ba. Hogy mennyit ad maga a formátum, azt lejjebb írjuk meg.
A legtöbbet az utolsó két sor összevetése mondja el. A két változat majdnem ugyanannyit nyom, mégsem egyformán jó. A mentési minőséget egy 100-ig terjedő skálán állítják be, és minél alacsonyabb, annál több apró részlet tűnik el. Ahhoz, hogy a teljes méretű fotó beleférjen 130 KB-ba, a bővítménynek 55-re kellett levinnie a minőséget. A kicsinyített fotó ugyanabba a 130 KB-ba 87-es minőséggel is belefért, és a mérésünk szerint a tömörítés kevésbé torzította. Pontosan ezért jön a pixelméret a formátum előtt.
A tesztet 2026. szeptember 13-án végeztük a saját bővítményünkkel, a ConverterSEO 1.31.1-es verziójával, 130 KB-os célméretre állítva, egy WordPress 7.1-et és GD grafikus könyvtárat használó szerveren. A bögréről készült kép nem fényképezőgépből származik: kifejezetten ehhez a teszthez generáltuk, és 95-ös minőségű JPG-ként mentettük el. A valódi, fényképezőgéppel készült fotók zajosabbak, és általában többet nyomnak, így nálad más számok jönnek ki. Ami számít, az az irány: előbb a pixelméret, aztán a formátum.
Rontja a WebP a fotók minőségét?
Egy kicsit igen. A fotókhoz használt WebP veszteséges formátum, vagyis mentéskor mindig elhagy valamit. A „minőségvesztés nélkül” kifejezés felbukkan az útmutatókban, sőt magánál a Google-nál is, de mögötte olyan összehasonlítás áll, amelyben a két fájl minőségét egy algoritmus értékelte. Ez nem jelenti azt, hogy a fájl semmit sem veszített. Termékfotókhoz ritkán használnak veszteségmentes tömörítést, mert a fájlok akkor sokszor nagyobbak lesznek.
Ésszerű beállításokkal viszont ez a különbség nagyon kicsi lehet. Íme a bögre ugyanazon részlete a tesztünkből, mindkét változatban.
A pixelenkénti összevetés azt mutatja, hogy a WebP egy hajszálnyival jobban eltér az eredetitől, mint a bal oldali JPG. A képernyőn azonban még nagyítva is nehéz rámutatni a különbségre. A pöttyök a mázon, a csillanás és a bögre pereme a helyén maradt.
Két esetben érdemes vigyázni:
- Sima színátmenetek, például egy stúdiófotó háttere. Túl erős tömörítésnél a folyamatos átmenet helyett sávok jelenhetnek meg.
- Nagyon magas minőség. Itt a WebP nehezen éri utol a JPG-t, így a fájl nem mindig lesz kisebb.
Mielőtt a webshopod összes fotóját WebP-re cserélnéd, próbáld ki néhányon, és nézd meg őket nagyítva az eredetik mellett. A sima hátterű, élénk színű képekkel kezdd.
WebP vagy JPG: mennyit nyersz valójában
A Google a saját vizsgálatában azt közölte, hogy a WebP 25–34%-kal kisebb a JPG-nél, amikor egy algoritmus a két fájl minőségét egyformának ítéli. Ez igaz, de egy fenntartással, amelyet az útmutatók általában nem említenek. A tesztet 2011 körül végezték, és a WebP-t egy régi programmal mentett JPG-vel vetették össze. Ez a régi program ugyanolyan minőség mellett nagyobb fájlokat készít, mint az újabb eszközök.
A Cloudinary újabb, 2023-as elemzése teljesebb képet ad. Alacsonyabb minőségi beállításoknál a WebP 25–35%-kal kisebb az optimalizálás nélkül mentett JPG-nél, magasabbaknál ez az előny csökken. Ha viszont a JPG-t modern program menti, amely maga is erősen csökkenti a fájlméretet (ilyen például a mozjpeg), a WebP már csak 3–5%-kal kisebb.
Mit jelent ez neked? Ha a fotókat egyenesen a fényképezőgépből töltöd fel, a megtakarítás jól látható lesz, de nagyrészt a kisebb pixelméretnek és az erősebb tömörítésnek köszönhetően, nem magának a formátumnak. Ha a JPG-fájljaidat valaki egyszer már alaposan tömörítette, a formátumváltás önmagában keveset hoz, a pixelméreten többet nyersz.
Van még egy újabb formátum, az AVIF. Ugyanabban a Cloudinary-elemzésben nagyjából 10–15%-kal kisebbnek bizonyult a WebP-nél, de alapbeállításokkal a mentése körülbelül tízszer tovább tartott. Egy több ezer fotót tartalmazó webshopnál ez valós különbség.
Hová töltheted fel WebP-ben, és hová nem
A termékfotó nem csak a saját webshopodba kerül. Feltöltöd az eMAG-ra vagy az Allegróra, beküldöd a Google Shoppingba, néha az Amazonra is. A WebP nem mindenhol megy át.
| Hová | Elfogadja a WebP-t? |
|---|---|
| A WordPress-alapú webshopod | Igen, az 5.8-as verziótól, ha a szerver támogatja a WebP-t |
| Google Merchant Center | Igen |
| eMAG Marketplace | Ha a termékeket API-n keresztül (az eladói fiókhoz kapcsolt programmal vagy bővítménnyel) töltöd fel, nem: a hivatalos dokumentáció szerint ott csak JPG, JPEG vagy PNG fájl lehet. |
| Allegro (allegro.hu) | Csak ha az ajánlatot API-n keresztül (az Allegro-fiókhoz kapcsolt programmal vagy bővítménnyel) vagy fájlimporttal teszed közzé. Az Allegro súgója a JPG, JPEG és PNG formátumot sorolja fel, a WebP-t pedig csak ennél a két módnál említi. |
| Amazon | Inkább nem: nem szerepelt az engedélyezett formátumok listáján (2024-es állapot) |
| Termékimport a WooCommerce-be CSV-fájlból vagy más programból | Igen, a 7.7-es verziótól |
Ebből egy egyszerű szabály következik: a fotók eredetijeit tartsd meg JPG-ben vagy PNG-ben, a WebP-t pedig a saját webshopod oldalán használd. Ne az egyetlen meglévő példányt konvertáld.
Megjelenítik a WebP-t a vevőid böngészői?
Igen. A Can I Use 2026. augusztusi adatai szerint a világon használt böngészők nagyjából 97%-a teljes mértékben támogatja a WebP-t.
A Safari a 2020 szeptemberében, az iOS 14-gyel együtt kiadott 14-es verziója óta támogatja a WebP-t. Mac számítógépeken azonban csak a macOS 11 Big Sur rendszertől működik. A régebbi útmutatókban még mindig keringő „a Safari nem támogatja a WebP-t” mondat tehát évek óta elavult. A Google keresője is hivatalosan támogatja a WebP-képeket.
Mire képes a WordPress, és mire nem
A WordPress a 2021 júliusában megjelent 5.8-as verzió óta engedi a WebP-képek feltöltését a médiatárba, ha a szerver támogatja ezt a formátumot. A JPG- és PNG-fájljaidat viszont magától nem konvertálja. A 6.1-es verzióba 2022-ben megpróbálták beépíteni, hogy a feltöltött JPG-fájlokból automatikusan WebP készüljön, de a változtatást a kiadás előtt visszavonták.
Hogy a szervered tud-e WebP-t menteni, a vezérlőpulton ellenőrizheted: Eszközök → Webhely Egészség → Információ → Média kezelés. Keresd meg ott a „GD támogatott fájlformátumok” és az „ImageMagick támogatott fájlformátumok” sort. Ha bármelyikben szerepel a WEBP, minden rendben van.
A webshopodban már meglévő fotók a régi formátumban maradnak, amíg nem teszel velük valamit. Két út van.
- Egy-egy fotót ingyen átalakíthatsz a WebP-konvertálóval. A böngésződben fut, így a fájlok semmilyen szerverre nem kerülnek fel.
- Az összes fotót egyszerre a ConverterSEO-bővítmény alakítja át. A webshopod szerverén tömöríti őket, egyszeri alkalommal: amikor feltöltöd a fotót, vagy amikor elindítod a médiatárban már meglévő képek átalakítását. Soha nem akkor, amikor egy vevő épp nézelődik.
Egy fontos figyelmeztetés. Tömörítés után a bővítmény a médiatárban lévő fájlt WebP-változatra cseréli, az eredetit pedig törli. Ha a fotók eredetijei csak a WordPressben vannak meg, mielőtt belevágsz, készíts róluk másolatot, például úgy, hogy a tárhelyed kezelőfelületén a fájlkezelővel letöltöd a számítógépedre a wp-content/uploads mappát.
Hogyan ellenőrizd, hogy megéri-e
Futtasd le a PageSpeed Insights mérést egy termékoldalon és egy kategóriaoldalon. Ha az eszköz nem jelez javítandó képeket, a WebP-re váltással keveset nyersz.
A hatást valódi látogatások adatai alapján ítéld meg, ne egyetlen mérés alapján, mert egy-egy teszt hol jobb, hol rosszabb eredményt ad. Ilyen adatokat a PageSpeed Insights a jelentés felső részén mutat, ha az oldalnak elég látogatója van. A Google azt nézi, hogy az oldal a valódi látogatások legalább háromnegyedében gyorsan betöltődik-e.
És egy dolog, amit könnyű elrontani. A késleltetett betöltés (lazy loading) addig halasztja a kép letöltését, amíg a vevő oda nem görget. A fő termékfotónál ne kapcsold be. A Google kifejezetten nem javasolja, mert így később jelenik meg az oldal legfontosabb eleme. A késleltetett betöltésnek a lejjebb lévő képeknél van értelme.
Így fogj hozzá a webshopodban
- Nézd meg, mennyit nyomnak a termékfotóid, és mekkora a pixelméretük: a médiatárban kattints egy fotóra, és olvasd le a „Fájlméret” és a „Méretek” mezőt.
- Kicsinyítsd őket nagyjából 1500 pixelre, vagyis arra a méretre, amelyet a Google Merchant Center a termékfotókhoz ajánl.
- Mentsd el őket WebP formátumban úgy, hogy nagyjából 130 KB-osak legyenek.
- Nézz meg néhányat nagyítva, főleg a sima hátterűeket.
- Az eredetiket tartsd meg JPG-ben az eMAG-hoz, az Allegróhoz és az Amazonhoz.
- A hatást valódi látogatások alapján ítéld meg, ne egyetlen teszt alapján.
Ha csak néhány fotód van, elég az ingyenes WebP-konvertáló. Ha több száz van belőlük, a ConverterSEO-bővítmény egy menetben elkészül mindegyikkel, a WebP-tömörítés pedig benne ingyenes és korlátlan. Ha azt szeretnéd, hogy ugyanezeknek a fotóknak jó fájlnevük és leírásuk is legyen, olvasd el a cikkünket arról, hogyan készítsd elő a képeket SEO-ra.