Képek helyes használata

A képek beillesztése keresőoptimalizálási szempontból helyes módon.

<img src="/images/products/casmio/snowwhite.jpg" width="200" height="200" 
alt="Casmio SnowWhite watch back picture" 
title="Casmio SnowWhite watches" class="product-pics" />

src – a kép forrása. Célszerű a képeket megfelelően struktúrálni. Esetünkben az images könyvtáron belül egy products könyvtárba rendeztük a termék képeket, azon belül a casio termékeket külön. Tehát elolvasva a kép helyzetét is kapunk információt, megsejthetjük, hogy ez a snowwite.jpg egy casio termék képe. Akadálymentességi szempontból is nagyon hasznos a megadás, a weboladalunk szerkesztése során is megkönnyítjük a dolgunk.

width, height – kép helyfoglalási információja a böngészőnek. Ennek a megadásával meggyorsíthatjuk a weboldalunk renderelését, ezzel gyorsabbá, felhasználó barátabbá tehetjük az oldalunk.

alt – alternatív leírás. Alapvetően arra lett kitalálva, hogy a képeket nem megjelenítő böngészők, így ezen felhasználók számára is jutassunk információt arról, milyen képről van szó. Esetünkben jelezzük, hogy ez egy kép Casmio SnowWhite típusú óra hátsó részéről készített felvétel.

title – kép megnevezése. Itt egy elnevezést adunk meg a képhez, amit egyébként a képre vezetett egér hatására a felhasználónak megjelenít a böngésző. Esetünkben megmondjuk, hogy ez milyen típusú óra.

class – css formázási osztály. A megjelenítés és a működés szétválsztásának egy mára elterjedt megoldása a css formázás. Nagy gyakorlati haszna, hogy például esetünkben a teljes weboldalra érvényes termék képek formázását csak egy helyen, egyszer kell megadnunk, így jelentős fölösleges ismétlést spórolhatunk meg és nem utolsó sorban a későbbi módosítás jelentősen leegyszerűsödik egy jól struktúrált központi css formázással.

Fontos a helyes kép kezelés keresőoptimalizálási szempontból?

Nagyon fontos és pozitív hatása van a képek helyes megadásának a keresőoptimalizálában is.

Egyrészt a felhasználó elégedettséget növelhetjük, gyorsabb weboldalunk lehet, több információt adunk a felhasználónak.

Másrészt a helyesen struktúrált képeinket a kereső motorok kép kiszolgáló és felderítő robotjai szívesebben fognak megjeleníteni. Ezen úton is további látogatókat nyerhetünk.

Végezetül nyitunk azon látogatók felé is, akik képeket nem töltenek le, mert ilyen a böngészűjük, vagy épp a mobil böngészőjükben tiltva van a képek letöltése a mobile internet forgalmi korlátai miatt.