WCAG 2.1 vs 2.2: mi változott, és miért számít?

A WCAG 2.2 2023 októberében vált W3C-ajánlássá. Ha egy oldalt a WCAG 2.1 alapján auditáltak, könnyen lehet, hogy már most megbukik olyan kritériumokon, amelyek ma az EU-ban, az Egyesült Királyságban és egyre inkább az egyesült államokbeli végrehajtási eljárásokban is meghatározzák a jogi megfelelőséget. Ez az útmutató végigveszi az összes változást — mi került be, mi került ki, és mit jelent az egyes kritériumok a gyakorlatban.

Rövid háttér: mit hozott a WCAG 2.1

A WCAG 2.1 (2018-ban jelent meg) 17 új sikerkritériummal bővítette az eredeti 2.0-s szabványt, három korábban elhanyagolt csoportra összpontosítva:

Mobilfelhasználók — érintőgesztusok, képernyőtájolás, mutatópontosság
Gyengénlátó felhasználók — újratördelés, nem szöveges kontraszt, szövegtávolságok
Kognitív és nyelvi fogyatékossággal élők — időkorlátok, állapotüzenetek

A WCAG 2.2 közvetlenül a 2.1-re épül. A 2.1 minden követelménye továbbra is érvényes. A kérdés csak az: mit tett hozzá a 2.2?

Amit a WCAG 2.2 hozzáadott: 9 új sikerkritérium

2.4.11 Fókusz nem takart (minimum) — AA szint

Amikor egy komponens billentyűzetfókuszt kap, azt más tartalom (ragadós fejlécek, sütibannerek, chatwidgetek) nem takarhatja el teljesen. A fókuszált elem legalább egy részének láthatónak kell maradnia.

Gyakori hiba: egy rögzített navigációs sáv eltakarja a fókuszált űrlapmezőt, amikor a felhasználó a Tab billentyűvel halad végig az oldalon.

2.4.12 Fókusz nem takart (bővített) — AAA szint

A 2.4.11 szigorúbb változata — a fókuszált komponensnek teljesen láthatónak kell lennie, nem csak részben.

2.4.13 Fókusz megjelenése — AA szint

A billentyűzetfókusz-jelzőknek minimális méret- és kontrasztküszöböket kell teljesíteniük:

A fókuszjelző területének legalább akkorának kell lennie, mint egy 2 CSS-pixel vastag keret a komponens körül
A fókuszált és a nem fókuszált állapot közötti kontrasztnak legalább 3:1-nek kell lennie

Ez túlmutat a meglévő 2.4.7 (Fókusz látható) kritériumon, amely csak azt követelte meg, hogy egyáltalán legyen fókuszjelző.

Gyakori hiba: egy vékony, 1 pixeles pontozott körvonal alacsony kontraszttal megfelel a 2.4.7-nek, de megbukik a 2.4.13-on.

2.5.7 Húzó mozdulatok — AA szint

Minden olyan műveletnek, amely húzást igényel, egyetlen mutatóval (koppintással vagy kattintással) is elvégezhetőnek kell lennie. Ez azokat a mozgássérült felhasználókat szolgálja, akik nem tudják megbízhatóan irányítani a húzó műveleteket.

Példa: egy rendezhető listának alternatívát (például fel/le gombokat) kell kínálnia azoknak, akik nem tudják húzni az elemeket.

2.5.8 Célpont mérete (minimum) — AA szint

Az interaktív célpontoknak (gombok, hivatkozások, űrlapvezérlők) legalább 24×24 CSS-pixel méretűnek kell lenniük — vagy elegendő távolságra kell lenniük a szomszédos célpontoktól ahhoz, hogy a teljes aktiválási terület elérje a küszöböt.

Ez a minimumváltozat. A bővített kritérium (2.5.5, amely a 2.1-ből öröklődött AAA szinten) 44×44 pixelt javasol.

Gyakori hibák: csak ikont tartalmazó gombok, bezáró (×) ikonok és szűk navigációs menükben elhelyezett szövegközi hivatkozások.

3.2.6 Következetes segítség — A szint

Ha egy weboldal segítségnyújtási lehetőséget kínál (telefonszám, chathivatkozás, kapcsolatfelvételi űrlap, GYIK-hivatkozás), annak ugyanabban a relatív pozícióban kell megjelennie minden oldalon, ahol jelen van. A kognitív fogyatékossággal élők gyakran a kiszámítható elhelyezésre támaszkodnak.

3.3.7 Redundáns adatbevitel — A szint

Azt az információt, amelyet a felhasználó ugyanabban a munkamenetben már megadott, nem szabad újra bekérni — kivéve, ha az ismételt megadás lényegi (például jelszó-megerősítő mező), vagy ha az adat biztonsági szempontból érzékeny.

Példa: egy többlépcsős pénztárfolyamat ne kérje el a számlázási címet a 3. lépésben, ha a felhasználó azt már megadta az 1. lépésben.

3.3.8 Akadálymentes hitelesítés (minimum) — AA szint

