Näppäimistösaavutettavuus

Näppäimistösaavutettavuus tarkoittaa, että jokainen käyttäjän sivulla suorittama toiminto voidaan tehdä pelkällä näppäimistöllä. Se on ehdottomin saavutettavuusvaatimus: ilman sitä mikään muu avustava teknologia ei toimi.

Näppäimistörajapinta on universaali rajapinta

Ruudunlukuohjelmat, kytkimet, puheohjaukseen perustuvat syöttölaitteet, silmänliikeohjaajat — kaikki verkon avustavat teknologiat kulkevat lopulta näppäimistökerroksen kautta. Käyttäjä, jolla ei ole motorisia rajoitteita, ei ehkä koskaan paina Tab-näppäintä, mutta saman sivuston on oltava täysin käytettävissä näppäimistöllä, jotta vammaiset käyttäjät voivat käyttää sitä.

Tämän vuoksi 2.1.1 Näppäimistö on tason A kriteeri: sen laiminlyöminen ei tee sivusta vaikeampaa — se tekee sivusta käyttökelvottoman kokonaisille käyttäjäjoukoille.

Mitä “näppäimistöllä operoitava” edellyttää

• Tab ja Shift+Tab siirtävät kohdistusta eteen- ja taaksepäin interaktiivisten elementtien välillä.
• Enter aktivoi linkit ja useimmat painikkeet.
• Space aktivoi painikkeet ja vaihtaa valintaruutujen/radiopainikkeiden tilan.
• Nuolinäppäimet navigoivat yhdistelmäwidgeteissä (välilehtipaneelit, valikot, radioryhmät, listaruudut, liukusäätimet).
• Escape sulkee modaalidialokit, ponnahdusikkunat ja pudotusvalikot.
• Page Up/Down, Home/End navigoivat pitkässä sisällössä, kun alustakonventio sitä edellyttää.

Widget, joka ei toteuta näppäimistösopimusta, jota ruudunlukuohjelman käyttäjä odottaa rooliltaan — esimerkiksi ARIA-yhdistelmäruutu, joka reagoi klikkauksiin mutta ei nuolinäppäimiin — on teknisesti kohdistettavissa mutta toiminnallisesti rikki.

Nopein manuaalinen auditointi

Tab-näppäintä painetaan sivun aivan ylhäältä (osoiterivin kohdistus, sitten Tab) alas jalkapalkkiin saakka. Tab-järjestyksen tulisi vastata visuaalista järjestystä. Jokaisen klikattavan elementin pitäisi saada kohdistus täsmälleen kerran. Enter tai Space kohdistetulla elementillä pitäisi tuottaa sama tulos kuin klikkaaminen. Escape modaalin sisällä pitäisi sulkea se. Jos jotain ei voi saavuttaa, jotain saavutetaan väärässä järjestyksessä tai jokin loukkaa kohdistuksen, löydät virheitä.

Viisi minuuttia kurinalaisella Tab-navigoinnilla löytää enemmän saavutettavuusongelmia kuin viisitoista minuuttia axe-core-skannauksella.

Yleisimmät virhekuviot

• <div onclick> klikattaville korteille. Ei kohdistettavissa, ei aktivoitavissa näppäimistöllä, täysin näkymätön ruudunlukuohjelmille interaktiivisena elementtinä. Käytä <button>-elementtiä (toiminnoille) tai <a href>-elementtiä (navigoinnille).
• Pudotusvalikot, jotka eivät avaudu Enter/Space-näppäimillä. Rakennettu pelkillä klikkauskäsittelijöillä; näppäimistökäyttäjät voivat kohdistaa käynnistimen mutta eivät avata listaa.
• Modaalidialokit, jotka eivät loukkaa kohdistusta. Tab siirtää kohdistuksen modaalin ulkopuolelle (visuaalisesti piilotetun) sivun taustalle. Käyttäjät eivät näe missä ovat.
• Modaalidialokit, jotka liiaksi loukkaavat kohdistusta. Escape ei sulje. Käyttäjä juuttuu paikalleen.
• Ohituslinkin kohde ei ole kohdistettavissa. Ohituslinkki hyppää #main-elementtiin, mutta <main id="main"> ei sisällä tabindex="-1"-attribuuttia, joten kohdistus ei siirry ja seuraava Tab aloittaa alusta sivun yläosasta.

Kaksi kirjastoa on syytä tuntea: focus-trap kohdistuksen hallintaan modaalien sisällä ja tabbable kohdistettavien elementtien löytämiseen kontainerin sisältä. Molemmat ovat pieniä ja ei-mielipiteellisiä.