Ilmainen työkalu: Saavutettavuus

WCAG 2.2 -tarkistus

Näe, missä sivustosi on kunkin WCAG 2.2:n 55 A- ja AA-tason onnistumiskriteerin osalta. Jokainen kriteeri saa yhden neljästä tilasta, joten näet, mitä automaattiset testit kattoivat ja mitä ihmisen on vielä tarkistettava.

Ilmainen. Testaa enintään viisi keskeistä sivua noin minuutissa.

Mitä tämä työkalu tarkistaa

  • Jokainen A- ja AA-tason kriteeri

    Kaikki 55 kriteeriä, 31 A-tasolla ja 24 AA-tasolla, WCAG:n järjestyksessä numeroineen ja nimineen. 4.1.1 Parsing on jätetty pois, koska WCAG 2.2 merkitsee sen vanhentuneeksi.

  • Automaattiset tulokset kriteereihin yhdistettyinä

    axe-coren säännöt ajetaan syöttämälläsi sivulla ja enintään neljällä keskeisellä sivulla, ja jokainen tulos liitetään niihin onnistumiskriteereihin, joita sääntö testaa. Kriteeri hylätään, jos jokin sen säännöistä epäonnistuu yhdelläkin testatulla sivulla.

  • Näppäimistöhavainnot

    Ensimmäisellä sivulla tehtävä 40 painalluksen Tab-testi tuottaa tietoa kriteeriin 2.1.2 No Keyboard Trap sekä heuristisena, tarkistettavaksi näytettävänä tietona kriteeriin 2.4.7 Focus Visible.

  • Ratkaisemattomat tulokset erillään

    Kun sääntö ei pääse ratkaisuun, esimerkiksi kuvan päällä olevan tekstin kohdalla, sen kriteereille näytetään Tarkistettava eikä läpäisyä tai hylkäystä.

  • Näkyvät aukot pisteytyksen sijaan

    Kriteerit, joita mikään automaattinen sääntö ei kata, merkitään manuaaliseksi tarkistukseksi (Manual check). Mitään ei keskiarvoisteta prosenttiluvuksi, joka peittäisi sen, mitä ei testattu.

Mitä se ei voi tarkistaa

  • Ratkaista kriteerejä, jotka vaativat ihmisen harkintaa, kuten 1.4.10 Reflow, 1.4.11 Non-text Contrast, tekstityksiä ja kuvailutulkkausta koskevat 1.2-kriteerit sekä lomakevirheitä koskevat kriteerit 3.3.1:stä 3.3.4:ään.
  • Muuttaa tilaa ”Ei automaattisia virheitä” (No automated failures) läpäisyksi. Sääntö, joka ajettiin ja läpäistiin, kattaa vain sen, mitä kyseinen sääntö testaa.
  • Laatia vaatimustenmukaisuusväitettä, saavutettavuusselostetta tai VPAT-raporttia. Vaatimustenmukaisuuden arvioivat ihmiset kokonaisten sivujen ja kokonaisten prosessien perusteella.
  • Testata AAA-tasoa tai muita kuin skannauksen viittä sivua.
  • Päästä kirjautumisen tai kassan takana oleviin vaiheisiin, joissa yleensä sovelletaan esimerkiksi kriteerejä 3.3.7 Redundant Entry ja 3.3.8 Accessible Authentication.

Miksi sillä on merkitystä

WCAG on kirjoitettu onnistumiskriteereinä, ja niiden avulla auditoijat, hankintatiimit ja saavutettavuusselosteet kuvaavat sivustoa. Luettelo epäonnistuneista säännöistä kertoo, mitä korjata. Kriteerinäkymä kertoo, mitä sivustosta voi ja ei vielä voi sanoa.

Automaattiset työkalut ulottuvat alle puoleen A- ja AA-tason kriteereistä: axe-core yhdistää sääntönsä noin 25:een kriteeriin 55:stä. Muille ei ole luotettavaa automaattista testiä. Ohjelmisto ei pysty päättelemään, ehdottaako virheilmoitus korjausta (3.3.3) tai toimiiko sivu yhä 320 CSS-pikselin levyisenä (1.4.10). Kun ne listataan manuaalisina tarkistuksina, näkyy, missä testausta on vielä tehtävä.

Kriteeri voi jäädä täyttymättä, vaikka automaattisia virheitä ei löytyisi. Kriteerin 1.1.1 Non-text Content säännöt tarkistavat, että kuvalla on alt-teksti; ne eivät pysty päättelemään, että alt="IMG_2041.jpg" on hyödytön sille, joka ei näe kuvaa.

Miten tuloksia luetaan

Hylätty
Ainakin yksi tähän kriteeriin liittyvä automaattinen sääntö ei täyttynyt testatulla sivulla. Tämä on varma ongelma; saavutettavuustesti näyttää sen taustalla olevat elementit ja sivut.
Tarkistettava
Automaattinen tarkistus merkitsi jotain, mitä se ei pystynyt ratkaisemaan, kuten liukuvärin päällä olevan tekstin kontrastin. Ihmisen on katsottava elementti.
Ei automaattisia virheitä
Ainakin yksi kriteeriin liittyvä axe-coren sääntö ajettiin ja läpäistiin. Tämä ei ole vaatimustenmukaisuus: säännöt kattavat vain osan siitä, mitä kriteeri edellyttää.
Ei testattavaa
Kriteerille on automaattisia sääntöjä, mutta testatuilla sivuilla ei ollut niille mitään tarkistettavaa, esimerkiksi ei videota tekstityssäännöille tai ei lomakkeita nimiösäännöille. Testaa se käsin, jos sivustollasi on tällaista sisältöä muualla.
Manuaalinen tarkistus
Mikään automaattinen sääntö ei kata tätä kriteeriä, joten skannaus ei kerro siitä mitään suuntaan tai toiseen. Testaa se käsin.
A-taso ja AA-taso
A-taso on vähimmäistaso. WCAG:hen viittaavat säännökset ja linjaukset mainitsevat yleensä AA-tason, joka sisältää jokaisen A-tason kriteerin.

