Editar Valor do Texto

O Que Verificamos

Quando um usuário digita em um campo de texto, o valor inserido deve ser exposto programaticamente para tecnologias assistivas como o TalkBack e o Voice Access.

Exemplo de Falha ❌

value = "Campo de e-mail"

TalkBack anuncia o `contentDescription` em vez do texto digitado
"Campo de e-mail, caixa de edição"

O usuário não consegue confirmar, revisar ou corrigir o que digitou

Exemplo de Sucesso ✅

value = "jsmith@emaik.com" (o texto digitado)

TalkBack anuncia o rótulo e o valor digitado
"E-mail, jsmith@emaik.com, caixa de edição"

O usuário pode confirmar e corrigir o que digitou

Em Resumo

• Esta regra tem um impacto crítico para os usuários
• Os usuários precisam ouvir o que digitaram para confirmar e corrigir sua entrada
• Elementos EditText devem expor seu valor atual para tecnologias assistivas — não apenas seu rótulo
• Não defina um contentDescription em um elemento EditText; isso substitui o valor digitado e interrompe os anúncios do TalkBack
• Associe um rótulo ao campo usando setLabelFor() para que tanto o nome do campo quanto o valor estejam disponíveis

Impacto nos Usuários

As pessoas que dependem do TalkBack são as mais afetadas por este problema. Quando uma entrada de texto não expõe seu valor, os usuários não conseguem ouvir o que digitaram. Isso torna impossível confirmar, revisar ou corrigir entradas de formulário — como nomes de usuário, senhas ou endereços — sem assistência visual.

Elementos EditText devem fornecer consistentemente seu valor atual. Quando o valor é exposto corretamente, as tecnologias assistivas podem comunicar a entrada de forma previsível.

Confirmar Problema de Valor de Texto Editável

1. Ative o TalkBack
2. Foco no elemento de entrada de texto
3. Digite algum texto no campo
4. Uma das seguintes situações ocorrerá:
   • Acessível: o TalkBack anuncia o texto inserido junto com o rótulo associado
   • Inacessível: o TalkBack anuncia uma descrição de conteúdo em vez do valor digitado, ou não anuncia o valor

Corrigir Problemas

A causa mais comum de falha para Valor de Texto Editável é definir um contentDescription diretamente em um EditText, o que substitui o valor que o TalkBack leria. Remova qualquer contentDescription do próprio elemento de entrada e, em vez disso, associe um rótulo visível para que tanto o nome do campo quanto o valor digitado estejam disponíveis para leitores de tela.

XML

Associe um rótulo TextView ao EditText usando setLabelFor(). Não defina um contentDescription no próprio EditText, pois isso impedirá que o TalkBack leia o valor digitado.

EditText editText = .......; // Role: EditText
TextView label = .......; // Role: Label
label.setLabelFor(editText.getId()); // Associate the label with the field

Compose

Use o parâmetro label em OutlinedTextField para associar um rótulo visível à entrada. Não defina contentDescription no próprio TextField, pois isso substitui o valor digitado.

@Composable
fun ZipCodeInput() {
    OutlinedTextField(
        value = zipCode,
        onValueChange = { zipCode = it },
        label = { Text("Zip Code") }
    )
}

React Native

Evite definir a propriedade accessibilityLabel para o valor atual da entrada. Defina-a para descrever o campo, e use a propriedade placeholder para valores de exemplo. Isso garante que o rótulo do campo e o valor digitado permaneçam separados e ambos sejam acessíveis.

<TextInput 
   accessibilityLabel='Username'
   accessible={true}
   placeholder='John'
   style={{height: 45, width: 200, backgroundColor: 'azure', fontSize: 20, margin:20}}
 /> 

Posso Ignorar Esta Regra?

O Valor de Texto Editável tem um impacto crítico para os usuários, e recomendamos fortemente corrigir todos os problemas encontrados por esta regra. Usuários que dependem do TalkBack não podem confirmar ou corrigir o que digitaram se o valor não estiver exposto - tornando o preenchimento de formulários inacessível. Saiba mais sobre ignorando regras.

Recursos

Páginas de Cursos da Deque University

• 4.1.2 Nome, Função, Valor (A)
• Critério de Sucesso 4.1.2 - Nome, Função, Valor

Nota: O acesso completo aos recursos da Deque University requer uma assinatura.

Outros Recursos

• Diretrizes de Acessibilidade para Conteúdo Web (WCAG) 2.0, Recomendação W3C
  • Critério de Sucesso 4.1.2 - Nome, Função, Valor
• Documentos de Compreensão do WCAG 2.0
  • Compreendendo 4.1.2 A - Nome, Função, Valor