Terug naar Artikelen

WAI-ARIA en toegankelijkheid

WAI-ARIA (voluit Web Accessibility Initiative - Accessible Rich Internet Applications) is een technische specificatie die beschrijft hoe de gebruiker de toegankelijkheid van dynamische webpagina's kan verbeteren. Met dynamiek worden hier combinaties van Ajax, HTML, JavaScript en andere gerelateerde technieken bedoeld. Lees hier wat WAI-ARIA is en hoe Stichting Accessibility hiermee omgaat tijdens een toetsing. Ook is het mogelijk om los van
een toetsing een test op gebruik van ARIA door ons te laten doen.

Wat is WAI-ARIA?

Er komen steeds meer dynamische web applicaties. Dergelijke applicaties wijken qua functionaliteit steeds verder af van wat er met HTML voorheen mogelijk was. Dit zorgt er bijvoorbeeld voor dat bepaalde HTML-elementen (met name DIV en SPAN) steeds vaker gebruikt worden om zelf geprogrammeerde knoppen of invoerelementen te plaatsen. 

Dit veroorzaakt toegankelijkheidsproblemen doordat hulpsoftware (zoals bijvoorbeeld een screenreader die de website probeert op te lezen) niet weet dat een zelf geprogrammeerde knop ook echt een knop is. Als een screenreader niet weet óf iets een knop is, zal deze dat ook niet melden aan de gebruiker en die weet vervolgens niet dat je met dat element kan interacteren.

WAI-ARIA (of ARIA) is een set aan extra attributen die dergelijke ontbrekende informatie kan melden aan hulpsoftware zoals screenreaders. Met een WAI-ARIA attribuut kan de rol van een element worden aangepast. Zo kan dan bijvoorbeeld een DIV element de rol "knop" krijgen, door het attribuut role="button" toe te voegen. Let wel:dit geeft alleen informatie, maar het geeft geen functionaliteit, die zal toegevoegd moeten worden met javascript.

Een introductie van WAI-ARIA is hier te vinden: https://www.w3.org/WAI/intro/aria
WAI-ARIA is ontwikkeld door het W3C en de volledige specificatie is hier te lezen:
 https://www.w3.org/TR/wai-aria/
De nieuwste versie van de specificaties is hier te lezen. Deze versie is nog in ontwikkeling: https://www.w3.org/TR/wai-aria-1.1/

Ondersteuning en goedkeuring

Een nieuwe standaard is één ding; hulpsoftware en browsers moeten wel weten wat deze extra attributen betekenen en hoe ze hiermee dienen om te gaan. Helaas gaat dat niet zo snel. Software moet worden aangepast, en als dat gebeurt is, moeten de software nog bij de gebruikers aankomen. In het geval van hulpsoftware zijn updates daarnaast soms erg kostbaar, waardoor gebruikers die minder snel zullen updaten dan bijvoorbeeld een browser.

Testen ARIA op aanvraag

Als een nieuwe standaard nog niet ondersteund wordt door breed beschikbare hulpsoftware en browsers dan heeft een gebruiker er in de praktijk vaak geen baat bij. Daarom is het mogelijk om door Stichting Accessibility op aanvraag een test te laten
uitvoeren van de gebruikte ARIA-attributen. De test is gebaseerd op de meest gebruikte browser – screen reader combinaties die zijn vastgesteld in de Screen reader survey 2017 van WebAim. Zie https://webaim.org/projects/screenreadersurvey7/#browsercombos

Wanneer het testresultaat positief is keuren we het gebruik van het ARIA-attribuut of -attributen om te voldoen aan dat specifieke succescriteria goed. Het testresultaat nemen we op in de lijst met geaccepteerde en niet geaccepteerde ARIA-attributen.

Wanneer we tijdens een onderzoek van een website ARIA-attributen tegenkomen die van belang zijn voor het voldoen aan de succescriteria van WCAG en die niet in bovengenoemde lijst voor komen, zullen we deze eveneens testen en op basis daarvan goed- of afkeuren. We ondersteunen u graag bij het vinden van een goede oplossing, wanneer blijkt dat de gebruikte ARIA-attributen niet genoeg ondersteund worden of niet correct gebruikt worden.

De rest van de ARIA-attributen keuren we alleen goed als er niet op geleund wordt. Dat betekent dat dit wel gebruikt mag worden om de toegankelijkheid van de website te verbeteren maar de website moet ook nog goed toegankelijk zijn wanneer het wegvalt. Bijvoorbeeld: het aria-selected attribuut zou kunnen worden gebruikt om aan te geven dat een bepaalde tabblad geselecteerd is. Echter aangezien dit nog niet door alle hulpsoftware voldoende ondersteund is mag hier niet op geleund worden. Dit betekent dat, hoewel aria-selected mag worden gebruikt in dit geval om de toegankelijkheid van de website te verbeteren, er ook gebruik moet zijn gemaakt van bijvoorbeeld een header of onzichtbare tekst om duidelijk te maken welk tabblad geselecteerd is.

Lijst van ondersteunde ARIA attributen

Hieronder staat de lijst met aria attributen die goed gecommuniceerd worden door hulpsoftware en waar dus op geleund kan worden om aan bepaalde succescriteria te voldoen:

  • aria-autocomplete
  • aria-checked (state)
  • aria-describedby
  • aria-describedby
  • aria-disabled (state)
  • aria-expanded (state)
  • aria-hidden (state)
  • aria-invalid (state)
  • aria-label
  • aria-labelledby
  • aria-level
  • aria-multiline
  • aria-multiselectable
  • aria-readonly
  • aria-required
  • role (gedeeltelijk)

Hieronder staat een lijst van verschillende waardes binnen het role attribuut die goed gecommuniceerd worden door hulpsoftware en waar dus op geleund kan worden om aan bepaalde succescriteria te voldoen:

  • article
  • banner
  • button
  • cell
  • checkbox
  • columnheader rowheader
  • combobox
  • complementary
  • contentinfo
  • definition
  • dialog
  • document
  • figure
  • form
  • group
  • heading
  • img
  • link
  • list
  • listbox
  • listitem
  • main
  • math
  • menu
  • menuitem
  • menuitemcheckbox
  • menuitemradio
  • navigation
  • option
  • progressbar
  • radio
  • region
  • row
  • rowgroup
  • searchbox
  • separator
  • slider
  • spinbutton
  • status
  • table
  • textbox
Tags:
Categorie:
Kennisbank
  • Delen op Facebook
  • Delen op Twitter
  • Delen op LinkedIn