Nieuw in WCAG 2.1
Succescriterium 1.4.13 Content bij hover of focus
Wanneer aanvullende content zichtbaar wordt en daarna weer verborgen, door het gebruik van hover met de aanwijzer of focus met het toetsenbord, gelden de volgende zaken:
- Sluiten: Er is een mechanisme beschikbaar waarmee de aanvullende content kan worden gesloten zonder de aanwijzer hover of de toetsenbordfocus te verplaatsen, tenzij de aanvullende content een invoerfout communiceert of andere content niet verbergt of vervangt;
- Aanwijsbaar: Wanneer een aanwijzer hover aanvullende content kan activeren, dan kan de aanwijzer over de aanvullende content worden bewogen zonder dat deze verdwijnt;
- Aanhouden: De aanvullende content blijft zichtbaar totdat de oorzaak voor de hover of focus is verwijderd, de gebruiker de content sluit of de informatie niet langer geldig is.
Uitzondering: De visuele weergave van de aanvullende content wordt beheerd door de user agent en is niet aangepast door de auteur.
Content bij hover of focus begrijpen (Engelstalig)
Als je met je muis over een element beweegt of het de toetsenbordfocus geeft, dan verschijnt er soms wat aanvullende content. Bijvoorbeeld een subnavigatie of een tooltip. Deze tijdelijke content moet makkelijk te sluiten, te bereiken en lang genoeg zichtbaar zijn.
Als er aanvullende content verschijnt bij hover of focus, dan moet het aan drie voorwaarden voldoen:
- Te sluiten: De gebruiker moet de content kunnen sluiten zonder de muis of focus te verplaatsen
- Bereikbaar: Als de content verschijnt bij muishover, dan moet de gebruiker er met de muis ook overheen kunnen gaan
- Blijvend: De content moet zichtbaar blijven tot de gebruiker de hover of focus weghaalt, de content sluit, of de informatie niet meer geldig is
Uitzonderingen:
- Aanvullende content die geen andere content bedekt
- Browser-gecontroleerde tooltips (
title-attributen)
Hoe pas je dit toe?
- Zorg dat aanvullende content die verschijnt bij hover of focus kan worden benadert, gebruikt en worden gesloten.
Handige tips
- Bied een manier om aanvullende content te sluiten zonder de muis of focus te bewegen (bijvoorbeeld met de Esc-toets)
Voor wie is dit belangrijk?
- Mensen die alleen het toetsenbord gebruiken.
- Mensen die een fysieke of motorische beperking hebben.
- Mensen die een visuele beperking hebben.
- Mensen die een cognitieve, taal- of leerbeperking hebben.
Wie is verantwoordelijk?
- Ontwikkelaar
Hoe toets je dit?
Testprocedure
- Inventariseer de pagina met een muis en toetsenbord:
- Beweeg systematisch met de muis over elementen en bepaal waar extra content verschijnt bij hover
- Navigeer met Tab-toets door de pagina en bepaal waar extra inhoud verschijnt bij focus
- Bepaal welke soorten extra content aanwezig zijn:
- Custom tooltips
- Uitklapmenu’s
- Submenu’s
- Pop-ups (niet-modaal)
- Chatwidgets
- Berichtenpanelen
- Herlaad de pagina
- Controleer voor elke extra content bij hover of focus:
- Of de extra content zichtbaar blijft totdat hover/focus wordt weggenomen, de gebruiker het weghaalt, of de informatie ongeldig wordt
- Of de extra inhoud kan worden weggehaald zonder hover/focus te verplaatsen via:
- Escape-toets
- Enter-toets
- Klikken op het oorspronkelijke element
- Bij content die door hover verschijnt: of de muis over de extra content kan bewegen zonder dat deze verdwijnt
Beoordeling
- Aanvullende content die bij hover of focus verschijnt moet gesloten kunnen worden zonder het verplaatsen van de hover of focus.