Akadálymentes weboldal az EAA szerint: mit teszteljen saját maga

Ha online értékesít fogyasztóknak az EU-ban, az európai akadálymentességi irányelv (European Accessibility Act) akadálymentes weboldalra vonatkozó követelményei 2025. június 28. óta érvényesek a webshopjára, hacsak a vállalkozása nem mikrovállalkozás. A komoly hibák nagy részét saját maga is megtalálhatja: adjon le egy próbarendelést csak billentyűzettel, nagyítsa fel az oldalt, és próbáljon ki minden űrlapot. Azt viszont egy önellenőrzés nem tudja bizonyítani, hogy a teljes oldal megfelel a szabványnak.

Lehet, hogy egy fejlesztő már említette a jogszabályt, vagy kapott egy e-mailt egy widgetről, amely egyetlen kódsorral bármely oldalt „megfelelővé” tesz. Az a vásárló, aki billentyűzettel vagy képernyőolvasóval (a lapot felolvasó szoftverrel) nem jut át a pénztáron, panasz nélkül átmehet egy másik boltba.

Vonatkozik az európai akadálymentességi irányelv az Ön weboldalára?

Az európai akadálymentességi irányelv akkor vonatkozik Önre, ha a weboldala fogyasztóknak, vagyis saját célra vásárló magánszemélyeknek értékesít, és a vállalkozása nem mikrovállalkozás. Az (EU) 2019/882 irányelv az általa lefedett szolgáltatások között sorolja fel az elektronikus kereskedelmi szolgáltatásokat: a weboldalon vagy alkalmazáson keresztül „fogyasztói szerződés megkötése céljából” nyújtott szolgáltatásokat. A tagállamoknak 2025. június 28-tól kellett alkalmazniuk a szabályait. Ez a mi olvasatunk az irányelvről; a saját esetére vonatkozó jogi véleményért forduljon ügyvédhez.

• A szolgáltatásokat nyújtó mikrovállalkozások mentesülnek. Ezt a 4. cikk (5) bekezdése mondja ki. Az irányelv szerint mikrovállalkozás az, amely 10 főnél kevesebbet foglalkoztat, és éves árbevétele vagy éves mérlegfőösszege legfeljebb 2 millió euró. A létszám és a két pénzügyi feltétel egyike együtt számít: egy tízfős csapat kívül esik a mentességen, akármilyen kicsi is az árbevétele.
• Csak vállalkozásoknak értékesít. A meghatározás fogyasztói szerződésekről szól. Ha magánvásárlók is rendelhetnek a pénztárán keresztül, kezelje úgy, hogy az irányelv vonatkozik az oldalra.
• Semmit nem értékesítő oldal. A rendelés, foglalás vagy fizetés nélküli céges weboldal általában nem elektronikus kereskedelmi szolgáltatás az irányelv meghatározása szerint. A foglalás és a fizetés ezen változtat.
• A 2030-as határidő termékekre és régi szerződésekre szól. A 32. cikkben szereplő, 2030. június 28-ig tartó átmeneti időszak a szolgáltatásnyújtáshoz használt termékekre és a 2025 júniusa előtt megkötött szerződésekre vonatkozik.

Minden EU-tagállam saját jogszabállyal hajtja végre az irányelvet, és maga határozza meg a szankciókat; Németországban ez a jogszabály a BFSG. Ha a vállalkozása Svájcban vagy az Egyesült Királyságban működik, és az EU-ban értékesít fogyasztóknak, kérdezzen meg egy ügyvédet arról, hogyan vonatkoznak Önre ezeknek az országoknak a szabályai.

Miért buknak el a webshopok az akadálymentességi ellenőrzéseken?

Az alábbi hibák általában olyan tervezési és űrlapdöntésekből erednek, amelyeket egyszer hoztak meg egy sablonban, és minden oldalon megismétlődnek. Az (EU) 2019/882 irányelv olyan weboldalakat kér, amelyek „észlelhetők, működtethetők, érthetők és robusztusak”. Az ezt tesztekre lefordító európai szabvány, az EN 301 549 a WCAG-et követi, vagyis a W3C által kiadott, webes tartalmak akadálymentességére vonatkozó irányelveket (Web Content Accessibility Guidelines). A WCAG három szintbe sorolja a feltételeit: A (a minimum), AA és AAA. A szabvány az AA szintet használja célként.

