Te mennyit várnál arra, hogy betöltődjön egy weboldal? 3 másodperc? 5 másodperc? Tudtad, hogy egy honlap betöltési sebessége nagyban függ a rajta lévő képek méretétől? Az Online Markering Percek mostani epizódjában a weblapunkon található képek optimalizálása lesz a téma, mégpedig SEO szempontból.
Arról már hallhattunk, vagy tapasztalhattuk, hogy ha egy honlapon sok, nagy méretű kép helyezkedik el, az lassulást eredményez a betöltési sebességben. Keresőoptimalizálás szempontjából viszont nem szabad megelégednünk csupán a képek méretének és felbontásának helyes beállításával! Több szempontot kell figyelembe vennünk, melyek jelentőségteljesek annyira, hogy ezt a témát teljes egészében ezeknek szenteljem.
Mielőtt belevágunk, hadd világítsak rá arra, mi a fókusz, amit mindig tarts szem előtt:
Minden kép, ami a weboldaladon található úgy legyen összeválogatva, hogy az szorosan kapcsolódjon a témához! Mert hiába jó a mérete, szépek a színei és klassz a tartalma, ha semmitmondó az olvasónak.
Tehát ebbe a cikkbe sem tehetek be akármit…mondjuk egy ilyet 😀
De kezdjük is az elején. Szükségünk lenne egy képre…
Képek letöltése az internetről és az egyedi grafikák
Számos lehetőség áll rendelkezésedre. Választhatsz ingyenesen felhasználhatókat (például Pixabay) de vannak fizetősek is, mint például a Shutterstock.
Grafikával. Készíthetsz/készíttethetsz te magad is úgymond nulláról, és akkor nem kell letölteni, de nagyon jó megoldás az is, ha egy letöltött képet kombinálsz személyes szöveggel, szlogennel vagy a logóddal. Én Photoshopot használok de úgy gondolom, ennél egyszerűbb, ingyenes eszközök is rendelkezésre állnak (tekintve hogy manapság egy egyszerű Insta poszt készítése esetén is igen sok a lehetőség).
A szerzői jogokra. Akinek weboldala van, általában kereskedelmi célra használja fel a letöltött képeket, melyet ha tilt a licensz szerződés, büntetést vonhat maga után.
Minden képlelőhelynek van egy licensz szerződése, melyben megtalálhatóak ezek az információk.
Megvan a képünk, lássunk munkához
Szükséges idő: 15 perc.
Képek optimalizálása lépésről lépésre
- Képméret ellenőrzése
Mielőtt feltöltjük a képet weboldalunkra, ellenőrizzük annak méretét. Ezt megtehetjük úgy, hogy rákattintunk a képre jobb egérgombbal, és a tulajdonságok opciót választjuk. Az általános fülön a „Méret”-et tudjuk megnézni, mely esetben javasolt 100-200 KB alatt maradni. Ettől persze eltérhetünk egy borítókép esetében például.
- Szélesség, magasság és felbontás
Szintén a tulajdonságok között a „Részletek” fülön láthatjuk a kép szélességét és magasságát, valamint a felbontást. Előbbi legyen akkora, amekkorára szükségünk van (pl. egy blog bejegyzésben nem kell asztali háttérkép méret), a felbontás tekintetében pedig elegendő lehet a 72 dpi.
- Ha túl nagy a képméret, a szélesség, magasság vagy felbontás, kicsinyíts
Erre használhatsz egyszerűbb programokat. Maga a Windows alapértelmezett „Fényképek” alkalmazása is már elég sok mindent tud. Teljes körű megoldást általában grafikai programok tudnak nyújtani, például a Photoshop.
- Menj biztosra, és „butíts” kicsit a képen
Amikor már nem lehet csökkenteni a fentieken, de még mindig túl nagy a kép, kicsit lebutíthatod bizonyos alkalmazásokkal. Nekem az Website planet tool-ja jött be leginkább.
- Ha elég kicsi a kép, töltsd fel a weboldaladra
Állítsd be a tökéletes helyre, rendezd igényed szerint.
- Amire nagyon figyelj: az „Alt text”, más néven „Alternatív szöveg”
Ahogy arról már az On-site SEO feladatokat összefoglaló bejegyzésemben írtam, a Google nem látja a képeidet, nem tudja értelmezni, mi van rajtuk, ezért muszáj neki megmondanod. Erre való az Alternatív szöveg. Fontos, hogy pontosan leírd, mi van a képen, és ezt ő értékelni fogja. Mindemellett ne feledkezz meg arról, hogy ellenőrizd a kép címét és leírását is, az is világosan érthető legyen.
A képek optimalizálása kapcsán tehát ezekre figyelj
- A felhasznált kép, illusztráció, grafika legyen jogtiszta.
- Tökéletesen harmonizáljon a szövegkörnyezethez, tehát a témához, amiről adott oldalon írsz.
- Legyen megfelelő mérete, hogy ne lassítsa be a weboldaladat.
- Legyen kitöltve az alternatív szöveg mező.
Remélem találtál a fentiekben hasznos információkat!
Ha tetszett, kövesd az Ananász design Facebook oldalamat, hogy értesülhess legújabb bejegyzéseimről.
