Ingen tangentbordsfälla
Om tangentbordsfokus kan flytta till en komponent måste fokus även kunna flytta bort från den med enbart tangentbord. Modaler, inbäddade resurser och anpassade widgetar är de vanliga syndarna.
Vad det kräver
Om en användare kan trycka Tab in i en komponent måste de också kunna trycka Tab (eller Skift+Tab, eller använda en annan dokumenterad tangent) ut ur den utan att ta upp musen. Om något mer än de vanliga pil-/Tab-tangenterna krävs för att lämna — till exempel Ctrl+M för att lämna en inbäddad videospelare — måste användaren informeras om det.
Detta skiljer sig från en fokusfälla inuti en modal, vilket är ett önskvärt mönster: en modal cirkulerar fokus inom sig själv men frigör fokus när användaren stänger den. En tangentbordsfälla är när det inte finns någon dokumenterad väg ut.
Hur du uppfyller det
- Inuti en modal dialog — cirkulera fokus mellan det första och sista fokusbara elementet med Tab och Skift+Tab, och stäng dialogen med Escape och återlämna fokus till utlösaren.
- För inbäddat tredjepartsinnehåll (videospelare, kartor, iframes från okänt ursprung) — testa om Tab fortsätter förbi det inbäddade innehållet. Om det inte gör det, dokumentera tangenten för att lämna i närheten av inbäddningen.
- För anpassade widgetar som konsumerar piltangenter (datumväljare, kombinationsrutor, trädvyer) — behåll Tab som universell utgång; blockera det aldrig.
- För draghandtag eller textredigerare som använder Tab för indragning — tillhandahåll ett dokumenterat alternativ (Escape för att frigöra, Ctrl+M för att lämna redigeringsläge) och visa det i gränssnittet.
Vanliga fel
- Modala dialoger som fångar fokus men inte stängs med Escape och inte exponerar en fokuserbar Stäng-knapp.
- Inbäddade PDF-visare, Flash-relikter och vissa Tableau-/Power BI-instrumentpaneler som slukar Tab på obestämd tid.
- Textredigerare (TinyMCE, CKEditor i äldre versioner) som fångar Tab för indragning och aldrig släpper.
- Anpassade kombinationsrutor där piltangenter rör sig genom alternativ men Tab inte gör något — användaren fastnar i inmatningsfältet.
- Cookie-banners med fokushantering som loopar utan att någonsin erbjuda fokus på Acceptera/Avvisa.
Automatiserade verktyg fångar sällan detta — axe och Lighthouse kan bara flagga misstänkta mönster. Manuell tangentbordstestning är den enda tillförlitliga kontrollen.
Varför det spelar roll
En tangentbordsfälla är ett av de allvarligaste tillgänglighetsfelen: användaren kan bokstavligen inte lämna den delen av sidan. En blind användare kan behöva ladda om, och förlorar då sin session och eventuella formulärdata. För många användare är detta det ögonblick de överger webbplatsen helt. Av alla WCAG-kriterier är detta det som är mest sannolikt att göra en sida rättsligt ohållbar — domstolar och tillsynsorgan behandlar tangentbordsfällor som ett tydligt hinder.