Tastaturfokus må aldrig sidde fast

En tastaturfælde stopper kunden fuldstændigt: Når fokus først sidder fast i en widget som en videoafspiller, et chatvindue eller et indlejret betalingsfelt, kan kunden hverken nå resten af siden eller knappen til kassen, og den eneste udvej er at forlade webshoppen.

Regel-id
vs-keyboard-trap
Kilde
Validiscan-kontrol
Alvorlighed
Kritisk
Rettelsesniveau
MANUAL
på Shopify, Shopware, WooCommerce og Magento
Status
køres

Hvad kontrollen gør

Følger Tab-rækkefølgen og finder løkker og blindgyder, hvor tastaturfokus ikke kan komme videre fra eller ud af en komponent (2.1.2).

Kontrollen sorterer de synlige elementer, der kan nås med tastaturet, i tab-rækkefølge: først positive tabindex-værdier i stigende orden, derefter dokumentrækkefølgen. Den giver fokus til det første element, der tager imod det, og trykker derefter på Tab op til 200 gange. Forlader fokus dokumentet, eller slipper trykkene op, rapporteres intet.

En stilstand er, at fokus bliver stående på det samme element i 8 tryk i træk. Ved et iframe, object eller embed flytter kontrollen fokus forbi elementet efter 3 tryk, så fælder inde i det ikke bliver rapporteret. En løkke er, at fokus vender tilbage til et element, der allerede er besøgt. En løkke, der indeholder det element, som fik fokus først, og enten det sidste tabstop eller mindst 80 % af tabstoppene, regnes som et fuldt gennemløb. Andre løkker rapporteres på deres nærmeste fælles container.

Derefter trykker kontrollen på Escape og Tab. En fælde, hvor Escape sætter fokus fri, eller enhver fælde inde i et dialog-element eller et element med role="dialog", role="alertdialog" eller aria-modal="true", får resultatet »kræver gennemgang«, som scanneren i dag ikke laver fund af. Shift+Tab testes ikke.

Sådan retter du det

Find den komponent, der fanger fokus (ofte en widget fra en tredjepart eller en specialbygget modal), og sørg for, at Tab og Shift+Tab kan forlade den, eller at Escape lukker den og sender fokus tilbage til siden. Gå hele forløbet igennem med tastaturet efter ændringen.

WCAG-succeskriterier

Afsnit i EN 301 549

Afsnittet i EN 301 549 for hvert kriterium, fordelt på versioner af standarden
WCAG-kriterium Version 3.2.1 Version 4.1.1
2.1.2 9.2.1.2 9.2.1.2

Begynd med et gratis tjek af din webshop.

Send din webshops adresse. Validiscan scanner den og svarer med hver fejl, scanningen kan påvise, med siden og koden.

Bestil et gratis tjek

Eller skriv til info@validiscan.com.

Hvad det gratis tjek omfatter, og hvad det udelader
Du sender
din webshops adresse
Sider, der scannes
op til 15
Du får
hver fejl, scanningen kan påvise, med siden og koden
På din webshop
kun offentlige sider; intet login, intet købt, ingen formularer sendt
Hvad det ikke er
et fuldt audit

Skriv til Validiscan

Til et gratis tjek skal du skrive din webshops adresse og platform.

Validiscan bruger det, du sender, til at svare dig. Privatlivspolitik