01
Pesquise o token real
button, role=button e aria-expanded funcionam como busca. O filtro distingue papéis e atributos na lista local, sem requisitar dados externos.
Referência para desenvolvedores
atributos ARIAe papéis essenciais
Busque um papel ou um atributo aria-* e confira exemplo, exigências de interação e fonte da especificação.
atributos ARIA
Resultados
button
Papelbutton aciona uma ação; o elemento nativo já fornece foco e ativação por teclado.
Teclado: HTML nativo cuida das teclas básicas; um papel próprio precisa reproduzir esse comportamento.
Cuidado: Não repita role quando o elemento nativo já tem o mesmo sentido e funcionamento.
Exigências principais: Nenhuma
Exemplo HTML
<button type="button">Save</button>Testar controle real
Acionado 0 vezes
A busca fica nesta página; fontes externas só abrem quando você clica.
Categoria
1 de 16 itens
WAI-ARIA 1.2 · 6 jun 2023Itens revisados em 23 set 2026
Na acessibilidade web, antes de acrescentar semântica a um componente próprio, veja se atributos ARIA são mesmo necessários. Um button ou input nativo já inclui comportamento de teclado; role em uma div não cria esse comportamento.
Esta seleção de atributos ARIA e papéis reúne estados, trechos de HTML e links de origem. Para abas, diálogos e combobox personalizadas, o APG detalha foco e teclado.
Por que consultar atributos ARIA aqui
Exemplo, condição de uso e origem aparecem juntos.
Comece pelo HTML nativo
As fichas button e checkbox mostram primeiro os elementos nativos. Atributos ARIA e role em uma div não acrescentam foco nem ativação com Enter e Espaço.
Associe estado ao conteúdo
O exemplo aria-expanded liga o botão ao painel controlado. Ao usar atributos ARIA, atualize o valor comunicado sempre que a área visível mudar.
Da consulta à interface utilizável
02
Leia a interação antes de copiar
Um trecho de atributos ARIA só mostra a base semântica. Para tab, dialog e combobox, consulte o padrão APG e implemente foco e teclado.
03
Confira a versão e teste
Cada ficha leva à definição fixa de WAI-ARIA 1.2. Depois confira a experiência do componente com teclado e leitor de tela no contexto real.
Termos técnicos com condições de uso
Papéis e propriedades no mesmo índice
São oito papéis e oito propriedades ou estados aria-*. Não encontrar um termo aqui não significa que ele não exista no padrão completo.
Trecho ligado à fonte
Cada entrada oferece HTML e uma âncora de WAI-ARIA 1.2, além do APG quando houver um padrão interativo mais extenso.
Estado não é funcionamento
aria-expanded comunica a expansão, mas não abre o painel sozinho. Código e atributo devem acompanhar a interface.
O que esta referência não verifica
- Somente dezesseis entradas
- Estes atributos ARIA e papéis são uma seleção. Consulte a especificação W3C se a busca não encontrar um token; ausência não indica erro.
- Fragmento não conclui o widget
- Copiar tab, dialog ou checkbox personalizado não implementa setas, foco nem atualização do estado. Use o padrão APG e teste o resultado.
- Sem laudo de conformidade
- A página não analisa seu DOM nem prova atendimento à WCAG. Para cores, use a ferramenta separada de contraste; para a experiência, faça testes reais.
Dúvidas sobre atributos ARIA
Quando usar um papel ARIA em vez de HTML semântico?
Se o HTML semântico já oferece o papel e o funcionamento desejados, use-o. Papéis ARIA são úteis para widgets que o elemento nativo não representa; a interação continua por sua conta.
role=button já oferece suporte ao teclado?
Não. role=button altera a informação passada à tecnologia assistiva, mas não torna uma div focável nem ativa Enter e Espaço. Um button nativo costuma ser melhor.
Qual a diferença entre aria-label e aria-labelledby?
aria-label guarda o nome como texto no atributo. aria-labelledby aponta para IDs de elementos cujo texto dá o nome. Considere primeiro o rótulo visível e label nativo.
Quais atributos são exigidos por cada papel ARIA?
Depende do papel. A ficha resume estados e relações principais; o link de WAI-ARIA 1.2 traz a lista normativa completa para cada caso.
Adicionar ARIA garante conformidade com WCAG?
Não. A consulta de atributos ARIA ajuda a encontrar a semântica, mas conformidade depende do conteúdo e da interação real, inclusive testes de teclado e leitor de tela.
Falta uma entrada ou há algum erro?
Consulte atributos ARIA agora
Escolha um token, compare com HTML nativo e confira a definição W3C antes de usar no projeto.