Pragmatikus útmutató a képek alternatív szövegéhez 2026-ban

Miért számít még mindig az alternatív szöveg

Az alternatív szöveg 1995 óta része a HTML specifikációnak. Harminc évvel később a weben található képek többségénél még mindig vagy nincs alt attribútum, vagy az alternatív szöveg úgy hangzik, mintha olyan valaki írta volna, aki soha nem használt képernyőolvasót.

A probléma ma már nem a tudatosság hiánya. A legtöbb tartalomkezelő rendszerben az alt mező már kötelező. A probléma az, hogy az alternatív szöveg megfelelőségi jelölőnégyzetté vált, nem kommunikációs eszközzé. Az emberek azt írják: „egy mosolygó személy képe”, miközben a valódi kontextus ez lenne: „A vezérigazgató bejelenti a Q4 eredményeket.”

Az alternatív szöveg egyetlen okból létezik: hogy közvetítse egy kép célját annak, aki nem látja azt. Ez a cél a kontextustól függően változik. Egy kávéscsészéről készült fotó egy kávézó kezdőlapján más funkciót tölt be, mint ugyanez a fotó egy kerámiamázazási technikákról szóló blogbejegyzésben.

2026-ban már olyan AI-eszközeink is vannak, amelyek automatikusan tudnak alternatív szöveget generálni. Ezek az eszközök egyre jobbak, de a kontextust továbbra sem értik. Azt írják le, amit látnak, nem azt, hogy miért van ott a kép.

A döntési fa: Szüksége van ennek a képnek alternatív szövegre?

Nem minden képnek van szüksége leíró alternatív szövegre. Egyes képek dekoratívak. Mások redundánsak. Vannak, amelyeket jobban szolgál egy képaláírás vagy a környező szöveg.

A döntési folyamat:

Közvetít a kép olyan információt, amely nem érhető el a környező szövegből? Ha igen, szüksége van alternatív szövegre. Ha nem, valószínűleg dekoratív.

Egy vak felhasználó lemaradna valami fontosról, ha ez a kép eltűnne? Ha igen, írjon alternatív szöveget. Ha nem, használjon üres alt attribútumot (alt=""), hogy a képernyőolvasók átugorják.

A kép hivatkozás vagy gomb? Az alternatív szöveg lesz a hivatkozás szövege. A célhelyet írja le, ne a képet. Az „Árazási csomagok megtekintése” jobb, mint a „nyíl ikon”.

Összetett a kép — diagram, ábra vagy infografika? Az alternatív szövegnek gyakorlati hosszkorlátai vannak (a legtöbb képernyőolvasó számára körülbelül 125 karakter kényelmes). Az összetett képekhez hosszabb leírás kell, akár képaláírásban, a törzsszövegben, vagy aria-describedby használatával.

Milyen a jó alternatív szöveg valójában

A jó alternatív szöveg konkrét, tömör és kontextusérzékeny. Arra a kérdésre válaszol: Miért van itt ez a kép?

Rossz: „Egy grafikon képe”

Jobb: „Vonaldiagram, amely 23%-os növekedést mutat a mobilforgalomban 2026 januárja és márciusa között”

Rossz: „Egy személy laptopot használ”

Jobb: „Tervező weboldal-maketteket ellenőriz Figma-ban”

Rossz: „Kattintson ide”

Jobb: „A teljes akadálymentesítési audit ellenőrzőlistájának letöltése (PDF)”

Figyelje meg, hogy a jó alternatív szöveg gyakran tartalmaz számokat, cselekvéseket vagy eredményeket. Nem ír le minden vizuális részletet. Azt írja le, ami számít.

Dekoratív képeknél — hero háttértextúrák, díszítő szegélyek, pusztán esztétikai illusztrációk — használja ezt: alt="". Ez nem lustaság. Ez szemantikai őszinteség. A képernyőolvasók teljesen átugorják a képet, és pontosan ezt szeretné.

Gyakori hibák, amelyek mindenki idejét pazarolják

„Kép erről” vagy „Fotó erről” kezdés: A képernyőolvasók már jelzik, hogy képről van szó. Ugorjon rögtön a leírásra.

Kulcsszóhalmozás SEO célból: Az alternatív szöveg nem arra való, hogy belezsúfolja: „legjobb bio kávébab Brooklyn kézműves pörkölés”. A Google képkeresője évek óta jól felismeri ezt. Embereknek írjon.

A fájlnév leírása: Az „IMG_3847.jpg” senkinek sem segít. A „hero-banner-final-v3” sem.

Regény írása: Ha az alternatív szöveg két mondatnál hosszabb, az információnak valószínűleg inkább képaláírásban vagy a törzsszövegben van a helye.

A szomszédos szöveg ismétlése: Ha a címsor ez: „Hogyan süssünk kovászos kenyeret”, a képen pedig valaki tésztát formáz, az alternatív szövegnek nem kell megismételnie a címsort. Írja le, mi vizuálisan eltérő: „Kezek kovászos tésztát hajtogatnak lisztezett felületen.”

Eszközök és munkafolyamatok, amelyek valóban segítenek

A legtöbb modern CMS-ben már beépített alternatívszöveg-mezők vannak. A WordPress, a Webflow, a Contentful és a Sanity mind jól láthatóan megjeleníti az alt attribútumot feltöltés közben. Attól, hogy a mező látható, még nem biztos, hogy jól töltik ki.

