Rekommendationer för tillgängligt popup-innehållLänk hit

• Överväg att presentera innehållet på något annat sätt.
• Gör det enkelt att ta bort innehållet.
• Gör det möjligt att hantera innehållet för alla.

Överväg att presentera innehållet på något annat sättLänk hit

Det finns ibland mer förutsägbara och tillgängliga sätt att presentera samma information eller funktionalitet. Till exempel genom att länka till en annan sida.

Om ni ändå väljer att ha den här typen av innehåll så tänk på följande:

Gör det enkelt att ta bort innehålletLänk hit

Innehållet måste gå att avvisa, så att det inte stör eller blockerar sidans ursprungliga innehåll. Det går att lösa till exempel 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 om det går.

Gör det möjligt att hantera innehållet för allaLänk hit

Muspekare måste kunna flyttas: I vissa fall, till exempel om användaren har förstorat själva muspekaren kan denna skymma innehållet i en inforuta. Av den anledningen behöver det gå att föra muspekaren även över det innehåll som presenteras dynamiskt, utan att det försvinner, se exempel nedan.

Ge även användare tillräckligt med tid för att de ska kunna ta till sig och uppfatta innehållet efter att det har blivit synligt. En användare kanske måste ändra förstoringen eller tar tid på sig för att förflytta sig dit.

Innehållet ska vara synligt tills:

• Användaren tar bort muspekaren eller byter tangentbordsfokus från innehållet eller det som utlöste händelsen.
• Användaren avfärdar innehållet genom ett tangentbordskommando eller stänga-knapp, se ovan.
• Informationen inte längre är giltigt, till exempel ett meddelande om att “servern är upptagen”.

Riktlinjen gäller inte i de fall användaren själv styr över när innehållet visas eller inte, till exempel när webbläsaren visar title-attributet i HTML som ett tooltip. Modala fönster är också undantagna eftersom de inte visas och triggas av att muspekaren förs över eller vid tangentbordsfokus. Se även WCAG 3.2.1 Vid fokus.

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

Utdrag från WCAG-standardenLänk hit

Riktlinje 1.4 Urskiljbart: Gör det enklare för användare att se och höra innehåll, bland annat genom att skilja förgrund från bakgrund.

1.4.13: Content on Hover or Focus: Where receiving and then removing pointer hover or keyboard focus triggers additional content to become visible and then hidden, the following are true:

Dismissable
A mechanism is available to dismiss the additional content without moving pointer hover or keyboard focus, unless the additional content communicates an input error or does not obscure or replace other content;

Hoverable
If pointer hover can trigger the additional content, then the pointer can be moved over the additional content without the additional content disappearing;

Persistent
The additional content remains visible until the hover or focus trigger is removed, the user dismisses it, or its information is no longer valid.

Exception: The visual presentation of the additional content is controlled by the user agent and is not modified by the author. (Nivå AA)

TeminologiLänk hit

Mouseover eller hover är när muspekaren flyttas över en triggerpunkt, ett objekt eller ett teckenavsnitt och utlöser en händelse såsom att byta bild eller visa adressen till en länk (ofta längst ner i webbläsaren).

Inforuta, på engelska tooltip, är en ruta med text som visas när muspekaren förs över ett område. Det kan till exempel röra sig om hjälprutor.

En modal eller en dialogruta, på engelska dialog box, är ett fönster som öppnas ovanpå användargränssnittet och hindrar annan interaktion. De innehåller ofta ett felmeddelande eller information som användaren behöver ta ställning till genom att avbryta eller stänga fönstret. Termen lightbox förekommer även.

Pop-up window, pop-under window, eller extrafönster, har ett begränsat antal funktioner som öppnas ovanpå eller under ett redan öppnat fönster. De ligger ofta kvar tills de stängs manuellt, men kräver ofta ingen åtgärd av användaren.