Accesibilidad Web (a11y)

<!-- Roles -->
<div role="button" tabindex="0">Haz clic</div>
<nav role="navigation"></nav>
<main role="main"></main>

<!-- Estados y propiedades -->
<button aria-pressed="true">Alternar</button>
<input aria-required="true" aria-invalid="false">
<div aria-expanded="false">Contenido expandible</div>

<!-- Etiquetas -->
<button aria-label="Cerrar diálogo">X</button>
<div aria-labelledby="heading-id"></div>
<div aria-describedby="desc-id"></div>

<!-- Regiones en vivo -->
<div aria-live="polite">Actualizaciones de estado</div>
<div aria-live="assertive">Alertas críticas</div>

<!-- Buena estructura semántica -->
<header>
  <nav></nav>
</header>
<main>
  <article>
    <h1>Título</h1>
    <section>Contenido</section>
  </article>
</main>
<footer></footer>

<!-- Formularios accesibles -->
<label for="email">Email:</label>
<input type="email" id="email" required>