Miten yleisimmät ongelmat korjataan

  • 4.1.2 Name, Role, Value hylätty

    Mukautetut säätimet, jotka on rakennettu div- tai span-elementeistä (valikot, välilehdet, haitarit, kytkimet), eivät kerro avustavalle teknologialle, mitä ne ovat tai ovatko ne auki. Käytä mahdollisuuksien mukaan natiivia <button>-elementtiä, anna sille nimi ja aseta aria-expanded tai aria-pressed, jotta sen tila luetaan ääneen.

  • 1.3.1 Info and Relationships hylätty

    Rakenteen on oltava merkintäkoodissa, ei pelkästään tyyleissä. Käytä lihavoitujen kappaleiden sijaan oikeita h2- ja h3-elementtejä, luetteloille ul- tai ol-elementtejä, taulukon otsakkeille th-elementtejä scope-attribuutin kanssa ja lomakekenttien ryhmille nimiöitä tai fieldset-elementtiä legend-elementin kanssa.

  • 3.1.1 Language of Page hylätty

    Lisää html-elementtiin lang-attribuutti, esimerkiksi <html lang="en">. WordPress-teemat tulostavat sen yleensä language_attributes()-funktiolla; Shopify-teemassa käytä tiedostossa layout/theme.liquid koodia <html lang="{{ request.locale.iso_code }}">.

  • 2.5.8 Target Size (Minimum) hylätty

    Pieniin kuvakkeisiin ja tiiviisti asetettuihin linkkeihin on vaikea osua sormella. Tee jokaisesta kohteesta vähintään 24 × 24 CSS-pikseliä tai sijoita pienet kohteet niin, että kunkin keskelle asetettu 24 px:n ympyrä ei osu toiseen kohteeseen. Täyte (padding) suurentaa kohdetta muuttamatta kuvaketta.

  • Manuaalisten tarkistusten läpikäynti

    Aloita nopeista. Kriteeriä 1.4.10 Reflow varten zoomaa 1280 px leveä selainikkuna 400 %:iin ja tarkista, ettei mikään vaadi vaakasuuntaista vieritystä. Kriteerejä 2.4.7 ja 2.4.11 varten käy sivu läpi Tab-näppäimellä ja tarkista, että fokus näkyy aina eikä jää koskaan kiinteän ylätunnisteen tai evästebannerin alle. Kriteeriä 3.3.1 varten lähetä lomake virheellisillä tiedoilla ja katso, kuvataanko virheet selkeästi tekstinä.

Kysymyksiä tästä työkalusta

Mitä WCAG 2.2 muutti A- ja AA-tasoilla?

Kuusi kriteeriä lisättiin: 2.4.11 Focus Not Obscured (Minimum), 2.5.7 Dragging Movements, 2.5.8 Target Size (Minimum), 3.2.6 Consistent Help, 3.3.7 Redundant Entry ja 3.3.8 Accessible Authentication (Minimum). WCAG 2.2 lisää myös kolme AAA-tason kriteeriä ja poistaa kriteerin 4.1.1 Parsing.

Miksi 4.1.1 Parsing ei ole luettelossa?

WCAG 2.2 merkitsee kriteerin 4.1.1 Parsing vanhentuneeksi ja poistaa sen, koska selaimet ja avustavat teknologiat eivät enää ole riippuvaisia sen kattamista merkintävirheistä. W3C:n mukaan WCAG 2.0:ssa ja 2.1:ssä sen katsotaan nyt aina täyttyvän HTML-sisällön osalta.

Kattaako WCAG 2.2:n täyttäminen myös WCAG 2.1:n?

Kyllä. WCAG 2.2 on taaksepäin yhteensopiva: sisältö, joka on 2.2:n mukainen, on myös 2.1:n ja 2.0:n mukainen. Testaus 2.2:ta vasten kattaa siis myös vanhemmat versiot, joihin monet säännökset ja linjaukset yhä viittaavat.

Voinko käyttää tätä saavutettavuusselosteen tai VPAT-raportin laatimiseen?

Se on lähtökohta, ei vaatimustenmukaisuusraportti. Seloste tai VPAT edellyttää, että jokainen kriteeri arvioidaan, useimmat niistä ihmisen toimesta; luettelot ”Manuaalinen tarkistus” (Manual check) ja ”Tarkistettava” näyttävät, mitkä sitä vielä vaativat.

Miksi niin monen kriteerin tilana on ”Manuaalinen tarkistus”?

Koska niille ei ole automaattista sääntöä. Kysymykset siitä, voiko aikarajaa pidentää, näkyykö ohje samassa paikassa jokaisella sivulla tai vaatiiko kirjautuminen muistitestin, riippuvat siitä, miten ihmiset käyttävät sivustoa, eivätkä merkintäkoodista, jonka sääntö voi lukea.

Saavutettavuusraportti ($174, kertamaksu) jatkaa täydestä ilmaisesta skannauksesta ja lisää sivuja, jokaisen havainnon vaatiman muutoksen, PDF-tiedoston ja uusintatestit korjaustesi varmistamiseen.

Lue lisää: Saavutettavuusraportti