ARIA (Accessible Rich Internet Applications) is een set attributen die je kunt toevoegen aan HTML-elementen om webcontent en -applicaties toegankelijker te maken, vooral dynamische inhoud en geavanceerde gebruikersinterfacebesturingselementen. De Authoring Practices Guide (APG) biedt richtlijnen over hoe je ARIA correct kunt gebruiken.
Wat is ARIA?
- ARIA biedt extra informatie aan ondersteunende technologieën die niet beschikbaar is in native HTML. Het helpt bij het definiëren van de rollen, toestanden en eigenschappen van aangepaste UI-componenten.
- Voorbeeld: Als je een aangepast dropdown-menu maakt met <div>-elementen, weet een schermlezer niet dat het een menu is. ARIA-attributen zoals role=“menu”, aria-haspopup=“true” en aria-expanded=“false/true” kunnen worden gebruikt om de functie en status ervan te beschrijven.
- Eerste regel van ARIA: De belangrijkste regel is: als een native HTML-element al de toegankelijkheidsfuncties heeft die je nodig hebt, gebruik het dan in plaats van een aangepast component met ARIA te maken. Gebruik bijvoorbeeld een <button>-element in plaats van een <div> met role=“button”.
Wat is de APG?
- De APG (Authoring Practices Guide) is een hulpbron van het W3C die ontwerppatronen en codevoorbeelden biedt voor het maken van toegankelijke webcomponenten.
- Het demonstreert hoe je ARIA correct kunt implementeren voor veelvoorkomende widgets zoals accordeons, schuifregelaars, tabbladen en modals.
- De APG is een essentiële gids voor ontwikkelaars om ervoor te zorgen dat hun aangepaste componenten bruikbaar zijn voor mensen die afhankelijk zijn van ondersteunende technologieën.