This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →
Barrierefreiheit
Zašto fokus tipkovnice mora biti vidljiv na web mjestu?
Fokus tipkovnice mora biti vidljiv jer inače korisnici tipkovnice slijepo upravljaju: bez vidljive oznake — obično obojene granice oko aktivnog elementa — nije jasno koji je element odabran i što Enter tipka u sljedećem trenutku pokreće. Mnogi dizajneri ukidaju tu granicu iz razloga estetike i tako blokiraju korisnike tipkovnice. WCAG kriterij 2.4.7 zahtijeva vidljiv prikaz fokusa.
Okvir fokusa je pokazivač miša tipkovnice
Korisnici miša vide gdje je njihov pokazivač. Korisnici tipkovnice imaju za to okvir fokusa: on se kreće sljedećem elementu sa svakim pritiskom tabulatorna tipka i pokazuje što Enter tipka pokreće. Ako ovaj okvir nestane, korištenje postaje nagađanje — kao korištenje miša s nevidljivim pokazivačem. Najčešće je razlog jedna linija u smjernicama za oblikovanje koja gasi standardnu granicu preglednika jer se smatra smetnjom. Pravo rješenje nikada nije uklanjanje, već oblikovanje: okvir u boji vaše tvrtke, dovoljno jasan da se vidi na svakoj pozadini.
Kako služba za provjeru mjeri vidljivost fokusa usporedbom piksela
Služba za provjeru fotografira svaki provjeravani kontrolni element dva puta: jednom bez, jednom s fokusom. Zatim uspoređuje oba snimka piksela za piskselom. Ako fokus promijeni manje od 0,2 posto piksela oko elementa, prikaz fokusa je praktički nevidljiv — kriterij se smatra prekršajem i izvještaj imenuje dotični element i priloženu snimku zaslona. Nerjedovita okruženja, npr. zbog animacija, mjera prepoznaje prethodnom usporedbom dva snimka bez fokusa i uklanja takve elemente iz ocjenjivanja. Dodatno, izvještaj napominje ako smjernice za oblikovanje gase okvire fokusa u paušalnom iznosu.
Beispiele
Fokusrahmen entfernt
*:focus { outline: none; }:focus-visible { outline: 3px solid #1a5fb4; outline-offset: 2px; }outline: none macht die Tastaturbedienung blind. :focus-visible zeigt den Rahmen nur bei Tastatur, nicht beim Mausklick.
- Tabulirajte kroz vašu početnu stranicu i promatrajte: je li na svakom staju jasno vidljivo koji je element odabran?
- Zamolite svoju agenciju da ukloni svako pravilo koje paušalno gasi granicu fokusa.
- Dozvolite oblikovanu granicu fokusa u boji vaše tvrtke — dovoljno jarka za svijetle i tamne pozadine.
- Provjerite fokus i na slikama i obojenim površinama — tanka siva granica može brzo nestati.