This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung
Dostopnost
Kaj res izstopa?
Fokusni okvir prikazuje uporabnike tipkovnice, kje so. Raven AA (2.4.7) zahteva le, da je vidna; tanki, bledi okvir to izpolnjuje. Merilo ravni AAA 2.4.13 določa ukrepe: Fokalni okvir obdaja element s črto debeline vsaj 2 CSS pikslov, območje, ki se spreminja v fokusu, pa ima kontrast najmanj 3:1 med osredotočenimi in neosredotočenimi stanji.
Kaj zahteva merilo
Dva ukrepa, oba merljiva. prvič, območje: žariščni okvir je okrog elementa vsaj tako velik kot debeli obris z debelimi 2 pikama; Samo podčrtaj ali okvir z eno piko ni dovolj. Drugič, kontrast: pikse, ki se spreminjajo v fokusu, se od stanja brez fokusa razlikujejo za vsaj 3:1. Skozi pade temno moder okvir na temnomodri gumb, obstoji bel okvir s temnim robom na vsakem ozadju.
Okvir, ki deluje na vsakem ozadju
Ker so gumbi lahko svetli in temni, je uspešen dvobarvni fokus: obris 2 piksli v drzni barvi z 2 piksli oddaljenost od elementa (outline-offset) in dodatno senco v nasprotni barvi. Tako se kontrast ohranja na lahkih in temnih površinah. Privzeta fokus brskalnika je pogosto pretanek ali pa je odstranjen iz slogovne predloge z obrisom: ni; Ta prepoved je najpogostejši razlog za nevidno osredotočenost.
Tako se soočamo s tem
Meritev usmeri vsak kontrolni element, primerja pikse pred in po fokusu ter meri debelino in kontrast spremembe. Tako je merilo v celoti samodejno preskušeno; preskus ravni AA (vidno ostrenje) zagotavlja enake podatke. Merilo spada v kategorijo AAA po znanju; v poročilu, debelina in kontrast glede na referenco.
Primeri
Tanek, bled fokalni okvir
:focus-visible { outline: 1px dotted #cccccc; }:focus-visible {
outline: 3px solid #1a5fb4;
outline-offset: 2px;
box-shadow: 0 0 0 5px #ffffff;
}Najmanj 2 piksli obrisa, spremenjene pikse pa se od neosredotočenega stanja razlikujejo po 3:1. Bela senca ohranja kontrast na temnih površinah.
- Odstrani vsak obris: nobenega iz slogovne predloge, ki ne definira takoj lastnega fokusa.
- Opredelite globalni fokus z:fokus-vidljivo: obris 3 pikslov, obris-offset 2 pikslov, v barvi 3:1 na ozadju.
- V nasprotni barvi dodamo senco, tako da okvir ostane viden na svetlih in temnih površinah.
- Pojdi skozi stran s tipko zavihka in preverite vsako stanje: meni, gumbe, polja, povezave v besedilu.