A fókuszkeretet a látvány kedvéért eltávolították. Amikor valaki a Tab billentyűvel halad végig egy oldalon, a böngésző keretet rajzol az aktív link vagy gomb köré. Egyes sablonok elrejtik, mert rendetlennek tűnik, holott a WCAG látható fókuszjelzést ír elő. Egy a WCAG 2.2-ben bevezetett feltétel azt is kimondja, hogy a fókuszban lévő elemet nem takarhatja el teljesen az oldal saját tartalma, például egy rögzített fejléc vagy egy cookie-sáv.

A szöveg túl halvány. A WCAG a kontrasztarányra, vagyis arra, hogy a szöveg mennyivel sötétebb vagy világosabb a hátterénél, normál szövegnél legalább 4,5:1-et, nagy szövegnél 3:1-et kér. A WebAIM 2026-os vizsgálata egymillió kezdőoldalon az oldalak 83,9%-án talált alacsony kontrasztú szöveget. Tipikus eset a világosszürke a fehéren és a fehér a pasztellszínű gombon.

Az űrlapok helykitöltőkre és színekre támaszkodnak. A mezőben lévő szürke tipp eltűnik, amint gépelni kezd, egy piros keret pedig önmagában nem mondja meg, mi a hiba. A WCAG címkéket vagy utasításokat ír elő mindenhol, ahol adatot kell megadni, és a hibák szöveges leírását.

A pénztárat egérre tervezték. Az egyedi legördülő menük, a kirakós CAPTCHA-k és az olyan bejelentkezések, amelyek egy kód megjegyzését vagy újragépelését kérik, megállítják a billentyűzetet vagy képernyőolvasót használókat. Az irányelv az elektronikus kereskedelemnél külön megnevezi az azonosítást, a biztonságot és a fizetést. 2026 márciusában a holland fogyasztóvédelmi hatóság, az ACM arról számolt be, hogy az általa vizsgált nagy holland webshopok és más nagy fogyasztói weboldalak 61%-ánál nem lehetett rendelést leadni segítő technológiával, például képernyőolvasóval.

Egy widget vagy egy pontszám helyettesíti a javítást. Az overlay widgetek akadálymentességi eszköztárat tesznek az oldal tetejére. Az Európai Bizottság szerint az overlay-ek és a hasonló eszközök, amelyek nem magát a weboldalt teszik a szabványnak megfelelővé, „nem megfelelő megoldások”. Egy automatikus teszt segít, de a W3C szavaival: „egyetlen eszköz sem képes önmagában megállapítani, hogy egy oldal megfelel-e az akadálymentességi szabványoknak.”

Akadálymentes weboldal-ellenőrzés az irányelv szerint: így végezze el saját maga

Egy első áttekintést böngészővel és billentyűzettel, fizetős eszközök nélkül is elvégezhet. A W3C, a WCAG mögött álló szervezet, erre az elvre épülő egyszerű ellenőrzéseket (Easy Checks) tesz közzé. Válasszon ki három oldalt: a kezdőoldalt, egy termék- vagy szolgáltatásoldalt és a pénztárt vagy a kapcsolatfelvételi űrlapot. Haladjon sorban, és jegyezzen fel minden helyet, ahol elakad.