Ha egy webhelyet hiányzó vagy gyenge alternatív szöveg miatt auditál, az olyan böngészőbővítmények, mint az Accessibility Insights vagy az axe DevTools, jelezni tudják az alt attribútum nélküli képeket. Gyors kézi ellenőrzéshez kapcsolja ki a képeket a böngészőben (a Firefox és a Chrome is támogatja), és olvassa el az oldalt. Ha az alternatív szöveg kontextusban értelmes, jó úton jár.

Az AI által generált alternatív szöveg — amely elérhető olyan eszközökben, mint az Azure Computer Vision, a Google Cloud Vision, vagy beépítve olyan platformokba, mint a Cloudflare Images — észszerű kiindulópont lehet, különösen nagy képtárak esetén. De kezelje az AI alternatív szöveget első vázlatként. Pontosan leírja a kép tartalmát, de nem fogja tudni, miért van a kép az oldalon. Egy emberi szerkesztőnek továbbra is hozzá kell adnia a kontextust.

Ha olyan webhelyen dolgozik, ahol sok kép van, és korán szeretné észrevenni a teljesítményproblémákat, az olyan eszközök, mint a Wux Webtools' Image Compressor, segíthetnek optimalizálni a fájlméreteket feltöltés előtt — mert az alternatív szöveg csak akkor hasznos, ha a kép ténylegesen betöltődik.

Alternatív szöveg és SEO 2026-ban

A Google évek óta azt mondja, hogy az alternatív szöveg rangsorolási tényező a képkeresésben. Ez továbbra is igaz. De a képkeresőre optimalizálás nem ugyanaz, mint az akadálymentesítés.

Ha az alternatív szöveget elsősorban SEO célból írja, kulcsszavakkal teletömött értelmetlenség lesz a vége, amely megnehezíti az oldal bejárását a képernyőolvasót használók számára. Ha először az akadálymentesítésre ír alternatív szöveget, a SEO-előnyök természetesen követik, mert a leíró, kontextuális alternatív szöveg pontosan az, amit a Google képkereső algoritmusa felszínre próbál hozni.

Egy árnyalat: a Google Images ma már sokkal erősebben használja az oldal környező tartalmát, mint korábban. Ha az alternatív szövege jó, de általános („csokoládétorta mázzal”), az oldala pedig vegán sütésről szól, a Google érteni fogja a kontextust. Nem kell azt írnia, hogy „vegán csokoládétorta tejmentes mázzal”, hacsak ez a különbség nem nyilvánvalóan látható a képen.

Fő tanulságok

• Az alternatív szöveg célja a kép céljának közvetítése, nem minden vizuális részlet leírása
• A dekoratív képeknél alt="" használata ajánlott, hogy a képernyőolvasók teljesen átugorják őket
• A jó alternatív szöveg konkrét, kontextusérzékeny, és megválaszolja: „miért van itt ez a kép?”
• Az AI által generált alternatív szöveg hasznos kiindulópont, de a kontextus miatt továbbra is emberi szerkesztést igényel
• Először az akadálymentesítésre írjon; a SEO-előnyök természetesen következnek a világos, leíró szövegből

GYIK

K: Használhatok egyszerűen AI-t az összes alternatív szöveg generálására?

V: Az AI-eszközök jól leírják, mi van egy képen, de nem értik a kontextust. Ha több száz termékképpel dolgozik, és alapleírásra van szüksége, az AI alternatív szöveg rendben van. Szerkesztőségi tartalomnál, marketingoldalaknál vagy bárhol, ahol számít a kép létezésének oka, embernek kell átnéznie és szerkesztenie.

K: Milyen hosszú legyen az alternatív szöveg?

V: A legtöbb képernyőolvasó számára a 125 karakter vagy annál kevesebb kényelmes. Ha ennél többre van szüksége, az információnak valószínűleg képaláírásban, a törzsszövegben vagy egy aria-describedby révén hivatkozott hosszabb leírásban van a helye. Nincs szigorú technikai korlát, de a hosszabb alternatív szöveg nehézkessé teszi a navigációt.

K: Szükség van alternatív szövegre a logóknál?

V: Igen, de legyen egyszerű. Ha a logó a fejlécben van, és a kezdőlapra mutat, az alternatív szöveg legyen a cég neve: alt="Acme Corp". Ne írja azt, hogy alt="Acme Corp logo", hacsak az, hogy logóról van szó, valamilyen módon nem releváns a kontextusban.

K: Mi a különbség az alternatív szöveg és a képaláírás között?

V: Az alternatív szöveg a kép közvetlen helyettesítője. A képernyőolvasók akkor olvassák fel, amikor a képhez érnek. A képaláírás kiegészítő információ, amely mindenki számára látható, és kontextust vagy forrásmegjelölést ad. Ha mindkettő van, nem szabad ismételniük egymást.

K: Adjunk alternatív szöveget a CSS háttérképekhez?

V: Nem. A CSS háttérképek definíció szerint dekoratívak, és nem jelennek meg a képernyőolvasók számára. Ha egy háttérkép fontos információt közvetít, akkor az HTML-ben lévő <img> elem legyen megfelelő alternatív szöveggel.

Források

• W3C Web Accessibility Initiative: Images Tutorial
• WebAIM: Alternative Text
• Nielsen Norman Group: Alt Text for Images
• Google Search Central: Image SEO Best Practices