Liigu põhisisu juurde
Ligipääsetavuse labor

4.2 · Kogemus

Klaviatuuriga liikumine

Pane hiir käest kogu ülejäänud lehe ajaks. Kõik allolev peab olema viie klahviga leitav, nähtav ja kasutatav.

Viis klahvi

  • TabLiigu järgmise fokuseeritava elemendi juurde.
  • Shift + TabLiigu tagasi.
  • EnterAktiveeri link või nupp.
  • SpaceAktiveeri nupp, märgi märkeruut, keri lehte.
  • EscapeSulge dialoog, menüü või hüpikaken.

Ainult hiirega vs klaviatuuriga kasutatav

Ligipääsmatu
Salvesta (div koos onclick)

Proovi jõuda selleni tabiga. Ei saa: see pole fokuseeritav, sellel pole rolli ja see eirab Enterit ja tühikut.

Ligipääsetav

Fokuseeritav, loetakse nupuna, reageerib Enterile ja tühikule ning näitab nähtavat fookusrõngast.

Aktiveerimisi: 0

Fookuse stiilid

outline: none

Liigu tabiga siia. Kus sa oled?

Nähtav fookusnäidik

Nüüd liigu tabiga siia. Ilmselge.

Ära kunagi eemalda kontuuri

Kui vaikimisi rõngas on kole, asenda see — 3px kontuur 2px nihkega või tugev box-shadow. WCAG 2.2 nõuab, et fookus oleks nähtav ja mitte varjatud.

Klaviatuurilõksud

Fookuse hoidmine õigesti

Dialoog peab hoidma fookust sees, kuni see on avatud — ja alati laskma Escape'iga välja. See on hoidmine, mitte lõks.

Lõks on komponent, kuhu saab tabiga sisse, aga mitte välja — kohandatud vidin, mis neelab Tabi, või modaal ilma Escape'i käsitlust. Lahendus on hoidmine koos Escape'iga.

Miks hea näide on parem

  • Loomulikel elementidel on fokuseeritavus, rollid ja klahvikäsitlus juba olemas.
  • Nähtav fookusrõngas näitab nägijale klaviatuurikasutajale, kus ta on.
  • Escape ja etteaimatav Tab-järjekord tähendavad, et keegi ei jää kinni.

Mõju ligipääsetavusele

Motoorse häirega kasutajad
Paljud kasutavad ainult klaviatuuri või lülitit; hiir ei ole valik.
Ekraanilugeja kasutajad
Liiguvad definitsiooni järgi klaviatuuriga.
Kogenud kasutajad
Klaviatuuriga on kõigil lihtsalt kiirem.

Praktiline järeldus

Ühenda hiir lahti ja tee oma põhiülesanne läbi. Mida sa ei suuda, on viga.

WCAG 2.2
2.1.1 Keyboard, 2.1.2 No Keyboard Trap, 2.4.7 Focus Visible, 2.4.11 Focus Not Obscured

Seotud nõuded

EN 301 549 punktid: 9.2.1.1, 11.2.1.1

See õppetükk avab enesehindamise ala — vaata järgmisena üle oma leht või materjalid.

Vaata üle — Klaviatuuri kasutus

Kas said õppetüki läbi? Märgi see ära, et õpitee oleks ajakohane.