A képek az oldalak legnagyobb súlytöbbsége, gyakran 50-80% -át teszik ki az oldal teljes méretének. Az olyan képek optimalizálása, mint a WebP formátum használata és a lazy loading alkalmazása, drasztikusan csökkentheti a betöltési időt.
WebP formátum
A WebP egy viszonylag új képformátum, amelyet a Google fejlesztett ki. A WebP képek általában 25-35% -kal kisebbek, mint a JPEG vagy PNG képek, ugyanakkor a képminőség szinte azonos. A WebP használata azonban nem minden böngészőben támogatott, ezért javasolt a JPEG vagy PNG verzió megtartása tartalék megoldásként.
Képméret optimalizálása
Az egyéni képméretek optimalizálása szintén fontos. Az olyan pluginek, mint az Imagify vagy az Shortpixel, automatikusan tömörítik és optimalizálják a feltöltött képeket. Ezek az eszközök eltávolítják az EXIF adatokat és a redundáns információkat, amelyek a képek méretét növelik.
Lazy loading
A lazy loading egy technika, amelynek segítségével a képek csak akkor töltődnek be, amikor a felhasználó azokhoz érkezik az oldal görgetésekor. Ez nagy mértékben csökkenti a kezdeti betöltési időt. A modern böngészők már támogatják a beépített lazy loading-ot:
<img src="image.jpg" loading="lazy" alt="Képleírás">
Képforrások megfelelő kiválasztása
Használja a <picture> elemet és az <srcset> attribútumot a különböző képernyőméretek számára:
- Telefonokon kisebb képeket jelenítsen meg
- Asztali számítógépeken nagyobb felbontású képeket jeleníthet meg
- Használjon responsive képeket az összes eszközözhöz
Az Image Optimization és a Lazy Loading kombinációja az egyik leghatékonyabb módja annak, hogy javítsa a WordPress oldal teljesítményét.