Alt szöveg (alt text) a weben: miért fontos és hogyan írd jól? – teljes útmutató

A weboldaladon lévő képek, fotók és illusztrációk helyettesítő szövege (alt text) nem csak “mellékes kitöltendő mező”. Az alt szöveg javítja az akadálymentességet, segíti a SEO-t, és olyan helyzetekben is „megmenti” a tartalmat, amikor a kép nem töltődik be. Az alábbi útmutatóban elmagyarázom, miért fontos, mit írj, mit ne írj, és hogyan csináld jól WordPress környezetben.

Miért fontos az alt szöveg?

1) Akadálymentesség (A11y)

Az „a11y” egy mozaikszó (numeronim), amely az angol „accessibility” (magyarul: hozzáférhetőség vagy akadálymentesítés) szót rövidíti. A „11” a „k” és „y” betűk közötti 11 karaktert jelöli. Ez a kifejezés a digitális tartalmak és eszközök olyan tervezésére utal, amely lehetővé teszi, hogy mindenki, így a fogyatékossággal élő emberek is, könnyen hozzáférhessenek és használhassák őket.
Jelentése: Az a11y a hozzáférhetőségre, a digitális akadálymentesítésre utal.
Kiejtése: Az „a11y” kifejezést „alley”-nek (ejtsd: éli), azaz két „l” betűs szóként ejtik ki.
Célja: Célja a digitális akadályok lebontása, hogy a weboldalak, alkalmazások és eszközök mindenki számára használhatók legyenek, beleértve a látássérülteket, hallássérülteket, mozgássérülteket és kognitív fogyatékossággal élőket.

A képernyőolvasóval böngésző látássérült felhasználók a képek jelentését az alt szövegből értik meg. Ha nincs alt, a kép értelmezhetetlen zaj lesz – romlik a felhasználói élmény, és sérülhet a jogszabályi megfelelés is (közintézményeknél különösen fontos).

2) SEO és tartalmi relevancia

A keresőmotorok nem “látják” a képeket, az alt szövegből következtetnek a tartalomra. A jó alt:

  • erősíti a témarelevanciát,
  • segíthet a Google Képek találatokban,
  • támogatja a long-tail kulcsszavakat.

3) Tartalmi folyamatosság és hibabiztosság

Ha a kép nem tölt be (lassú net, CDN hiba), az alt szöveg átveszi a szerepet, és nem marad “lyuk” a történetben.

Itt írtunk arról, hogy honnan tudsz jó minőségű, jogtiszta képeket letölteni: https://webstudio22.hu/ingyenesen-letoltheto-jogtiszta-kepek-2024-ben/


Hogyan írj jó alt szöveget? (alapszabályok)

  1. Leíró, de tömör legyen (általában 5–12 szó).
  2. A kép funkciójára reagáljon (mit ad hozzá a szöveghez?).
  3. Ne legyen kulcsszóhalmozás – természetes nyelv, embernek írva.
  4. Ne írd bele, hogy “kép” vagy “fotó” – a képernyőolvasó úgyis jelzi.
  5. Dekoratív képnél hagyd üresen az alt-ot (alt=""), és állítsd díszítőnek.
  6. Infografika/grafikon: a lényeget foglald össze alt-ban + a részleteket a környező szövegben.
  7. Gombként használt kép: az alt a műveletet írja le (pl. “Ajánlatkérés”)


Jó és rossz alt szövegek – példák

Kontextus: Tisztítógép Guru szolgáltatásait bemutató oldalrész.

✅ Jó: alt="Világos szürke textilkanapé folteltávolítás előtt–után"
Leírja a jelenetet és a funkciót (előtte–utána).

❌ Rossz: alt="kanapé"
Túl általános, nem ad információt.


Kontextus: Rólunk oldal, ahol a csapat portréi vannak.

✅ Jó: alt="Antalóczi-Győrfi Orsolya webdesigner, Webstudio22"
Név + szerepkör – értékes információ.

❌ Rossz: alt="csapat"


Kontextus: Díszítő hullámvonal a szakaszok között.