1. Tegye félre az egeret. Lépkedjen végig minden oldalon a Tab és a Shift+Tab billentyűvel, és használja az Entert, a szóközt és a nyílbillentyűket. El kell érnie a menüt, a szűrőket, a kosárba tétel gombját, minden űrlapmezőt és a fizetés gombot. Minden pillanatban látnia kell, hol jár. Jegyezze fel, hol tűnik el a keret egy rögzített fejléc vagy egy cookie-sáv mögött, és ki tud-e lépni egy menüből vagy egy csevegőablakból.
2. Nagyítson. Állítsa a böngészőt 200%-ra. A WCAG elvárja, hogy a szöveg olvasható maradjon anélkül, hogy a tartalom levágódna vagy egymásra csúszna. Ezután állítsa az ablakot körülbelül 1280 pixel szélesre, és nagyítson 400%-ra: a tartalomnak oldalirányú görgetés nélkül el kell férnie a szélességben, kivéve például a térképeket és az adattáblázatokat.
3. Ellenőrizze a halvány szöveget. A Chrome, az Edge és a Firefox fejlesztői eszközei megmutatják a kijelölt szövegszín kontrasztarányát. Ellenőrizze a folyószöveget, az árakat, a gombokat és az űrlapmezők alatti apró szürke szöveget.
4. Próbáljon ki minden űrlapot üresen, majd hibásan. Minden mezőnek látható címke kell, amely gépelés közben is megmarad. Küldje el az űrlapot üresen: a hibaüzenetnek a mező mellett, szavakkal kell megmondania, mi hiányzik, és meg kell őriznie, amit már beírt. Egy új WCAG 2.2-feltétel azt is kéri, hogy az ugyanabban a folyamatban már megadott adatokat, például a címet, a rendszer automatikusan kitöltse vagy felkínálja kiválasztásra. Hogy egy űrlap még miként kerülhet rendelésekbe, arról a forgalom van, megkeresés nincs témájú cikkünkben írunk.
5. Jelentkezzen be, és menjen át a spamszűrő ellenőrzésen. A WCAG 2.2 szerint a bejelentkezés nem függhet kognitív funkciótesztől, például egy jelszó megjegyzésétől vagy egy rejtvény megoldásától, hacsak nincs alternatíva vagy segítség, például jelszókezelő vagy beillesztés. Az a kirakós CAPTCHA, amely mellett nincs más lehetőség, itt elbukik.
6. Nézze meg a termékfotókat. Kattintson jobb gombbal egy képre, és válassza a Vizsgálat lehetőséget. Az alternatív szövegnek (alt), vagyis a rövid leírásnak, amelyet a képernyőolvasó felolvas, meg kell mondania, mi a termék; a pusztán díszítő képeknél üres is lehet.
7. Ismételje meg a fő lépéseket telefonon. Az egymáshoz közel elhelyezett apró ikonokat nehéz megérinteni. A WCAG 2.2 legalább 24 x 24 CSS-pixeles célterületet ír elő (a CSS-pixel magának a weboldalnak a méretegysége), kivételekkel, például ha a célterület körül elég hely van.

A W3C megjegyzi, hogy egy oldal „látszólag átmehet ezeken az ellenőrzéseken, mégis jelentős akadálymentességi akadályai lehetnek”. A következő lépés egy olyan ember tesztje, aki nap mint nap képernyőolvasót használ.

Mit javítson először?

Kezdje a sablon és az űrlapkomponensek javításaival, a legolcsóbbtól a legdrágábbig. Egy sablonban végzett változtatás minden rá épülő oldalt kijavít. A közzétett akadálymentességi tájékoztatást hagyja arra az időre, amikor már tudja, mit tud és mit nem tud az oldal.

