Vid fokus

Vad det kräver

Att ta emot fokus får aldrig utlösa en “kontextändring”. WCAG definierar en kontextändring som: navigering till en ny sida, öppnande av ett nytt fönster, förflyttning av fokus till en annan komponent eller väsentlig omstrukturering av sidinnehållet. Fokus är tangentbordsmotsvarigheten till att flytta musen över ett element — det måste förbli passivt.

Användaren måste styra kontextändringar genom avsiktlig aktivering: trycka på en knapp, slå Enter på en länk, skicka ett formulär.

Hur man uppfyller det

• Anropa aldrig window.open, location.href = … eller form.submit() från en focus-händelsehanterare.
• Tooltips och små avslöjanden vid fokus är fine — de utgör ingen kontextändring. Stora innehållsbyten gör det.
• För autocompletar-förslag innebär det inte ett brott mot detta framgångskriterium att flytta fokus till ett alternativ, så länge förslagslistan i sig är förväntat beteende.
• Om ytterligare gränssnitt måste visas när ett element fokuseras (t.ex. hjälptext för inmatningsfält), håll det intilliggande och icke-störande.
• Testa med tangentbordet: Tabba igenom varje interaktivt element. Allt som “hoppar” eller auto-skickar vid fokus är ett fel.

Vanliga fel

• En rullgardinsmeny som auto-skickar när ett alternativ tar emot fokus via piltangenter.
• Tabb-fokus på en länk som utlöser omedelbar navigering via en onfocus-hanterare.
• Datumväljare som stänger sig i samma ögonblick som nästa fält tar emot fokus, innan användaren hunnit klart.
• Inloggningsformulär som auto-skickar när lösenordsfältet fokuseras av en lösenordshanterare.

Varför det spelar roll

Tangentbordsanvändare navigerar genom att flytta fokus sekventiellt genom sidan. Om fokus utlöser en kontextändring hamnar användaren plötsligt på ett ställe de inte avsåg — och för skärmläsaranvändare är detta desorienterade eftersom annonseringskön plötsligt skiftar. Regeln är enkel: fokus orienterar, aktivering agerar.