Acessibilidade: adicionar atributos ARIA a aplicativos web personalizados

4 min de leitura
Os atributos ARIA fornecem informações adicionais sobre a semântica de elementos para tecnologias assistivas, como leitores de tela. Você pode adicionar atributos ARIA a qualquer elementos personalizados ou aplicativos em seu site.
Os atributos ARIA são importantes, pois definem maneiras pelas quais elementos e aplicativos personalizados podem se tornar acessíveis quando não é possível fazê-lo com o HTML nativo do elemento.
Importante:
Esse recurso é destinado a usuários que possuem aplicativos/elementos personalizados que requerem atributos ARIA. Se você não os possui em seu site, não precisa editar os atributos ARIA.

Adicionando atributos ARIA

Já codificamos os atributos ARIA para a maioria dos elementos no Editor. No entanto, se você criou aplicativos personalizados, convém adicionar seus próprios atributos ARIA para fins de acessibilidade.

Você pode adicionar atributos ARIA aos seguintes elementos:

Elemento
Propriedades
Janelas
Etiqueta
Texto
Caixa Contêiner
label, tabindex, role [region, group, none, status, alert], live, relevant, atomic, current, controls, hidden
Faixa
label, tabindex, role [heading, status, alert], live, atomic, hidden, current
Repetidor
label, role [heading, status, alert]
Botão de Texto
tabindex, pressed, expanded, haspopup
Estamos trabalhando continuamente para adicionar atributos ARIA a mais elementos. [Entre em contato se você tiver alguma solicitação específica sobre atributos ARIA.

Editando seus atributos ARIA

Após adicionar atributos a aplicativos personalizados, você pode editá-los e atualizá-los sempre que quiser com o ícone Acessibilidade . Esse ícone é adicionado automaticamente aos elementos aos quais você conectou atributos.

Para editar o atributo:

  1. Selecione o elemento/aplicativo no seu construtor de site.
  2. Selecione o ícone Acessibilidade .
  3. Passe o mouse sobre o atributo relevante e selecione o ícone Mostrar mais .
  4. Selecione Editar.
  5. Faça as alterações relevantes e selecione Salvar.

Tipos de atributos ARIA

Nome do Atributo
Categoria
Tokens
tabindex

0, -1
Função

token: de acordo com a definição no primitivo
aria-level

int
aria-live
Online
token: polite, assertive
aria-multiline 
Descrição
true, false
aria-multiselectable
Descrição
true, false
aria-pressed
Estado
true, false
aria-relevant
Online
token: all, additions, removals, text
aria-activedescendant
relacionamentos
ID_REF
aria-atomic
Online
true, false
aria-autocomplete
Descrição
true, false
aria-controls
relacionamentos
ID_REF
aria-current
Estado
step, page, true, false
aria-describedby
relacionamentos
ID_REF (itens separados por espaço)
aria-expanded

true, false
aria-haspopup
relacionamentos
dialog, menu, true, false
aria-hidden

true, false
aria-invalid
Estado
true, false
aria-label

string
aria-labelledby 
relacionamentos
ID_REF (itens separados por espaço)
Importante:
Você pode desativar as configurações avançadas de acessibilidade a qualquer momento e os atributos ARIA não serão excluídos.

Esse artigo foi útil?

|