1. Ne telepítsen overlay-t. Az Európai Bizottság azt tanácsolja, hogy az akadálymentességi problémákat „a forrásuknál” javítsák, ami egy webshopnál a sablont, az űrlapokat és a pénztárt jelenti.
2. Állítsa vissza a fókuszkeretet, és sötétítse a szöveget. Mindkettő általában a sablon szín- és stílusbeállításaiban található. Mi azzal kezdjük, hogy a kontrasztot egyszer beállítjuk a dizájn színpalettájában, és ellenőrizzük az oldal világos és sötét változatában, így minden új oldal már megfelelő színekkel indul.
3. Építse újra az űrlapokat. Látható címkék, szavakkal megfogalmazott hibaüzenetek a mező mellett, hiba után is megőrzött beírt adatok, a fókusz áthelyezése az első javítandó mezőre, és böngészős automatikus kitöltés a névhez, az e-mail-címhez és a címhez. Weboldal-projektjeinkben magával az űrlapkomponenssel kezdjük, így minden új űrlap már ezekkel a javításokkal indul.
4. Adjon meg alternatív szöveget és az oldal nyelvét. Írja le a termék- és tartalmi képeket, és gondoskodjon róla, hogy minden oldal megadja a nyelvét, hogy a képernyőolvasó helyesen ejtse ki a szöveget. A keresőmotorok ugyanezt az alternatív szöveget és nyelvi attribútumot olvassák, ezért ezek a technikai SEO-munkához is hozzátartoznak.
5. Javítsa a pénztárt, a bejelentkezést és a külső widgeteket. Cserélje le a kirakós CAPTCHA-kat olyan ellenőrzésekre, amelyek nem kérnek feladatmegoldást a vásárlótól, és kínáljon olyan bejelentkezési módot, amely nem az emlékezetre épül. A fizetési és csevegő widgetek szolgáltatóktól származnak: kérje el minden szolgáltatótól az akadálymentességi tájékoztatását, és cserélje le azokat, amelyeket billentyűzettel nem lehet elérni.
6. Tegye közzé az akadálymentességi tájékoztatását. Az irányelv V. melléklete előírja, hogy a szolgáltatók az általános szerződési feltételekben vagy egy azzal egyenértékű dokumentumban írják le, hogyan felel meg a szolgáltatás a követelményeknek. A részleteket a nemzeti jogszabály határozza meg.
7. Haladjon a WCAG 2.2 AA szintje felé. Az AccessibleEU beszámolója szerint a 2026 szeptemberében kiadott EN 301 549 4.1.1-es változata hat követelményt vesz át a WCAG 2.2-ből. Ugyanez a forrás megjegyzi, hogy amíg a Bizottság nem hivatkozik rá az Európai Unió Hivatalos Lapjában, a referencia a WCAG 2.1 AA szintjén alapuló 3.2.1-es változat marad. Az ír National Disability Authority 2026. december 16-ra várja a hivatkozást. Ha már most a WCAG 2.2 szerint javít, az új követelmények is teljesülnek, amikor ez megtörténik.

Az irányelv kivételt enged, ha a megfelelés aránytalan terhet jelentene, de ehhez értékelést ír elő, a preambulumbekezdései pedig kimondják, hogy „a prioritás, az idő vagy az ismeretek hiánya” nem jogszerű indok.

Mit mérjen a javítások után?

Azt mérje, hogy egy ember el tudja-e végezni a fő feladatokat billentyűzettel és nagyított oldalon. Ismételje meg ugyanazt az akadálymentes weboldal-ellenőrzést ugyanazon a három oldalon, és hasonlítsa össze, hol akadt el a változtatások előtt és után. Ellenőrizzen újra, valahányszor változik a sablon, egy bővítmény vagy a fizetési szolgáltató.

1. Próbarendelés csak billentyűzettel, a termékoldaltól a visszaigazolásig, az egér érintése nélkül.
2. Egy ingyenes automatikus teszt találatainak listája, például a Chrome-ban elérhető Lighthouse-é, ugyanazon a három oldaltípuson futtatva. Nézze át a találatokat, és ellenőrizze, melyek maradtak meg.
3. Hibásan elküldött űrlapok, annak ellenőrzésére, hogy minden hibát szavakkal írnak le, és semmi sem vész el a beírtakból.
4. A közzétett akadálymentességi tájékoztatása, minden olyan változtatás után frissítve, amely érinti, hogyan rendelnek a vásárlók.

Miben segítünk

Amikor egy webshop pénztárát nézzük meg, a vásárló útját követjük: a termékoldalt, a kosarat, az űrlapokat és a fizetési lépést, először billentyűzettel, majd telefonon. A sablonban vagy az űrlapkomponensekben rejlő problémákat ott a legolcsóbb javítani; amit egy önellenőrzés nem tud eldönteni, azt egy képernyőolvasós tesztre hagyjuk. Ha szeretné, hogy valaki másodszor is ránézzen a pénztárára, meséljen nekünk az oldaláról.

← Minden cikk