Rampsight

Todas as regras

ARIA

Papéis ARIA precisam existir e estar escritos corretamente

Por que isso importa

Um papel não reconhecido é descartado, e o elemento volta silenciosamente ao que era — em geral uma div genérica sem significado algum.

Como corrigir

  1. Confira o nome do papel na especificação ARIA; a maioria das falhas aqui são erros de digitação.
  2. Use um papel por elemento, não uma lista.
  3. Prefira o elemento nativo que já tem esse papel.

Na marcação

Falha
<div role="buton">Send</div>
Passa
<div role="button">Send</div>

A exigência por trás disso

Esta regra é uma das formas de falhar nos seguintes critérios de sucesso das WCAG 2.2. O W3C, que publica a norma, explica cada um deles:

Para aprofundar

Deque University sobre aria-roles (abre em nova aba)

A Deque mantém o axe-core, o motor de código aberto que o nosso scanner executa. A página deles documenta a regra como o motor a implementa.

Verificações automáticas encontram falhas que o navegador consegue comprovar. Elas não julgam se uma legenda está correta, se um texto alternativo é útil, nem se a página pode ser operada de ponta a ponta pelo teclado — isso exige uma pessoa.