Innehåll som visas vid hover eller fokus

Om riktlinjen

  • Innehåller lagkrav
  • EN 9.1.4.13
  • WCAG 1.4.13 (AA)

Område

Innehåll som dyker upp vid hover med muspekaren eller tangentbordsfokus ska kunna uppfattas av alla och ska gå att avvisa. Det gäller till exempel popup-funktioner.

Därför ska innehåll som visas vid hover eller fokus kunna hanteras och uppfattas av alla

Innehåll som dyker upp vid tangentbordsfokus eller när en person för muspekaren över (hovrar över) ett visst objekt ska kunna uppfattas och hanteras av alla. Det är särskilt viktigt att innehållet enkelt kan tas bort eller stängas.

Uppdykande innehåll kan annars orsaka problem, till exempel för att:

  • personen inte har aktiverat funktionen med avsikt,
  • personen inte blir medveten om att det har dykt upp nytt innehåll eller
  • det nya innehållet stör personens förmåga att genomföra en uppgift.

För personer som har förstorat muspekaren kan pekaren skymma innehållet i exempelvis en inforuta. Därför behöver det fungera att föra muspekaren över det innehåll som presenteras dynamiskt utan att det försvinner, se exempel nedan:

En informationsruta visas men personen har förstorat pekaren så att innehållet i rutan döljs av pekaren. När personen flyttar pekaren över inforutan blir texten synlig.

Det måste också ges tillräckligt med tid för att personer ska kunna uppfatta och ta till sig innehåll som presenteras dynamiskt. Exempelvis kan personer behöva ändra förstoringen eller behöva mer tid på sig för att förflytta sig på sidan.

Vad kräver lagen?

Det här gäller när innehåll visas vid hover eller fokus

  • Muspekaren måste kunna flyttas över innehållet.
  • Innehållet måste gå att avvisa, så att det inte stör eller blockerar sidans ursprungliga innehåll.
  • Innehållet ska gå att avvisa utan att flytta muspekare eller fokus.
  • Innehållet ska vara synligt tills:
    • Personen tar bort muspekaren eller byter tangentbordsfokus från innehållet eller det element som triggade innehållet.
    • Personen avfärdar innehållet, exempelvis genom ett tangentbordskommando.
    • Innehållet inte längre är giltigt, till exempel om meddelandet “servern är upptagen” blir inaktuellt.

Tänk på att allt innehåll, exempelvis det som triggas genom att muspekaren förs över en viss punkt, också ska kunna styras med hjälp av tangentbordet.

Undantag från lagkraven

Riktlinjen gäller inte i de fall användarprogrammet styr över presentationen av det uppdykande innehållet, till exempel när webbläsaren visar title-attributet i HTML som en inforuta.

Rekommendationer utöver lagkrav

Förutom lagkraven finns det rekommendationer som kan förbättra den digitala tillgängligheten:

Gör det enkelt att ta bort innehållet

En person kan enkelt avvisa innehåll om det exempelvis kan göras genom tangentbordskommandot Escape eller en Stäng-knapp.

Ofta går det även att göra så att ett nytt klick på samma position som öppnade innehållet även stänger det. Implementera gärna alla dessa varianter.

Så testar du innehåll som visas vid hover eller fokus

Kontrollera att allt uppdykande innehåll uppfyller kraven, även i små fönsterstorlekar som mobil vy eller vid förstoring.

Utdrag ur WCAG

WCAG 1.4.13 (AA) Innehåll vid hover eller fokus

För innehåll som visas och döljs när hover eller tangentbordsfokus flyttas till och från ett element, ska följande vara uppfyllt:

  • Innehållet som visas vid fokus eller hovring är möjligt att avvisa utan att flytta muspekaren eller tangentbordsfokus, förutom i de fall det uppdykande innehållet inte skymmer eller ersätter annat innehåll eller meddelar inmatningsfel.
  • Innehåll som visas vid hovring är möjligt att hovra över.
  • Innehåll som visas vid fokus eller hovring är beständigt tills hover eller fokus förflyttas, tills innehållet inte längre är giltigt eller tills användaren avfärdar innehållet.

Undantag: den visuella presentationen av det innehåll som läggs till styrs helt av användarprogrammet.

Originaltext på engelska: Success Criterion 1.4.13 Content on Hover or Focus (w3.org) Länk till annan webbplats.

Därför länkar vi till WCAG på svenska och engelska

Relaterade riktlinjer

All funktionalitet ska kunna användas med tangentbord

Hjälpte denna information dig?

Ditt svar hjälper oss att förbättra sidan

Senast uppdaterad: