ARIA Roles Cheat Sheet: beste keuzes vergeleken

Door Niquelao Resource Desk · Bijgewerkt op 28 september 2026

Een aria-rollen-spiekbriefje is een referentie die de ARIA-rol toewijst aan het gelijkwaardige HTML-element, uw categorie (widget, oriëntatiepunt, structuur, live-regio of venster) en de eigenschappen en statussen die erbij horen. WAI-ARIA 1.2 definieert 82 rollen, en de meeste projecten hebben er slechts 15 tot 20 recurrent nodig. Dit is een vergelijking van de meeste beschikbare referenties in 2026 en en legt uit welke het beste is volgens je workflow.

Waarom een spiekbriefje voor ARIA-rollen nog steeds nodig is

Specificaties als WAI-ARIA 1.2 en de opvolger van WAI-ARIA 1.3 met documenten, bedoeld voor browserimplementaties en ondersteunende technologieën, niet voor iemand die op een dinsdagmiddag een formulier opbouwt. De eerste regel van ARIA -gebruik HTML-standaard die bestaat- lost de meeste gevallen op, maar er zijn patronen die geen native equivalent hebben: knoppen, kaarten, interactieve rasters, comboboxen met automatisch aanvullen, menu’s met submenu’s. Het is een van de vele referenties die je kunt bedenken, maar je kunt fouten vermijden.

De fout die steeds vaker voorkomt, is een rol die onnodig is. Een <button> met role="button" voegt niets toe en kan het native gedrag in sommige schermlezers verstoren. Een spiekbriefje wordt uitgelegd als rollen overbodig zijn op basiselementen, welke rollen vereist zijn voor JavaScript en welke attributen verplicht zijn voor optionele doeleinden.

De tweede fase is de verificatie. Er zijn tien rollen met betrekking tot de eigenschapsrelaties: aria-labelledby kan een id bereiken, aria-activedescendant vereist dat het gereferenceerde element bestaat en zichtbaar is, aria-owns is alleen gerechtvaardigd wanneer de DOM-volgorde niet overeenkomt met de visuele volgorde. Op een tabel die cruciaal is, worden de vereiste en verboden attributen gedetecteerd voordat een audit plaatsvindt.

Wat een goed spiekbriefje voor ARIA-rollen moet bevatten

Een aantal referenties is bedoeld om een aantal front-end-criteria te hanteren. De lijst is precies wat hij gebruikt om de vergelijkingsopties te evalueren.

**Dekking van alle vijf rolcategorieën. **WAI-ARIA groepeert rollen in samenvattingen, widgets, documentstructuur, oriëntatiepunten en liveregio’s. Samenvattingen (roletype, widget, input) worden in het raamwerk niet gebruikt; een goede verwijzing naar zichtbare vormgegevens.
Native HTML-equivalent voor de rol. Zonder deze kolom vraagt de referentie om ARIA daar te gebruiken zonder aan te raken.
Vereiste, ondersteunde en verboden attributen. role="checkbox" vereist aria-checked; role="heading" vereist aria-niveau; role="presentatie" is niet toegestaan.
Geassocieerd toetsenbordpatroon. Een rol zonder toetsenbeheer is een belofte. role="tablist" impliceert verschillende elementen/derecha, Home en End.
Doorzoekbaar formaat. Zoekfunctie, filter op categorie, specificatieversie en mogelijkheid om het codefragment te kopiëren.

Vergelijking: de meeste referenties van de rollen ARIA in 2026

Het volgende tabblad hervat de meer solide opties. Geen enkele is betaald; Het is mogelijk dat u de geactiveerde versie van de specifieke versie van de kubus activeert.

Gerelateerd: — Widget voor toegang met een gratis plan voor uw bedrijf.

Bron	Aanpak	Gedekte categorieën	Native equivalent	Toetsenbordpatroon	Ideaal voor
WAI-ARIA Authoring Practices Guide (APG), W3C	Volledige beschermheren met ejemplos	Widgets, oriëntatiepunten, structuur, liveregio’s	Ja, in elk patroon	Ja, gedetailleerd	Implementeer een widget concreet
MDN Web Docs, referenties van rollen ARIA	Per rol	Alles, inclusief abstracte rollen	Si	Partiaal	Raadpleeg een specifieke rol
ARIA Authoring Practices, lijst van rollen	Tabel rol → attributen	Widgets en structuur	Partiaal	Nee	Vereiste attributen verifiëren
Deque University, ARIA-referentie	Fiches met ondersteuningsnotities	Widgets en oriëntatiepunten	Si	Partiaal	Werkelijke ondersteuning per schermlezer kennen
A11Y Projectchecklist	Verificatielijst	Transversaal	Niet van toepassing	Nee	Controle vóór de publicatie
HTML-ARIA (W3C), gelijkwaardige tabel	Rol toestemming voor element	Alle	Ja, dat is het doel	Nee	Beslissen of ARIA noodzakelijk is

