# ARIA Roles Reference

> Search ARIA roles with their required attributes, native HTML equivalents and gotchas.

ARIA roles tell assistive technology what an element is when the HTML does not. This reference lists 30 common roles with the native HTML element that already provides each one, the attributes the role requires to work, and the mistake most often made with it — including that an unnamed section or form is not a landmark at all.

**URL:** https://convertto.tech/t/aria-roles-reference
**Category:** Accessibility (https://convertto.tech/c/accessibility-tools)
**Privacy:** Runs entirely in the browser; no upload
**Cost:** Free, no sign-up
**Last updated:** 2026-08-01

## Key facts

- **Privacy:** Runs entirely in your browser — nothing is uploaded
- **Cost:** Free, unlimited, no sign-up

## How to use

1. Enter or paste your search.
2. Choose the category.
3. The result appears immediately — copy or download it.

## FAQ

### Should I add ARIA roles to my HTML?

Usually not. The first rule of ARIA is not to use ARIA — a native <button> already has role="button", keyboard handling and focus behaviour, while role="button" on a div gives you only the label and leaves you to build the rest.

### Why is my role="menu" navigation not working well?

Because role="menu" describes an application menu, like the File menu in a desktop app, with arrow-key navigation and a single tab stop. Site navigation should be a <nav> containing a plain list of links.

## Related tools

- [HTML Landmark Checker](https://convertto.tech/t/html-landmark-checker): Check a page for the landmark regions screen reader users navigate by.
- [Alt Text Checker](https://convertto.tech/t/alt-text-checker): Find images with missing, empty, filename-based or overlong alternative text.
- [Heading Structure Validator](https://convertto.tech/t/heading-structure-validator): Check a page for skipped heading levels, missing or multiple H1s and empty headings.
- [Link Text Checker](https://convertto.tech/t/link-text-checker): Find vague link wording — "click here", "read more", bare URLs and duplicated labels.
- [Palette Accessibility Grader](https://convertto.tech/t/palette-accessibility-grader): Grade every colour in a palette against one or more backgrounds for WCAG contrast.
- [Touch Target Size Checker](https://convertto.tech/t/touch-target-checker): Check whether a button or link meets the minimum tap target size and spacing.
- [WCAG Contrast Checker](https://convertto.tech/t/contrast-checker): Check colour contrast against WCAG AA and AAA thresholds for accessible text.
- [AI Alt Text Generator](https://convertto.tech/t/ai-alt-text-generator): Describe an image with a captioning model running in your browser — a first draft for the alt attribute you then edit.