ARIA Role Lookup
Consulta propósito de role ARIA (de 80+ roles WAI-ARIA 1.2).
Propósito
—
Para que serve cada role do WAI-ARIA
Você abriu um pull request e encontrou role="feed" ou role="status" num trecho, sem ideia do que aquilo promete a quem usa leitor de tela. Ou está decidindo entre role="dialog" e role="alertdialog" e a especificação da WAI-ARIA é longa demais para o momento. Digite o nome da role e a página devolve uma linha explicando o papel dela. São 69 roles catalogadas na tabela.
O que sai daqui é o propósito, não o contrato inteiro. Cada role tem atributos obrigatórios e uma estrutura esperada de filhos: checkbox sem aria-checked não comunica estado nenhum; tab precisa viver dentro de um tablist e apontar para o tabpanel correspondente; slider quer aria-valuenow, aria-valuemin e aria-valuemax. Nada disso aparece na resposta, então trate o resultado como ponto de partida e confira a especificação antes de aplicar.
A primeira regra do ARIA é não usar ARIA. O elemento button já tem role button, nav já é navigation, e o nativo vem com foco e teclado de graça. ARIA muda apenas o que a tecnologia assistiva anuncia, nunca o comportamento. Algumas roles do ARIA 1.2, como code, generic, paragraph, meter e time, não estão nesta tabela e voltam como não reconhecida, o que não significa que sejam inválidas. A consulta é local, sem requisição de rede.
Perguntas frequentes
role="presentation" e role="none" são a mesma coisa?
Posso colocar qualquer role em qualquer elemento?
Digitei uma role e voltou não reconhecida. O que houve?
Ferramentas Relacionadas
HTTP Status Code Lookup
Consulta significado de códigos HTTP de 1xx a 5xx.
Gerador de .htpasswd
Gere linhas de .htpasswd para autenticação básica do Apache/Nginx. Suporta hashes MD5 (apr1), SHA1 e bcrypt. Cole o resultado direto no arquivo. Tudo no navegador.
Gerador de PWA manifest.json
Monte um manifest.json para PWA (name, short_name, theme_color, background_color, display, icons) com pré-visualização.