Nome Acessível Significativo

O que Verificamos

O nome acessível de um elemento não deve incluir sua característica de acessibilidade. O VoiceOver anuncia a característica automaticamente, portanto, incluí-la no nome faz com que ela seja lida em voz alta duas vezes.

Esta regra reforça uma prática recomendada estabelecida pelas Diretrizes de Interface Humana da Apple. Você pode desativar esta regra no Painel Mobile ou ignorando a regra em testes escritos para iOS.

Visão Geral

• Esta regra tem um impacto menor para os usuários
• O nome acessível de um elemento não deve repetir sua característica de acessibilidade - o VoiceOver anuncia a característica automaticamente
• Por exemplo, um botão com o nome "Botão Avançar" faz com que o VoiceOver faça o anúncio redundante: "Botão Avançar, botão"

Impacto para os Usuários

Os usuários do VoiceOver são os mais impactados. Quando um nome acessível inclui a característica do elemento, o VoiceOver anuncia a característica duas vezes - por exemplo, "Botão Avançar, botão" em vez de "Avançar, botão". Isso é redundante e pode ser confuso ou distraidor para os usuários de leitores de tela.

Confirmação de Problema com Nome Acessível Significativo

1. Ative o VoiceOver
2. Foco no elemento
3. Uma das seguintes ações acontecerá:
   • Inacessível: O VoiceOver anuncia a característica de acessibilidade do elemento duas vezes - como parte do nome acessível e, em seguida, novamente como característica (por exemplo, "Botão Avançar, botão")
   • Acessível: O VoiceOver anuncia o nome acessível, seguido pela característica (por exemplo, "Avançar, botão")

Corrigir Problemas

Para resolver um problema com Nome Acessível Significativo, certifique-se de que o nome acessível não contenha a característica de acessibilidade do elemento. O VoiceOver adiciona a característica automaticamente, então incluí-la no nome resulta em um anúncio redundante.

UIKit

Para corrigir no Storyboard:

1. Selecione o elemento com um MeaningfulAccessibleName problema.
2. Certifique-se de que o Painel de Inspetores esteja visível.
3. Selecione o Inspetor de Identidade.
4. Em Acessibilidade, insira um rótulo que corresponda ao texto visível e não inclui a característica de acessibilidade do elemento.

Para corrigir no código, certifique-se de que o valor do rótulo de acessibilidade corresponda ou contenha todo o texto visível no elemento, e que não inclua a característica de acessibilidade:

button.title = "Next"
button.accessibilityTraits = .button

SwiftUI

Defina um rótulo de acessibilidade que contenha o texto visível e não inclua a característica de acessibilidade do elemento:

Button(action: {
    openMenu()
}) {
    Text("Next")
}.accessibility(label: Text("Next"))

React Native

Certifique-se de que o accessibilityLabel do elemento não contenha o accessibilityRole valor do elemento:

<Button title='Order now' accessibilityLabel='order now' accessibilityRole='button'/>

Flutter

Os nomes acessíveis devem descrever o propósito do elemento. Evite nomes genéricos como "botão" ou "imagem" e não inclua o papel no nome. O leitor de tela anuncia o papel separadamente.

  // Failing — name includes the role, screen reader says "Search button, button"
  IconButton(
    icon: const Icon(Icons.search),
    tooltip: 'Search button',
    onPressed: () {},
  )

  // Passing — name describes the action, screen reader says "Search, button"
  IconButton(
    icon: const Icon(Icons.search),
    tooltip: 'Search',
    onPressed: () {},
  )

Posso Ignorar Esta Regra?

Nome Acessível Significativo tem um Impacto menor para os usuários e reforça uma prática recomendada da Apple em vez de um requisito rigoroso do WCAG. Você pode desativar essa regra completamente no Painel Mobile, ou ignore resultados individuais nos seus testes iOS. Saiba mais sobre ignorando regras.

Recursos

Outros Recursos

• Diretrizes de Interface Humana da Apple
  • VoiceOver — Descrições