Volt már olyan, hogy feltöltöttél egy szép képet a weboldaladra, de fogalmad sem volt, mit írj az alt szöveg mezőbe? Vagy ami még rosszabb – simán üresen hagytad?
Ne érezd magad egyedül, ezt csinálja a legtöbb kezdő (és sajnos sok tapasztalt) weboldal-tulajdonos is. Pedig az alt szöveg képekhez hozzáadása az egyik legegyszerűbb SEO-fogás, amit bármikor, azonnal elvégezhetsz – és komolyan meghálálja magát. Ebben a cikkben lépésről lépésre megmutatom, hogyan csináld jól.
Mi az az alt szöveg a képekhez és miért nem mindegy mit írsz oda?
Az alt szöveg (más néven alternatív szöveg vagy alt attribútum) egy rövid leírás, amit a képedhez rendelsz hozzá a HTML kódban. Így néz ki a „motorháztető alatt”:
<img src=”kave-foto.jpg” alt=”Frissen pörkölt arabica kávészemek fa asztalon”>
Három dologra jó egyszerre:
- Akadálymentesség: A látássérült felhasználók képernyőolvasó szoftvereket használnak, amelyek felolvassák az alt szöveget. Ha ez hiányzik, ők egyszerűen nem tudják, mi van a képen.
- SEO: A Google nem „látja” a képeket úgy, ahogy mi. Az alt szöveg segít a keresőmotornak megérteni, miről szól a kép – és ez befolyásolja a rangsorolásodat.
- Tartalék megjelenítés: Ha a kép valamiért nem tölt be, az alt szöveg jelenik meg helyette. Legalább az olvasó tudja, mit kellett volna látnia.
Szóval nem egy felesleges admin feladat. Ez egy igazi háromfunkciós eszköz – és ingyen van.
Hogyan írj jó alt szöveget képekhez?
Na, most jön a lényeg. Mert azt mondani, hogy „írj alt szöveget” – könnyű. De hogyan írd jól? Lássuk a gyakorlatot!
1. Legyen leíró, de tömör
Az alt szöveg célja, hogy pontosan leírja, mi látható a képen. Nem kell regényt írni – általában 125 karakternél rövidebb maradj, mert a képernyőolvasók egy része ezt a határt ismeri el teljesen.
Rossz példa: „kép” vagy „foto1.jpg”
Jó példa: „Kávéfőző használata közben, gőzölgő csésze az előtérben”
Látod a különbséget? Az első semmit nem mond, a második pontosan elmondja, mit ábrázol a kép.
2. Természetesen sződd bele a kulcsszót
Ha releváns, a fókusz kulcsszavad is szerepelhet az alt szövegben – de ne erőltesd bele. A kulcsszó-tömítés (keyword stuffing) az alt szövegnél is rosszul sül el, a Google ma már nagyon ügyesen szűri ezeket.
Rossz példa: „kávéfőző kávéfőző vásárlás legjobb kávéfőző”
Jó példa: „Olasz espresso kávéfőző rozsdamentes acél kivitelben”
Az első példa nemcsak természetellenes, de kifejezetten árthat a rangsorolásnak. Az egyszerűség mindig nyer.
3. Ne kezdd „kép a…” vagy „fotó a…” szavakkal
Ez egy klasszikus hiba. A képernyőolvasók már jelzik, hogy képről van szó, szóval ha te is azzal kezded, kétszer hallják. Ugorj egyből a leírásra:
Rossz: „Kép egy kávéfőzőről”
Jó: „Kávéfőző fehér konyhapulton, reggeli fényben”
4. Dekoratív képeknél hagyd üresen
Igen, jól olvastad. Ha egy kép csak díszítő célú – például egy háttérminta vagy egy elválasztó ikon – akkor az alt attribútumot hagyd üresen (alt=””). Így a képernyőolvasó átugorja, és nem zavarja meg feleslegesen a felhasználót.
Fontos: az üres alt és a hiányzó alt nem ugyanaz. Ha teljesen kihagyod az alt attribútumot, az hiba. Ha üresen hagyod (alt=””), az szándékos jelzés.
A legjobb módszerek az alt szöveg hozzáadásához
Elmélet megvolt, most nézzük a gyakorlati eszközöket. Hogyan adod hozzá ténylegesen az alt szöveget?
WordPress: a legegyszerűbb út
Ha WordPress-t használsz (és nagy eséllyel azt használsz), az alt szöveg hozzáadása gyerekjáték:
- Töltsd fel a képet a Médiatárba
- Kattints a képre – jobb oldalon megjelenik az „Alternatív szöveg” mező
- Írd be a leírást, mentsd el
Ha a képet közvetlenül a szerkesztőben szúrod be, ugyanott elérheted ezt a mezőt a blokk beállításainál. Gyors, egyszerű, hatékony.
Tipp: ha már van feltöltve rengeteg képed alt szöveg nélkül, a WP Alt Text vagy az Image SEO típusú pluginok segíthetnek tömegesen pótolni a hiányosságokat.
Kézi HTML szerkesztés
Ha nem WordPress-t használsz, vagy szereted a kézi megoldásokat, egyszerűen add hozzá az alt attribútumot az <img> taghez:
<img src=”termek-foto.jpg” alt=”Kék vászon hátizsák cipzáros külső zsebbel”>
Semmi ördöngösség, csak következetesség kell.
Ingyenes SEO auditáló eszközök
Honnan tudod, hogy melyik képednél hiányzik az alt szöveg? Ne találgass – ellenőriztesd le:
- Google Search Console: A „Lefedettség” és az „Oldalélmény” füleken jelzi a problémákat
- Screaming Frog SEO Spider: Ingyenes verzióban 500 URL-ig átfésüli az egész oldaladat, és listázza a hiányzó alt szövegeket
- Ahrefs Site Audit / Semrush: Fizetős eszközök, de ha már van hozzáférésed, ezek is szépen megmutatják a hiányosságokat
- Browser DevTools: Egyszerűen nyomj F12-t, keresd meg a képet a kódban, és nézd meg, van-e alt attribútuma
Gyakori hibák, amiket érdemes elkerülni
Ezeket látom a leggyakrabban, amikor ügyfelek weboldalait nézem át:
- Teljesen hiányzó alt szöveg – a leggyakoribb hiba, és a legkönnyebb javítani
- Fájlnév alt szövegként – pl. „IMG_20240315_142233.jpg” – ez semmit nem mond sem a Googlenek, sem az olvasónak
- Azonos alt szöveg minden képnél – ha minden képednek „weboldal kép” az alt szövege, azzal semmit nem nyersz
- Túl hosszú, esszészerű leírás – az alt szöveg nem blogbejegyzés, maradj tömör
- Kulcsszó-tömítés – erről már volt szó, de megéri kétszer megemlíteni
Összegzés: ne hagyd ki ezt a 2 perces feladatot
Az alt szöveg képekhez hozzáadása az egyik olyan dolog, amit egyszer megtanulsz, és utána automatikusan csinálod minden egyes alkalommal, amikor képet töltesz fel. Nem bonyolult, nem időigényes – és a hatása messze meghaladja a befektetett energiát.
Ha most olvastad ezt és van egy weboldalad, itt a teendőd:
- Ellenőrizd le a meglévő képeidet (pl. Screaming Froggal)
- Pótold a hiányzó alt szövegeket – a legfontosabb oldalakról kezdve
- Mostantól minden új képnél töltsd ki azonnal
Ha WordPress-t használsz, az egész folyamat nem tart tovább 10-15 percnél egy kisebb oldalnál. Ez az egyik legolcsóbb SEO-fejlesztés, amit tehetsz – és holnaptól jobb helyzetben leszel, mint a versenytársaid fele, akik még mindig figyelmen kívül hagyják.
Egyáltalán NE bonyolítsuk túl: leírod, mi van a képen, természetesen belecsempészed a kulcsszót, és kész. A Google és az olvasóid is hálásak lesznek érte.