A hitelesítési lépések nem támaszkodhatnak kognitív funkciótesztre — tárgyak felismerésére, karakterek átírására vagy rejtvények megfejtésére —, hacsak nincs alternatíva, vagy a teszt nem a felhasználó által kezelt tartalom felismerésére irányul (például egy általa feltöltött fényképre).

Gyakori hibák: olyan CAPTCHA-k, amelyek torzított szöveg felismerését kérik hangalapú alternatíva nélkül, vagy a „kattintson minden képre, amelyen közlekedési lámpa van” típusú feladatok.

3.3.9 Akadálymentes hitelesítés (bővített) — AAA szint

A bővített változat még a felhasználó által kezelt tartalomra vonatkozó kivételt is megszünteti. A hitelesítési folyamatban semmilyen kognitív funkcióteszt nem megengedett.

Amit a WCAG 2.2 eltávolított: 4.1.1 Elemzés

A WCAG 2.1 tartalmazta a 4.1.1 Elemzés kritériumot (A szint), amely jól formált HTML-t követelt meg — egyedi elemazonosítókat, helyesen egymásba ágyazott elemeket és teljes nyitó/záró elempárokat. A modern böngészők annyira jól javítják csendben a hibás HTML-t, hogy ez a kritérium a gyakorlatban mérhetetlenné vált.

A WCAG 2.2-ben a 4.1.1 Elemzés elavultnak minősül, és mindig teljesítettnek tekintendő. Már nem kell rá auditálni, bár a tiszta HTML írása továbbra is bevált gyakorlat.

Összefoglaló táblázat

Kritérium	Szint	Téma
2.4.11 Fókusz nem takart (min.)	AA	Billentyűzetfókusz
2.4.12 Fókusz nem takart (bővített)	AAA	Billentyűzetfókusz
2.4.13 Fókusz megjelenése	AA	Fókuszjelző
2.5.7 Húzó mozdulatok	AA	Mutatóbevitel
2.5.8 Célpont mérete (minimum)	AA	Érintési célpontok
3.2.6 Következetes segítség	A	Kiszámíthatóság
3.3.7 Redundáns adatbevitel	A	Űrlapok
3.3.8 Akadálymentes hitelesítés (min.)	AA	Bejelentkezés / CAPTCHA
3.3.9 Akadálymentes hitelesítés (bővített)	AAA	Bejelentkezés / CAPTCHA
~~4.1.1 Elemzés~~	A	Eltávolítva

Kinek kell áttérnie?

Gyakorlatilag mindenkinek. A WCAG 2.2 ma már az az alapszint, amelyre a következők hivatkoznak:

Az európai akadálymentesítési irányelv (EAA), amely 2025 júniusa óta hatályos
Az EN 301 549 harmonizált szabvány (frissítve a WCAG 2.2-re való hivatkozással)
Az egyesült királyságbeli közszférabeli szervezetekre vonatkozó akadálymentesítési rendelet (frissített útmutatóval)
Számos egyesült államokbeli tagállami törvény és az igazságügyi minisztérium (DOJ) informális végrehajtási álláspontjai

Ha a legutóbbi teljes audit a WCAG 2.1 AA szintje alapján készült, a fejlesztési erőfeszítést arra az öt kritériumra érdemes összpontosítani, amelyek a legtöbb oldalt érintik: 2.4.11, 2.4.13, 2.5.8, 3.3.8 és 3.3.7 (ha vannak többlépcsős űrlapok vagy pénztárfolyamatok).

Hogyan auditáljunk az új kritériumokra

A legtöbb automatizált vizsgáló ma már jelzi a 2.5.8-at (célpontméret) és a 2.4.13 (fókusz megjelenése) egyes eseteit. A következők azonban manuális tesztelést igényelnek:

2.4.11 / 2.4.12 — végig kell haladni a Tab billentyűvel minden oldalon, aktív ragadós fejlécekkel és láblécekkel, és ellenőrizni kell, hogy a fókuszált elemek láthatók-e
2.4.13 — meg kell mérni a fókuszjelző méreteit és kontrasztját böngészős fejlesztői eszközökkel vagy kontrasztellenőrzővel
2.5.7 — azonosítani kell minden húzásos interakciót, és ellenőrizni, hogy létezik-e csak mutatóval használható alternatíva
3.2.6 — ellenőrizni kell, hogy a segítségnyújtási hivatkozások következetes pozícióban jelennek-e meg az oldalakon
3.3.7 — végig kell járni minden többlépcsős folyamatot, és megerősíteni, hogy semmilyen adatot nem kérnek be kétszer
3.3.8 — minden bejelentkezési, regisztrációs és ellenőrzési lépést tesztelni kell kognitív funkciótesztek szempontjából

A WCAG 2.2 nem teljes újratervezés — célzott kiegészítések halmaza, amely olyan valós akadályokat kezel, amelyeket a 2.1 kihagyott. A jó hír, hogy az új AA kritériumok többsége fókuszált javítási munkával megoldható, nem igényel teljes oldalújjáépítést.

Kapcsolódó: Hogyan tedd WCAG 2.2-kompatibilissé weboldaladat · Manuális akadálymentességi audit: teljes útmutató