WCAG 2.2 -ohjeet

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

Viimeksi tarkistettu: 25. elokuuta 2026.

WCAG 2.2 -tarkistuslista tason ja tiimin mukaan

Käytä tätä tarkistuslistaa vaatimusten arviointiin vaatimustenmukaisuustason (A, AA, AAA) ja työalueen (Suunnittelu, Kehitys, Sisältö) mukaan.

VaatimusSelitys selkokielelläMiten testataYleinen virheMiten korjataAiheeseen liittyvä GetWCAG-resurssi
AADesign
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.Osoitintesti: tarkista 24×24 px tai väli; ei pakollista vetämistä. (2.5.7 / 2.5.8)Primary buttons and icon-only controls are too small on mobile.Increase interactive target size to at least 24x24 CSS px or add spacing.Kontrastitarkistin
AADevelopment
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).Näppäimistötesti: varmista, että fokus näkyy eikä peity. (2.4.11)Sticky headers hide focused links or form controls.Adjust scroll offset and sticky layouts so focused elements remain visible.WCAG 2.2 -testikirjasto
AADevelopment
2.5.7 Vetotoiminnot – AA
Tarjoa vaihtoehto vedolle (esimerkiksi painikkeet siirtämiseen tai koon muuttamiseen).Osoitintesti: tarkista 24×24 px tai väli; ei pakollista vetämistä. (2.5.7 / 2.5.8)Drag-and-drop is required with no keyboard or tap alternative.Provide add/remove, reorder, or move buttons as single-pointer alternatives.WCAG 2.2 -testikirjasto
AAContent
3.3.8 Saavutettava todennus (vähimmäistaso) – AA
Vältä kognitiivisia testejä; salli salasananhallinta, kopioi/liitä ja passkeyt.Todennus: salli liittäminen, passkeyt ja salasananhallinta. (3.3.8)Login flow blocks password manager paste and passkeys.Allow paste/autofill and provide authentication methods without cognitive tests.Asiantuntijan suorittamat manuaaliset saavutettavuusauditoinnit
AContent
3.2.6 Johdonmukainen ohje – A
Pidä ohje- tai tukilinkit samassa paikassa eri sivuilla.Monivaiheiset prosessit: säilytä tiedot ja johdonmukainen ohjeen sijainti. (3.3.7 / 3.2.6)Help links or support actions move between templates.Keep support entry points in a consistent location across key pages.Kaikki aiheesta
AAADesign
2.4.13 Fokuksen ulkoasu – AAA
Selkeä ja riittävän kontrastinen fokusindikaattori.Näppäimistötesti: varmista, että fokus näkyy eikä peity. (2.4.11)Focus ring blends into backgrounds and components.Increase focus indicator thickness and contrast against adjacent colors.Kontrastitarkistin

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