WAI-ARIA Authoring Practices Guide (APG)

De APG van W3C is de canonieke referentie voor patronen. Het huidige patroon omvat HTML-structuren, rollen, instellingen, toetsenbordinteractie en een functionele functionaliteit. Het punt is dat er geen limiet is aan de lijst met rollen: geef uitleg over de samenwerking. Het punt is dat het niet snel gaat; om te raadplegen “wat de kenmerken zijn van role="slider"” waarvan u de correspondent van de klant heeft.

APG groepeert de meest voorkomende widgetgebruikers: accordeon, waarschuwing, broodkruimel, knop, selectievakje, keuzelijst met invoervak, dialoog, openbaarmaking, feed, raster, koppeling, keuzelijst, menu, menubalk, keuzerondje, schuifregelaar, draaiknop, schakelaar, tabel, tabbladlijst, werkbalk, tooltip, rasterboom en boomweergave. Als uw project een van deze gebruikt, voert u deze hier uit.

MDN Web Docs: de referentie voor rol

MDN onderhoudt een pagina voor elke ARIA-rol, met de beschrijving, vereiste attributen, toegestane attributen, bijbehorende toegankelijkheidsproblemen en links naar de specificatie. Dit is de snelste optie als u weet wat u doet. Uw berichtgeving omvat abstracte rollen en rollen die in gebruik zijn, hoewel veel herinneringen zijn weggelaten.

Een kijkje waard: — Toegankelijkheidsbeheer: automatiseringscombinatie met menselijke herziening.

Een gedetailleerde praktijk: MDN merkt dat de rollen verouderd zijn of een eliminatie van toekomstige versies van de specifieke versie zijn. Raadpleeg deze marca om een rol te aanvaarden die verloren gaat.

HTML-ARIA: het tabblad dat ARIA nodig heeft

De HTML-ARIA-specificatie van W3C definieert, voor alle HTML-elementen, welke rollen ARIA kan worden toegepast en overbodig is. Deze beslissing wordt genomen wanneer u een elementair element of een div controlerol gebruikt. Als de rol wordt toegepast als deze overbodig is, is de reactie niet nodig.

De Universiteit heeft een lijst met rollen die niet echt betrekking hebben op de lessen van de pantalla, maar de specificiteit is niet zo dat het niet zo is. De A11Y-projectchecklist is geen spiekbriefje voor rollen, maar functioneert als een verificatielijst vooraf aan een publicatie en als aanvulling op de voorgaande.

Hoe je dit ook doet

De beslissing hangt af van drie preguntas. Eerste, is het noodzakelijk dat u dit doet? Als het antwoord zo is, is MDN meer corta. Wat is de constructie van een widget met volledige interactie? Als APG nodig is, kan de rol alleen niet de technische compatibiliteit beschrijven. Is het mogelijk om HTML-eigen en ARIA te gebruiken? Raadpleeg HTML-ARIA voordat u meer informatie krijgt.

Om XHTML en CSS in frameworks uit te rusten, is de combinatie meer efficiënt: HTML-ARIA om te beslissen, APG om te implementeren en MDN om attributen te verifiëren. Een spiekbriefje van een enkele pagina is als geheugensteuntje op het plein, maar u hoeft niet meer te zoeken als dit een beperkt geval is.

Een extra criterium dat kan worden toegepast: de rol die JavaScript vereist om correct te functioneren (het maken van een foto, het actualiseren van een ‘aria-uitgebreid’, het syncroniseren van een ‘aria-geselecteerd’), kan als een beslissing over een rechtszaak worden beschouwd, niet als een decoratieve toeschrijving. Widgetrollen zorgen ervoor dat de logica steeds meer wordt gebruikt, zodat de rol kan worden gebruikt.

Gerelateerd: — Het professionele certificaat dat u ervaring en toegankelijkheid geeft.

Er komen regelmatig fouten voor wanneer een spiekbriefje wordt weergegeven als u dat doet

De rollen van mijlpaalduplicaties vormen de navigatie in de regio. Een role="main" als een <main> is overbodig; Deze role='navigatie'' heeft een onderscheid tussen dubbelzinnigheden. De oplossing is aria-labelofaria-label` in een herhaling van een herkenningspunt.

