Web accessibility standards emphasize native HTML over ARIA

Web accessibility standards emphasize the ‘First Rule of ARIA,’ which advises developers to use native HTML elements and attributes with built-in semantics and behavior instead of repurposing elements with ARIA roles. Using ARIA unnecessarily can lead to HTML conformance errors and may actually make interfaces less accessible than using native HTML.

In modern frameworks like React and Next.js, common mistakes include using fake buttons instead of native elements, adding redundant ARIA roles to HTML5 semantic tags, and failing to include aria-expanded states on collapsible components. Other frequent errors involve unlabelled icon buttons and misusing aria-hidden on focusable elements, which can create keyboard traps for users.