A weboldaladon található információk közül leginkább a vizuális anyagok, mint a képek és a design, amelyek felkeltik az olvasóid érdeklődését és képesek fenntartani is. Ha webshopot üzemeltetsz, akkor a képek azok, amelyek alapján az online vásárlás során a vásárló eldönti, megvegye-e a terméked vagy sem. 

A képek képesek személyesebbé tenni a weboldalad és közelebb hozni az olvasót a témához és értékekhez, amiket képviselsz. 

Amikor elérhetőbbé szeretnénk tenni weboldalunkat olvasóink és vásárlóink számára, akkor azonban nemcsak az számít, amit a kép ábrázol, hanem az is, ami mögötte van: a szöveges leírások és a kép mérete

 

Ez a cikk segíteni fog, ha

 

  • már van webáruházad, és a sebességtesztek szerint sok a nagyméretű kép,
  • nem tudod, hogy mivel lehetne tömegesen képeket átméretezni, optimalizálni,
  • még nincs webáruházad, de tervben van a beindítása.

 

Miért fontos a képek mérete?

 

A kép mérete minél kisebb, annál könnyebben tölthető be a weboldalad olvasóid számára. A weboldalad betöltési sebességét a saját gépeden nem tudod jól felmérni, ugyanis a böngésződ elmenti a weboldalad struktúráját és képeit, így az valójában nem is az internetről, hanem a gépedről töltődik be. 

Amikor valaki először nyitja meg az oldalad online, akkor mutatja a weboldal a valós betöltési sebességét – így ha nagyméretű képek lassítják az oldalad, a potenciális olvasóid fogják először észrevenni.

Ha nagyméretű képeid vannak a weboldalon, az számottevően lassítja a betöltési sebességet. A leendő vásárlóid nagy része azonban nem fog 2-3 másodpercnél többet várni az oldal betöltésére. 

Tehát hiába rendelkezik a weboldalad egységes, esztétikus dizájnnal, ha képeid nagy mérete miatt az olvasó nem jut el odáig, hogy lássa őket. 

 

Hogyan mérd le a képeidet? 

 

Ha tudni akarod, milyen gyors az oldalad, menj a Google Sebességmérő Eszközére, és teszteld le a honlapod. Az eszköz ki fogja írni, hogy mekkorák a képeid. Az ideális képméret 150 KB alatt van. Ha képeid meghaladják a szükséges mértéket, akkor lassítják a honlapodat. 

A kép optimális méretet a fájformátum is befolyásolja, így érdemes erre is vetni egy pillantást, ha átméreteznéd a képeid.

 

 

Kép fájltípusok

 

Két fő képfájl típusra fogunk fókuszálni, amiket általában a termékképek megjelenítésére a weben használunk: JPG és PNG. Röviden a két fájltípus erősségei és gyengeségei.

 

  • JPG (más néven JPEG) a legnépszerűbb kép fájltípus az interneten. JPG tökéletes formátuma a fényképeknek és a sok színt, árnyékot, színátmenetet, összetett mintákat tartalmazó képeknek. JPG elmenthető kiváló- és alacsony minőségben is. Képméretező programokban könnyen paraméterezhető, így megtalálhatjuk az arany középutat a minőség és a fájlméret között.

 

  • PNG az egyik legelterjedtebb formátum a JPG mellett. A PNG legfontosabb tulajdonsága, hogy kezelni tudja az átlátszóságot, így a termékképeink mögé könnyen tudunk más hátteret varázsolni. Előnye, hogy veszteségmentes és viszonylag jó tömörítési hatásfokkal dolgozik. Hátránya, hogy a jpg-hez képest sokkal nagyobbak a képméretek. 

 

Programok képátméretezéshez

 

Amennyiben a sebességmérő programod jelzi, hogy nagyméretű képeid lasstíják a weboldalad, az alábbi eszközök egyikével le tudod kicsinyíteni a képeket.

A fényképek szerkesztésében, köztük az átméretezésben az Adobe Photoshop vezeti a ranglistát. 

Nyissuk meg Photoshopban a képet, majd a Kép » Képméret menüre kattintva állíthatjuk be a kívánt képméretet. Egy webáruház képének nem szükséges 1500×1500 pixelnél nagyobbnak lennie. Általában az 1000-1200 pixeles szélességet, álló képek esetében pedig ugyanezt a magasság javasolt, hogy a kép minősége és a weboldal gyorsasága egyensúlyban legyen.

 

Ha offline megoldást keresel,

 

  • FileOptimizer és a FastStone Photo Resizer programok is alkalmasak képeid átméretezésére.

 

Ha online (felhőalapú) megoldást keresel

 

  • Mac / Apple számítógépekhez, akkor az Image Optim verhetetlen, egyszerre több képet is le tudsz méretezni anélkül, hogy meg kellene nyitnod őket. 

 

 

  • A Photoshop-hoz nagyon hasonló működése van a Photopea webalkalmazásnak is, amely ingyenes, és a leggyakrabban használt Photoshop funkciók megtalálhatók benne.

 

Reméljük, ez a cikk segített a képátméretezés rejtelmeinek felfedezésében.
Ha kérdésed va
n, keress minket bátran. 

 

Sikeres üzletet!

 

 

___

Források:

https://premiumhonlap.hu/honlapkeszites/kep-atmeretezese/

https://www.webaruhazkeszitesarak.hu/hir/webaruhaz-termek-kepeinek-optimalizalasa

https://zetra.hu/online-kepszerkeszto/