WordPress Akadálymentességi Ellenőrzőlista Magyar KKV-knak

Miért fontos ez az Ön WordPress oldalának

A WordPress a világ weboldalainak több mint 40%-át hajtja, és sok kis magyar vállalkozás épít rá, mert megfizethető és egyszerű. A WordPress témák és bővítmények azonban gyakran akadálymentességi hiányosságokkal érkeznek — hiányzó alt szöveg a képeknél, gyenge színkontraszt, címke nélküli űrlapmezők —, amelyek csendben kizárják a fogyatékossággal élőket az oldal használatából. Az EU Akadálymentesítési Irányelv (EAA) érvényesítése 2025. június 28-án kezdődik, és a nem akadálymentes weboldalak jogi kockázatnak és ügyfélvesztésnek teszik ki vállalkozását.

Ez az ellenőrzőlista hat valódi, javítható problémára összpontosít, amelyek valószínűleg most is jelen vannak az Ön WordPress oldalán. Mindegyik pár perc alatt megoldható, ha tudja, hol keresse.

Végrehajtás Magyarországon

Magyarország akadálymentességi törvénye (2022. évi XVII. törvény) több hatóság között osztja meg a végrehajtást attól függően, mit üzemeltet — egy tipikus WordPress-alapú üzleti oldal esetén ez a nemzeti fogyasztóvédelmi hatóság, amely az e-kereskedelmet és az általános online szolgáltatásokat felügyeli. A nagyobb szektoroknak (fizetési terminálok, távközlési eszközök, pénzügyi szolgáltatások) saját, külön szabályozóik vannak.

Magyarország egy okból kiemelkedik minden más, általunk vizsgált EU-tagállam közül: ez az egyetlen, ahol a törvény közvetlenül tartalmaz valódi, árbevétel-alapú bírságsávokat. A kisebb vállalkozásokat legfeljebb 500 000 forintos bírság sújthatja (nagyjából 1250 euró). De a 100 millió forintnál nagyobb éves árbevétellel rendelkező szereplők akár az árbevételük 5%-áig is bírságolhatók, legfeljebb 500 millió forintig (nagyjából 1,25 millió euró) — ez egy valóban komoly szám, és olyan szerkezet, amelyet a kutatásunk során egyetlen más ország sem alkalmaz.

A szokásos EAA mikrovállalkozási mentesség érvényes (10 fő alatti létszám, 2 millió euró alatti árbevétel) — Magyarország nem tett hozzá semmi pluszt. Kutatásunk idején nem találtunk dokumentált vizsgálatot, figyelmeztetést vagy ténylegesen kiszabott bírságot e törvény alapján — a végrehajtás itt korábbi szakaszban jár, mint Franciaországban, Hollandiában, Svédországban vagy Németországban.

Kép alt szövegek

Minden jelentéssel bíró képnek szüksége van egy rövid leírásra az alt szöveg mezőjében. Termékfotók, logók, diagramok, ábrák — mindegyiknek szüksége van alt szövegre, hogy a képernyőolvasót használók megértsék, mit látnak.

Hogyan ellenőrizze WordPressben: Menjen a Médiatárba, kattintson minden képre, és nézze meg az "Alt szöveg" mezőt jobb oldalon. Ha üres, és a kép nem pusztán dekoratív, szüksége van szövegre. A dekoratív képeknél (például háttérmintáknál) hagyja üresen az alt szöveget, a WordPress automatikusan elrejti ezeket a képernyőolvasók elől.

Hogyan javítsa: Írjon 1–8 szót, amely leírja, mit mutat a kép. Termékfotónál írja: "Kék kerámia kávésbögre, 350 ml." Csapatfotónál írja: "Vezetőség az iroda előterében állva." Kerülje a "kép erről" vagy "fotó erről" kifejezéseket — a képernyőolvasók már tudják, hogy ez egy kép.

Színkontraszt

A világosszürke szöveg fehér alapon, vagy a sötét szöveg kissé sötétebb háttéren nehezen olvasható bárkinek, akinek gyengébb a látása, színtévesztő, vagy éppen napfényben nézi telefonján az oldalt.

Hogyan ellenőrizze WordPressben: Használja az ingyenes WAVE böngészőeszközt (wave.webaim.org) vagy az axe DevTools bővítményt (Chrome vagy Firefox). Futtassa a WordPress oldalán, és keresse a "Contrast" (kontraszt) figyelmeztetéseket. Különösen figyeljen a gombokra, linkekre és a törzsszövegre.

Hogyan javítsa: Tesztelje színeit a WebAIM Contrast Checker eszközzel (webaim.org/resources/contrastchecker/). Törekedjen legalább 4,5:1 arányra normál szövegnél (ez nagyjából azt jelenti: "elég világos ahhoz, hogy könnyen olvasható legyen"). A sötét szöveg világos háttéren, vagy a világos szöveg sötét háttéren általában megfelel. Ha egy téma színe túl világos, sötétítse kicsit a WordPress Testreszabóban vagy a téma beállításaiban.

Űrlapcímkék

