presentation-role-conflict

Un rol presentacional no debe entrar en conflicto con un atributo ARIA global ni con la enfocabilidad

manualconfianza: mediumgravedad: minorrobust

Comprueba que role="presentation"/"none" (incluido el rol presentacional implícito de <img alt="">) no se combine con un atributo ARIA global (aria-label, aria-hidden, aria-describedby, ...) ni con la enfocabilidad (tabindex/nativa).

Ámbito de aplicación. Se aplica a elementos con role="presentation" o role="none" explícito, O a un <img alt=""> que no tenga un rol explícito propio (un alt vacío le otorga a un <img> un rol presentacional implícito según HTML-AAM, incluso sin ningún atributo role explícito: `img[alt=''], [role="none"], [role="presentation"]`).

Resultado esperado. El elemento no lleva además un estado/propiedad *global* de WAI-ARIA (aria-label, aria-hidden, aria-describedby, aria-live, aria-current, ...; el conjunto completo de atributos globales, no solo los de nombrado), Y no es enfocable. Según la sección de resolución de conflictos de roles presentacionales de la especificación WAI-ARIA, un rol presentacional se "restaura" al rol semántico implícito del elemento cuando se cumple cualquiera de las dos condiciones: el rol presentation/none deja de funcionar silenciosamente, contradiciendo la intención evidente del autor de ocultar el elemento del árbol de accesibilidad.

Ejemplos

can't tell
<div role="presentation" aria-label="Conflicting">Content</div>

`role="presentation"` pide a la tecnología de asistencia que omita este elemento, pero `aria-label` proporciona un nombre: según la resolución de conflictos de WAI-ARIA, el atributo global prevalece y el rol presentation se descarta, por lo que el elemento (y su nombre) vuelven al árbol de forma inesperada.

n/a
<div role="presentation">Decorative</div>

No hay ningún atributo de nombrado en conflicto junto con el rol presentation.

Ver código fuente