✅ Helyes: alt="" (üres alt, dekoratív elem)


Kontextus: Kattintható képes gomb ajánlatkéréshez.

✅ Helyes: alt="Ajánlatkérés" (a műveletet írja le, nem a képet)

Gyors „recept”: Jó alt szöveg 3 lépésben

  1. Mi látszik? (konkrét tények: ki/mi, cselekvés, állapot)
  2. Mi a szerepe a cikkben? (miért fontos itt?)
  3. Hogyan mondanád el egy mondatban? (csak a lényeg)

Példa: „Budafoki nappali szürke kanapéja folteltávolítás előtt és után – Tisztítógép Guru referencia.”

Mikor hagyd üresen az alt mezőt?

  • Díszítőelemek, elválasztó ikonok, háttérminták.
  • Olyan képek, melyek semmilyen új információt nem adnak a környező szöveghez.
    • Ilyenkor: alt=""

Haladó tippek (SEO + A11y egyensúly)

  • Kulcsszó csak indokoltan: ha illeszkedik a kép tartalmához és a bekezdés témájához.
  • Entitások és kontextus: márkanév, helyszín, modell, év/állapot – csak ha tényleg releváns.
  • Sorozatoknál variáld az alt-okat (ne ismételd ugyanazt), hogy több releváns aspektust lefedj.
  • Infografikánál: alt = rövid összegzés; a teljes leírást add meg a képaláírásban vagy a szövegben.
  • Nyelvhelyesség, ékezetek: magyar oldalon magyarul, helyesen – ez a kereső és a felhasználó miatt is számít.

Itt írtunk arról, hogy hogyan tudod kihozni a maximumot a blogbejegyzéseidből: https://webstudio22.hu/hogyan-irj-seo-barat-blogbejegyzeseket/

Gyakori hibák (és helyes megoldásuk)

  1. Kulcsszóspammelés
    • ❌ „kanapétisztítás, kanapétisztító, kanapé tisztítás Budapest 22. kerület”
    • ✅ „Világos szövetkanapé folteltávolítás – Budafok, referencia”
  2. Fájlnevet bemásolni alt-nak
    • IMG_2033_final_v2.webp
    • ✅ „Kék mikroszálas szék gőztisztítás előtt–után”
  3. Ugyanaz az alt száz képen
    • ❌ „galéria kép” mindenhol
    • ✅ Minden képnél egyedi, a képre és a kontextusra szabott leírás.
  4. Dekoratív képeknél beszédes alt
    • ❌ „hullámvonal elválasztó”
    • alt="" és dekoratívként megjelölve.

Gyors ellenőrző lista ✅

  • Infografikánál rövid összegzés + környező szövegben a részletek.
  • Minden tartalmi képnek van értelmes, tömör alt-ja.
  • A dekoratív képek alt-ja üres (alt="").
  • Nincs kulcsszóhalmozás, természetes a megfogalmazás.
  • Az alt a kép szerepét tükrözi (miért van ott).
  • Duplikált alt-ok helyett variált leírások.

Mini-FAQ

Az alt ugyanaz, mint a képaláírás (caption)?
Nem. A caption vizuálisan látszik a felhasználónak; az alt a képernyőolvasónak és a keresőknek szól.

Kell kulcsszó az alt-ba?
Ha természetesen illeszkedik, igen. De soha ne erőltesd – a releváns, emberi leírás az első.

Mennyi legyen a hossza?
Általában 5–12 szó. Ha bonyolult a kép, tömören foglald össze; a részletek menjenek a szövegbe.

Összefoglalás

A jó alt szöveg három fronton segít:
hozzáférhetőség (mindenkinek érthető lesz a tartalom), SEO (jobban ért a kereső), üzleti érték (profibb megjelenés, több organikus forgalom). Nem „adminisztráció”, hanem minőségi tartalomírás része.

Szeretnél alt-auditot és gyors javítást?

A Webstudio22 csapata segít: átnézzük a teljes médiatáradat, priorizáljuk az oldalakat, megírjuk a hiányzó alt szövegeket. Írj nekünk, és kezdjük a legfontosabb oldalakkal!