A kapcsolatfelvételi űrlapoknak, hírlevél-feliratkozásoknak és bejelentkezési mezőknek látható címkékre van szükségük, hogy a felhasználók tudják, mire szolgál az adott mező. A képernyőolvasók a mező előtt bemondják a címkét, de a címke nélküli mezők találgatásra kényszerítik a képernyőolvasót használókat.

Hogyan ellenőrizze WordPressben: Nézze meg oldala minden űrlapját (kapcsolatfelvétel, keresőmező, bejelentkezés, hírlevél-feliratkozás). Van-e minden mező mellett szöveges címke? Ha egy mezőnek csak helykitöltő szövege van ("Adja meg e-mail címét…") és nincs címkéje, az akadálymentességi hiányosság.

Hogyan javítsa: Ha WPForms, Gravity Forms vagy Elementor űrlap bővítményt használ, nyissa meg az űrlapszerkesztőt, és győződjön meg róla, hogy minden mezőnél be van állítva egy "Címke" (nem csak helykitöltő szöveg). A címkének láthatónak kell lennie a mező felett vagy mellett. Kód alapú űrlapoknál adjon hozzá `<label for="mezonev">Mező neve</label>` elemet minden mező elé.

Linkszövegek és leírások

A linkeknek olvasható szöveggel kell rendelkezniük, amely elmondja, hova vezetnek, vagy mi történik kattintáskor. A csak ikont tartalmazó linkek ("→" vagy egy nyíl kép), vagy a teljesen szöveg nélküli linkek nem mondják meg a felhasználóknak (vagy a képernyőolvasóknak), hova vezetnek.

Hogyan ellenőrizze WordPressben: Vizsgálja át oldalait önálló ikonlinkek vagy csak-kép linkek után kutatva. Nyissa meg a Fejlesztői eszközöket (F12), keressen `<a>` címkéket, és nézze meg, melyikben nincs szöveg. Használja a WAVE-et az "Empty Link" (üres link) figyelmeztetések megtalálásához.

Hogyan javítsa: A csak ikont tartalmazó linkeknél (mint egy "következő bejegyzés" nyíl) vagy adjon hozzá látható szöveget ("Következő bejegyzés"), vagy rejtett, csak képernyőolvasóknak szóló szöveget az `aria-label="Következő bejegyzés"` attribútummal. Kép linkeknél győződjön meg róla, hogy a képnek van olyan alt szövege, amely leírja a link célját. Ha Elementor típusú oldalépítőt használ, a legtöbb linkgombnak van szövegmezője — töltse ki.

HTML nyelvi deklaráció

A WordPress témájának `<html>` címkéjében meg kell adni az oldal nyelvét, hogy a képernyőolvasók helyesen ejtsék ki a szavakat, és a keresőmotorok tudják, kinek jelenítsék meg az oldalt.

Hogyan ellenőrizze WordPressben: Menjen a Beállítások → Általános menüpontra a WordPress admin felületén. Nézze meg a "Webhely nyelve" mezőt. Ha "English" szerepel benne, miközben az oldal magyar nyelvű, ez hibás. Emellett nézze meg az oldal forráskódját (Ctrl+U), és nézze meg a legelső sort — magyar oldalnál `<html lang="hu">` kell szerepeljen, nem `<html>` vagy `<html lang="en">`.

Hogyan javítsa: A WordPress Beállítások → Általános menüpontban állítsa a Webhely nyelvét "Magyar"-ra. A WordPress automatikusan frissíti a html címkét. Ha nem, forduljon témája vagy tárhelyszolgáltatója ügyfélszolgálatához — néhány téma felülírja ezt a beállítást.

Gombnevek és címkék

A gomboknak világos szöveggel kell leírniuk, mit csinálnak. Egy csak ikont tartalmazó, vagy üres gombelem nem teszi lehetővé a képernyőolvasót használóknak, hogy megértsék, mi történik kattintáskor.

Hogyan ellenőrizze WordPressben: Keresse meg oldala minden gombját (Küldés, Letöltés, Vásárlás, keresőgombok, menü kapcsolók). Mindegyiknek van látható szövege vagy rejtett címkéje? Használja a WAVE-et a "Button with no name" (névtelen gomb) figyelmeztetések megtalálásához.

Hogyan javítsa: Ha egy gomb csak ikont mutat (mint egy nagyító a kereséshez vagy egy hamburger menü), adjon hozzá látható szöveget, ha van hely ("Keresés" vagy "Menü"). Ha szűkös a hely, adjon hozzá `aria-label="Keresés"` attribútumot a gomb kódjához. Elementor vagy Divi típusú oldalépítőknél a legtöbb gombnak van szövegmezője — töltse ki. Teszteljen mobilon is, hogy a címke elfér-e.

Következő lépések

Kezdje egy problémával — gyakran a kép alt szövegekkel, mivel a WordPress megkönnyíti ennek felismerését és javítását. Használja a WAVE-et vagy az axe DevTools-t oldala átvizsgálásához, hogy lássa, mely problémák a leggyakoribbak. Először a legnagyobb hatású problémákat javítsa (űrlapok és navigáció), majd térjen át a képekre és színekre. Dokumentálja, mit javított, hogy az új csapattagok is ismerjék a szabványt. Az akadálymentesség nem egyszeri projekt; a WordPress karbantartásának része.

Ez technikai WCAG-útmutató, nem jogi tanácsadás.