Examples

Common HTML patterns and their predicted screen reader output.

Button with aria-label

A button using aria-label overrides the visible text content for screen readers.

HTML

<button aria-label="Submit payment">Pay now</button>

NVDA Output

"Submit payment, button"

A nav element with aria-label creates a named navigation landmark.

HTML

<nav aria-label="Main">
  <a href="/">Home</a>
  <a href="/about">About</a>
</nav>

NVDA Output

"Main, navigation
  Home, link
  About, link
end of Main, navigation"

Properly associated labels are announced before the input type.

HTML

<label for="email">Email address</label>
<input type="email" id="email" />

NVDA Output

"Email address, edit, blank"