WCAG 2.2 -ohjeet

Käytännöllinen, kehittäjille suunnattu opas WCAG 2.2 -vaatimuksiin — mitä uutta, mitä rakentaa ja miten testata.

Mitä uutta WCAG 2.2 -versiossa

WCAG 2.2 lisää 9 uutta menestyskriteeriä ja poistaa kohdan 4.1.1 (Parsing). WCAG 2.2 -vaatimusten täyttäminen sisältää myös 2.1 ja 2.0 -vaatimukset (taaksepäin yhteensopiva). [1]

  • 2.4.11 Fokus ei peity (vähimmäistaso) – AA
    Kohdistetun elementin on oltava ainakin osittain näkyvissä (vältä kiinteitä elementtejä, jotka peittävät fokuksen). [2]
  • 2.4.12 Fokus ei peity (parannettu) – AAA
    Kohdistetun elementin on oltava täysin näkyvissä. [3]
  • 2.4.13 Fokuksen ulkoasu – AAA
    Selkeä ja riittävän kontrastinen fokusindikaattori. [4]
  • 2.5.7 Vetotoiminnot – AA
    Tarjoa vaihtoehto vedolle (esimerkiksi painikkeet siirtämiseen tai koon muuttamiseen). [5]
  • 2.5.8 Kohteen koko (vähimmäisvaatimus) – AA
    Kohteiden vähimmäiskoko on 24×24 CSS px tai niillä on riittävä väli. [6]
  • 3.2.6 Johdonmukainen ohje – A
    Pidä ohje- tai tukilinkit samassa paikassa eri sivuilla. [7]
  • 3.3.7 Toistuvan syötön välttäminen – A
    Älä vaadi käyttäjää syöttämään samaa tietoa useaan kertaan — esitä aiemmin syötetty tai täytä automaattisesti. [8]
  • 3.3.8 Saavutettava todennus (vähimmäistaso) – AA
    Vältä kognitiivisia testejä; salli salasananhallinta, kopioi/liitä ja passkeyt. [9]
  • 3.3.9 Saavutettava todennus (parannettu) – AAA
    Sama tavoite, tiukempi soveltamisalue. [10]

AA-tason tarkistuslista (rakennus ja testaus)

Kattaa nämä korkean vaikutuksen AA-alueet, mukaan lukien uudet WCAG 2.2 -kohdat.

Fokus ja näppäimistö

  • Kaikki ohjaimet saavutettavissa Tab / Shift+Tab -näppäimillä; ei ansakuoppia.
  • Näkyvä :focus-visible -kehys hyvällä kontrastilla. (2.4.11 / 2.4.13) [11]
  • Kohdistettu elementti ei saa peittyä kiinteiden otsikoiden tai alatunnisteiden alle. (2.4.11) [12]

Osoitin ja kohteen koko

  • Tarjoa vaihtoehto vetämiselle kaikissa toiminnoissa. (2.5.7) [13]
  • Kohteet ≥ 24×24 CSS px tai riittävä väli. (2.5.8) [14]

Lomakkeet ja todennus

  • Selkeät tunnisteet, hyödylliset virheilmoitukset ja ohjelmallinen tila.
  • Älä pyydä samoja tietoja useammin kuin kerran. (3.3.7) [15]
  • Salli liittäminen, salasananhallinta ja passkeyt; vältä kognitiivisia testejä. (3.3.8) [16]

Ohje ja prosessi

  • Pidä ohje- tai yhteystiedot samassa paikassa kaikilla sivuilla. (3.2.6) [17]
  • Täydet sivut ja koko prosessi täyttävät tavoitetason (ei vain yksittäiset näkymät). [18]

Vaatimustenmukaisuus (miten WCAG “täytetään”)

  • Tasoja on kolme: A, AA ja AAA. Useimmat politiikat tähtäävät AA-tasoon. [19]
  • Koko sivujen ja prosessien on täytettävä valittu taso. [20]
  • Käytä saavutettavuuden tukemia tekniikoita eikä sisältöä, joka rikkoo menestyskriteerejä. [21]
  • Taaksepäin yhteensopiva: 2.2 lisää 2.1/2.0 -kriteerejä; 4.1.1 on poistettu. [22]

Testausprosessi (käytännössä)

  1. Automaattiset säännöt (GetWCAG) nopeaan havainnointiin.
  2. Näppäimistötesti: varmista, että fokus näkyy eikä peity. (2.4.11) [23]
  3. Osoitintesti: tarkista 24×24 px tai väli; ei pakollista vetämistä. (2.5.7 / 2.5.8) [24]
  4. Todennus: salli liittäminen, passkeyt ja salasananhallinta. (3.3.8) [25]
  5. Monivaiheiset prosessit: säilytä tiedot ja johdonmukainen ohjeen sijainti. (3.3.7 / 3.2.6) [26]

“Ei automaattisia virheitä” ≠ vaatimustenmukaisuus. Manuaalinen tarkistus on aina tarpeen.

Usein kysytyt kysymykset

Jos täytän 2.2 AA -tason, täytänkö myös 2.1 AA -tason?

Kyllä — WCAG 2.2 on laajennus 2.1/2.0 -versioista (poikkeuksena 4.1.1 poistettu). [27]

Onko AAA-taso pakollinen?

Yleensä ei. Pidä AAA-taso (esim. 2.4.12, 2.4.13, 3.3.9) tavoitetasona, ellei sitä erikseen vaadita. [28]

Viralliset viitteet
  1. What’s new in WCAG 2.2 (W3C)
  2. Understanding 2.4.11
  3. Understanding 2.4.12
  4. Understanding 2.4.13
  5. Understanding 2.5.7
  6. Understanding 2.5.8
  7. Understanding 3.2.6
  8. Understanding 3.3.7
  9. Understanding 3.3.8
  10. Understanding 3.3.9
  11. Focus appearance guidance
  12. Focus not obscured guidance
  13. Dragging movements
  14. Target size minimum
  15. Redundant entry
  16. Accessible authentication (min)
  17. Consistent help
  18. Conformance basics
  19. WCAG overview
  20. Full pages & processes
  21. Accessibility-supported
  22. New in 2.2 / 4.1.1 note
  23. Keyboard sweep ref
  24. Pointer & target size
  25. Auth checks
  26. Process consistency
  27. 2.2 implies 2.1/2.0
  28. AAA context
WCAG 2.2 -ohjeet (AA-taso) — Käytännön opas