Skip to main content

Search rules

Search all UI Guides rules by name, category, or source

contentVercel

Semantics Before ARIA

MUST

MUST: Prefer native semantics (`button`, `a`, `label`, `table`) before ARIA

Prefer native elements before ARIA attributes

Bad

Good

Why it matters

Native HTML elements have built-in accessibility, keyboard support, and expected behaviors. Use <button> instead of <div role="button">, <a> instead of <span role="link">. Only add ARIA when native elements don't provide the semantics you need.

Built by Gleb Stroganov, design engineer at Evil Martians.

The rules come from other people's skills and guidelines — Vercel, Rauno Freiberg, @Ibelick, impeccable, Emil Kowalski, Tailwind, RAMS — each one credited on the Sources page. The work here is extraction and wiring: every rule is pulled into one corpus, given a good and a bad example you can operate, a MUST/SHOULD/NEVER rule an agent can paste, and a link back to where it came from.