ARIA
Medidores precisam de nome
- Regra:
aria-meter-name - Gravidade: Grave
- Nível WCAG A
Por que isso importa
role="meter" anuncia um valor sem dizer o que está sendo medido — “7 de 10” sem assunto.
Como corrigir
- Acrescente aria-label ou aria-labelledby nomeando a grandeza (“Armazenamento usado”).
- Mantenha aria-valuemin, aria-valuemax e aria-valuenow para que o valor tenha escala.
Na marcação
<div role="meter" aria-valuenow="7" aria-valuemin="0" aria-valuemax="10"></div><div role="meter" aria-valuenow="7" aria-valuemin="0" aria-valuemax="10"
aria-label="Storage used"></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:
- 1.1.1 Conteúdo não textual (abre em nova aba) — Nível WCAG A
Para aprofundar
Deque University sobre aria-meter-name (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.