Tartalomjegyzék
Az emberek vizuális lények, és ezt a tényt kutatások is alátámasztják. Három nap elteltével a szövegek megtartási aránya mindössze 10-20% között mozog, de a képek esetében a megtartási arány akár 65% is lehet. Az agy a vizuális információk 90%-át befogadja, és 60 000-szer gyorsabban dolgozza fel azokat. Kétségtelen, hogy a vizuális elemek kritikus szerepet játszanak a weboldal elkötelezettségében.
Ehhez azonban sokkal többre van szükség, mint néhány kép kiválasztása és elhelyezése a webhelyen. A nagyméretű képek sok sávszélességet fogyasztanak, ami lelassítja az oldal betöltési sebességét. A keresőmotorok észreveszik a lassú teljesítményt, és alacsony helyezéssel büntetik Önt.
Cikkünkben hat különböző módszert mutatunk be a képek optimalizálására a jobb webes teljesítmény érdekében 2021-ben.Képoptimalizálási tippek a jobb webes teljesítményért a
Tegyük fel, hogy Ön nonprofit szervezetek számára tervez weboldalakat, és szeret sok képet használni a munka bemutatására. Az adományozók, szponzorok és más érdekeltek az ilyen információkat használják a folyamatos támogatás alapjául. Ha azonban nem optimalizálja a képeket, a felhasználói élmény és az elkötelezettség szenvedni fog. A legnagyobb probléma az oldalak lassú betöltése és az időkieséses válaszok lesznek.
A képoptimalizálás a fájlok méretének, formátumának vagy felbontásának csökkentése érdekében tett lépésekre utal. Ezt a képek minőségének romlása nélkül teheti meg.
Nézzünk meg néhány lehetőséget.
Marketingkampány illusztráció Deemak Daksina által
1. Kezdje a képoptimalizálás auditálásával
Egy képoptimalizálási audit releváns információkkal szolgál arról, hogy hol kell javítania.
Kezdje a webhelyén található képek leltározásával. A megfelelő tesztek megállapítják, hogy milyen problémákkal kell foglalkoznia.Az audit például megmutathatja, hogy túl sok kép van. Megmutatja a képformázást is, és lehetővé teszi a következő lépések meghatározását. Például a fájlformátumok eltávolítása vagy megváltoztatása jelentősen javíthatja az oldal betöltési sebességét.
2. Válassza ki a megfelelő formátumot a képekhez
A képfájlok különböző formátumokban léteznek. Ez a három leggyakoribb képformátumtípus a webes alkalmazásokhoz, amelyet ismernie kell:
- A PNG előnye, hogy nagyon jó minőségű kép. Sajnos ennek eléréséhez a fájlméret nagyon nagy. Egyszerű képek és logók esetében jól működik, és veszteségmentes tömörítést tesz lehetővé.
- A JPEG-ek a legelterjedtebbek a legtöbb weboldalon. Kiválóan alkalmasak összetett, színes képekhez. A JPEG-képek tömörítésekor azonban óvatosnak kell lenni, mivel a kép tisztasága csökkenhet, minél kisebb lesz a kép. Egyesek ezt veszteségesnek nevezik.
- A GIF animációkhoz, kis ikonokhoz és alacsony felbontású képekhez használható, veszteségmentes tömörítést tesz lehetővé, de csak legfeljebb 256 színt használhat.
Save Icons by Andreas Storm
3. A képek méretének módosítása és tömörítése
Talán észrevetted, hogy a képek apránként töltődnek be. Eltelik egy kis idő, mire a teljes képet láthatod; ez annak a jele, hogy a képek valószínűleg túl nehezek. A méretváltoztatás vagy a tömörítés megoldja a problémát.
Kérjük, vegye figyelembe, hogy ne töltsön fel képeket az optimalizálás előtt, és a legjobb minőség érdekében törekedjen arra, hogy a fájlok mérete 1-2 MB között legyen.A képek átméretezéséhez használd a képkivágó eszközt. Segít csökkenteni a fájlméretet, ami jobb oldalbetöltési sebességet eredményez. Rengeteg eszköz áll rendelkezésedre.
A képek tömörítése segít csökkenteni a fájlméretet. De torzíthatja a képet, ha túlságosan tömöríti. Az alacsony tömörítés ideális lehet, ha meg akarja tartani a képminőséget; ez azonban nem csökkenti jelentősen a méretet.
A kompressziók típusai
Két fogalmat már említettünk fentebb, a veszteségmentes vs. veszteséges tömörítést.
- A veszteségmentes tömörítés megőrzi a képminőséget, miközben eltávolítja a felesleges metaadatokat.
- A veszteséges tömörítés csökkenti a fájl méretét azáltal, hogy megszabadul néhány elemtől. Ez a képminőség rovására mehet. Előfordulhat azonban, hogy nem veszi észre a különbséget. Így még mindig kiváló módja lehet a képek tömörítésének.
A megfelelő képszerkesztő segít meghatározni, hogy melyik tömörítés működik a legjobban az Ön számára.
4. Mobile-first képoptimalizálás
Bármilyen lépést is teszel, annak a mobile-first SEO stratégiát kell követnie, mióta a Google áttért a mobile first rangsorolásra. A képeknek ugyanúgy kell kinézniük bármely mobileszközön, mint bármely asztali eszközön. Az internetes forgalom óriási része ilyen eszközökön keresztül érkezik.
Ha a felhasználókat a mobileszközök használata során nem a jó UX köti le, akkor elveszíti őket.
Ha jól néz ki a kis képernyőn, akkor fantasztikusan fog kinézni asztali számítógépen vagy laptopon is.
ASO optimalizálás Abbi_Kerimov által
5. Fájlnevek és hatásuk a SEO-ra
A képoptimalizálás során arra is figyelni kell, hogy hogyan nevezzük el a fájlokat. Minden intézkedésünknek azt a célt kell szolgálnia, hogy javítsuk a keresőmotorokban való láthatóságot. Amikor feltöltünk vagy készítünk egy képet, a készülék automatikusan ad neki egy fájlnevet. Ez a név általában véletlenszerű kódokból vagy számokból áll. Ez nézhet ki például úgy, hogy 2224444.jpg.
Ha a képet úgy tölti fel a weboldalára, ahogy van, az egyáltalán nem segít a keresőmotoroknak.
Könnyítse meg a webkúszók számára az Ön megtalálását azáltal, hogy minden képhez leíró címkéket rendel. Használjon olyan releváns kulcsszavakat, amelyek információt adnak az Ön vállalkozásáról vagy webhelyéről.6. Fontolja meg a lusta betöltés használatát
A képek lusta betöltése pontosan olyan, mint ahogy a neve is sugallja. Ahelyett, hogy az egész kép egyszerre töltődne be, az egyfajta kibontakozásra kerül. A kép annál tovább töltődik, minél lejjebb görget az online látogató az oldalon.
A lusta betöltés csak azt mutatja meg, ami az adott pillanatban releváns. A végén sávszélességet takarít meg, mert nem használ felesleges erőforrásokat.
Lásd még: Hogyan csiszoljuk a szín jelentés erejét?
Loading... Dona
Lásd még: Bevezetés a tanfolyamba: A tanulás új útjaiVégső gondolatok
A webes teljesítmény egy kritikus rangsorolási tényező, amelyet a keresőmotorok használnak. A Google büntetni fogja az Ön webhelyét, ha az oldal betöltési sebessége alacsony.
Számos tényező határozza meg az oldal sebességét, és a képhasználat az egyik első helyet foglalja el. Ha nem optimalizálod a képeket, a webes teljesítményed szenvedni fog. Az oldalak lassan töltődnek be, és a felhasználói élmény és elkötelezettség nem lesz jó.
Válassza ki a megfelelő képformátumot. Ezután használjon olyan technikákat, mint az átméretezés és a tömörítés a fájlméret csökkentése érdekében. Tervezzen rendszeres oldalteszteket és webhelyauditokat a webhely teljesítményének ellenőrzésére.
