2.4.11 Fokus inte dolt AA
För personer som använder tangentbordet för att navigera på en webbplats är det viktigt att tydligt kunna se vad som är i fokus. Detta för att användaren ska kunna se var hen befinner sig på sidan och vilka objekt som går att interagera med. Objektet som är i fokus får inte vara dolt. Riktlinjen tillåter att objektet som är i fokus är delvis dolt av annat innehåll. Man bör dock tänka på att ju mer av objektet som är dolt desto svårare blir det för användaren att använda webbplatsen.
Exempel på innehåll som kan dölja fokus
Situationer där innehåll kan bli dolt är när informationsrutor, sidhuvud, menyer eller chattfönster överlappar innehållet på sidan. Om fokus går att flytta till ett element som inte syns bakom överlappande rutor, är det inte godkänt.
Undantag
Delvis genomskinliga rutor
Om en överlappande ruta är delvis genomskinlig och täcker ett fokuserbart element så räknas den inte som helt dold om man kan se fokusobjektet igenom. Kontrollera dock att detta inte bryter mot riktlinje 1.4.11 Kontrast för grafik.
Innehåll som kan flyttas på av användare
Ibland kan en webbplats ha innehåll som kan flyttas av en användare. Exempel på flyttbart innehåll kan vara verktygsfält, paneler eller redigeringsytor. Detta gör att användare själva kan flytta innehåll som kan leda till att fokus döljs. Vid situationer där flyttbart innehåll finns är kravet endast att innehållets startposition inte döljer fokus.
Tillfälligt utfällbart innehåll
Ibland finns det tillfälligt utfällbart innehåll på en webbsida. Det innebär att nytt innehåll visas när en användare exempelvis klickar på en knapp. Sådant innehåll är menat att användaren direkt ska använda genom att exempelvis göra ett val, och ska inte stanna kvar som utfällt. Exempel på tillfälligt utfällbart innehåll är menyer, alternativlistor och datumväljare. Det utfällbara innehållet kan ofta täcka fokuserbara objekt. Detta är tillåtet om innehållet fälls ihop efter att användaren antingen gjort ett val, eller flyttat fokus bort från det nya innehållet.
Bestående utfällbart innehåll
När en användare klickar på en knapp, kan nytt innehåll visas, som finns synligt tills användaren klickar på knappen igen. Detta till skillnad från tillfälligt utfällbart innehåll kan detta innehåll förbli utfällt även när fokus är utanför det. Exempel på sådant innehåll kan vara så kallade dragspel (“accordion”) eller chattfönster. Bestående utfällbart innehåll får inte dölja fokus.
Lösningsförslag
- Flytta övrigt innehåll när bestående utfällbart innehåll öppnas. Om man exempelvis öppnar ett dragspel, kan allt innehåll under detta flyttas ner, så att det placeras under dragspelsinnehållet.
- Öppna utfällbart innehåll till en sektion utan annat innehåll. Detta gör att det inte finns något att täcka när innehållet fälls ut.
- Fäll ihop tillfälligt utfällbart innehåll när fokus hamnar utanför det, eller när ett val har gjorts. När användaren har interagerat med innehållet, behöver det inte fortsätta visas.
- Se till att initial placering av innehåll inte överlappar annat innehåll.
Läs mer om riktlinje 2.4.11 på W3C webbplats