Usando o atributo aria-label
O atributo aria-label é usado para definir uma string na tag do elemento atual. Use nos casos que a tag do texto não seja visível na tela. Se há texto visível na tag do elemento, usa aria-labelledby em vez.
Esse atributo pode ser usado em qualquer elemento de HTML; não se limita aos elementos que tem um papel ARIA atribuído.
Valor
string
Possíveis efeitos sobre os user agents e Tecnologia assistiva
Nota: Opiniões podem diferir em como tecnologia assistiva deve lidar com esta técnica. A informação fornecida acima é um desses pareceres e, portanto, não normativo.
Exemplos
Exemplo 1: Várias Etiquetas
No exemplo abaixo, um botão é denominado para olhar como um botão típico "fechar", com um X no meio. Uma vez que não há nada que indique que a finalidade do botão é para fechar a janela, o atributo aria-label é utilizado para fornecer o rótulo para quaisquer tecnologias assistivas.
<button aria-label="Fechar" onclick="myDialog.close()">X</button>
Working Examples:
Notas
- O mapeamento mais comum da API accessibility para uma label é a propriedade accessible name.
- Atributos, incluindo declarações
aria-label, são ignoradas pela maioria dos serviços de tradução automática.
Usado por regras ARIA
todos os elementos da marcação de base
Técnicas ARIA relacionadas
Compatibilidade
Ainda por fazer: Adicionar informação de apoio para os combinações de produtos UA e AT mais comuns