De rollen van de widget zijn geen enkele kabel die de interactie mogelijk maakt. role="button" op een <div> exige tabindex="0" en manejo de Enter en Spacio. Daarom wordt er een knop aangekondigd die niet met teclado kan worden geactiveerd.

Beëindigde staten zijn de meest voorkomende oorzaak van afname van het aantal kijkers. aria-expanded wat niet verandert om een akkoord te openen, aria-selected wat niet wordt bijgewerkt wanneer de pestaña verandert of aria-checked in een role="switch" die is opgelost. Als u wilt detecteren: u kunt een fout maken met de technologie en met een echte lezer.

Als u aan het winkelen bent: — Superpositie van IA die de cumplimiento WCAG in 48 uur stimuleert.

Abstracte rollen in de markt zijn in principe een vergissing. role="widget", role="input" of role="section" mogen niet verschijnen in HTML; bestaan alleen voor de jerarquía van de specificatie.

Belangrijkste conclusies

WAI-ARIA 1.2 definieert 82 rollen, gedurende 15 en 20 keer terugkerende projecten in de VS.
De eerste regel van ARIA —gebruik HTML als het bestaat— laat de tabel HTML-ARIA van W3C zien in de belangrijkste verwijzingen voordat de rol wordt beschreven.
De APG van W3C is onoverkomelijk voor het beheer van widgets, inclusief teclado-interactie; MDN is sneller om een concreet rol te raadplegen.
Er is een focus op het fokken en het actualiseren van meer algemene toegankelijkheidsnormen die geen gebruik maken van ARIA.
Ninguna spiekbriefje geeft het probleem op met de techniek en de schakelaar van de pantalla: de vastgestelde waarden worden alleen in werkelijkheid gedetecteerd.

Preguntas frecuentes

¿Cuántos rollen ARIA bestaan?

WAI-ARIA 1.2 definieert 82 rollen, indelingen in verschillende categorieën: abstracts, widgets, documentstructuur, oriëntatiepunten en live-regio’s. De abstracte rollen zijn niet van toepassing op de marcado; mijnheer om de specifieke taak te organiseren. In de praktijk wordt een projecttype tussen 15 en 20 verschillende rollen gebruikt.

Is dit het belangrijkste spiekbriefje van de ARIA-rollen?

Afhankelijk van het gebruik. Om een widget te implementeren, is de WAI-ARIA Authoring Practices Guide van W3C de meer volledige referentie. Om de attributen van een concrete rol te raadplegen, is MDN Web Docs veel sneller. Om te beslissen welke rol u nodig heeft bij een element van HTML, is het HTML-ARIA-blad van W3C de meest beslissende keuze.

Gebruik ARIA als er een elementair HTML-bestand bestaat?

Nee. De eerste regel van ARIA is dat er een HTML-element bestaat met de semantische en bijbehorende vereisten, dit element is een onderdeel van een div-besturingsrol. Het toevoegen van role="button" aan een <button> is overbodig en kan het gedrag van andere docenten veranderen.

De rollen van de widget beschrijven interactieve bedieningselementen —button, checkbox, slider, tablist — en vereisen een focus- en teclado-besturing. De rollen van oriëntatiepunten worden beschreven in regio’s van de pagina —main, navigation, banner, contentinfo - en sirven para la navigatie door regio’s. Een ander element kan niet meer functioneren.

Welke rollen ARIA cambian tussen de specifieke versies?

Si. WAI-ARIA 1.2 bevat rollen als blockquote, caption, code, deletion, emphasis, insertion, meter, paragraph, strong, subscript en superscript. Sommige rollen zijn achterhaald en achterhaald. Gebruik een MDN- of een propia-specificatie als een rol belangrijk is vóór de adoptie.

Heeft u een spiekbriefje met ARIA-rollen om WCAG te voltooien?

Nee. De rollen van ARIA zijn een deel van het criterium 4.1.2 Naam, rol en waarde, voor WCAG 2.2 omvatten veel andere vereisten: contrast, foco zichtbaar, onderwerp, tekstalternatief, encabezados-structuur. Een spiekbriefje kan de juiste rollen implementeren, maar u hoeft de conformiteitscriteria niet samen te voegen.

Bronnen en verder lezen

Spiekbriefje — Wikipedia: Een spiekbriefje (ook spiekbriefje) of spiekbriefje of taakhulp is een beknopte reeks aantekeningen die worden gebruikt voor snelle referentie. Spiekbriefjes werden van oudsher gebruikt door studenten zonder…

Heeft WCAG de code nodig?

Superpositie van IA die de cumplimiento WCAG in 48 uur stimuleert