Hoe zit het met toegankelijkheid en WAI-ARIA?

Toegankelijkheidsproblemen door dynamische webapplicaties

Waarom De hoeveelheid dynamische webapplicaties groeit enorm. Met dynamische webapplicaties bedoelen we combinaties van Ajax, html, JavaScript en andere gerelateerde technieken. Op het gebied van functionaliteit worden de verschillen tussen deze webapplicaties en 'alleen html' steeds groter. Dat zorgt ervoor dat bepaalde html-elementen (met name 'div' en 'span') vaker gebruikt worden om zelf geprogrammeerde knoppen of invoerelementen te plaatsen. Daardoor ontstaan toegankelijkheidsproblemen, want hulpsoftware zoals screenreaders herkennen een zelfgeprogrammeerde knop dan niet meer als knop. En dus weet een blinde gebruiker dan niet dat je met dit element kunt interacteren.

Wat is WAI-ARIA?

WAI-ARIA is een set aan extra attributen die dit soort ontbrekende informatie kan melden aan hulpsoftware, zoals screenreaders. Een WAI-ARIA attribuut zorgt ervoor dat de rol van het element wordt aangepast. In dit voorbeeld krijgt het 'div'-element de rol van 'knop', door het attribuut role="button" toe te voegen. Dit attribuut geeft alleen informatie, geen functionaliteit. Die moet worden toegevoegd met JavaScript.

Is software al klaar voor ARIA?

De toepassing van ARIA slaat een brug tussen dynamische webapplicaties en hulpsoftware en browsers. Maar dan moeten die wel de betekenis kennen van de extra attributen en weten hoe ze hiermee om moeten gaan. Dat betekent dat software hierop moet worden aangepast, en dat deze daarna nog moet worden geüpdatete door de gebruikers. Sommige updates zijn kostbaar, waardoor gebruikers ervoor kiezen om met de oude, niet ontvankelijke, hulpsoftware te werken.

Webapplicaties op ARIA laten testen

Stichting Accessibility helpt organisaties door de gebruikte ARIA-attributen in webapplicaties te testen. Op die manier weet een organisatie of de attributen ook daadwerkelijk aankomen en begrepen worden. In onze testmethode gebruiken we de meest gebruikte browser – screenreadercombinaties die zijn vastgesteld in de Screen Reader Survey 2017 van WebAim. 

Lijsten met goedgekeurde ARIA-attributen

Hier delen we de lijst met ARIA-attributen die goed begrepen worden door hulpsoftware. En die dus als basis kunnen dienen om aan bepaalde succescriteria te voldoen.

Goed begrepen ARIA-attributen

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)

Hier delen we een lijst van verschillende waardes binnen het role attribuut die goed gecommuniceerd worden door hulpsoftware. En die dus ook als basis kunnen dienen om aan bepaalde succescriteria te voldoen.

Goed gecommuniceerde waardes binnen role attribuut

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