ARIA

It changes what assistive technology reports about an element: its role, its name, its state.

It does not add behaviour. `role="button"` on a `div` makes it announced as a button and does not make it focusable, keyboard-operable, or activated by the space key.

It does not change appearance. A styled `div` looks like a button either way.

So using ARIA correctly means supplying, in JavaScript, all the behaviour the native element would have provided, and keeping the state attributes synchronised with reality.

The specification's own first rule is to use a native HTML element or attribute where one exists with the semantics and behaviour required.

A `<button>` is focusable, keyboard-operable, announced correctly and styleable. A `div` with `role="button"` requires a `tabindex`, a click handler, a key handler for Enter and Space, and a disabled state managed by hand.

The same holds for `<nav>`, `<main>`, `<dialog>`, `<details>` and form controls. Each replaces several ARIA attributes and the behaviour they cannot supply.

The remaining four rules: do not change native semantics without reason, make every interactive ARIA control keyboard-operable, never use `role="presentation"` or `aria-hidden="true"` on a focusable element, and give every interactive element an accessible name.

Assistive technology trusts what the attributes say. An element announced as a checkbox that never updates `aria-checked` reports the wrong state confidently.

`aria-hidden="true"` on a container holding a focusable element produces an element that can be reached by keyboard and does not exist to a screen reader — a genuinely confusing state.

A reference in `aria-labelledby` pointing at an identifier that does not exist leaves the element with no name at all, which is worse than the fallback that would otherwise have applied.

Surveys of large numbers of home pages have repeatedly found that pages using ARIA average more detected errors than pages using none, which is a statement about how it is used rather than about the specification.

Invalid role names, invalid attribute values, and references pointing at absent identifiers are all mechanically detectable and always wrong.

`aria-hidden` on a focusable element is detectable and always wrong.

Whether a role matches the element's actual behaviour requires testing it — with a keyboard first, then with a screen reader.

The browser's accessibility panel shows the computed role, name and state of any element, which is the authoritative view of what was actually produced.