Técnicas para as WCAG 2.0

Ir para o conteúdo (Pressione a tecla Enter)

-

F86: Falha do Critério de Sucesso 4.1.2 devido ao não fornecimento de nomes para cada parte de um campo de formulário com várias partes, tal como um número de telefone dos E.U.A.

Aplicabilidade

Geral.

Esta falha está relacionada com:

Descrição

Esta técnica descreve uma condição de falha do Critério de Sucesso 4.1.2, em que algumas ou todas as partes do campo de formulário com várias partes não têm nomes. Existe, muitas vezes, uma etiqueta para o campo com várias partes, que está associada de forma programática à primeira parte, ou não está associada de forma programática a nenhuma das partes.

Nota: Um nome não tem necessariamente de ser visível, mas é visível para as tecnologias de apoio.

Exemplos

Exemplo de Falha 1

Os números de telefone dos Estados Unidos consistem num indicativo de 3 dígitos, num prefixo de 3 dígitos e num sufixo de 4 dígitos. Normalmente, estão formatados da seguinte forma ([indicativo]) [prefixo]-[sufixo], tal como (206) 555-1212. Muitas vezes, os formulários que solicitam um número de telefone incluem 3 campos separados, mas com uma única etiqueta, tal como:

Código Exemplo:

Phone number: 
(<input type="text" size="3">) <input type="text" size="3">-<input type="text" size="4">

A falha ocorre quando não existe um nome para cada um dos 3 campos na API de Acessibilidade. Um utilizador de tecnologias de apoio verá estes campos como três campos de texto indefinidos. Algumas tecnologias de apoio irão ler a pontuação como a identificação dos campos de texto, o que pode ser ainda mais confuso. No caso de um número de telefone dos E.U.A. com 3 campos, algumas tecnologias de apoio iriam identificar os campos como "(", ")" e "-", o que não é muito útil.

Exemplo de Falha 2

O mesmo número de telefone dos E.U.A. Neste caso, a etiqueta não está associada de forma programática a nenhuma das partes. Número de telefone:

Código Exemplo:

(<input type="text" size="3">) <input type="text" size="3">-<input type="text" size="4">

Um utilizador de tecnologias de apoio verá estes campos como três campos de texto indefinidos.

Exemplo de Falha 3

O mesmo número de telefone dos E.U.A. Neste caso, a etiqueta está associada de forma programática à primeira parte.

Código Exemplo:

<label for="area">Phone number:</label> 
(<input id="area" type="text" size="3">) <input type="text" size="3">-<input type="text" size="4">

Um utilizador de tecnologias de apoio será induzido a pensar que o primeiro campo se destina a todo o número de telefone, e verá o segundo e terceiro campos como campos de texto indefinidos.

Recursos

Os recursos são indicados apenas a título informativo, não implica que tenham sido aprovados.

Testes

Procedimento

Procedimento Geral:

  1. Instale uma ferramenta que permita ver a API de acessibilidade para a plataforma (consulte a secção Recursos).

  2. Localize cada controlo de formulário.

  3. Verifique se a propriedade name de cada controlo está preenchida.

Procedimento Alternativo para HTML e XHTML:

  1. Localize cada elemento input, selecte textarea na origem HTML.

  2. Verifique se existe um atributo title no elemento.

  3. Verifique se existe um elemento label associado.

Resultados Esperados

Procedimento Geral:

Procedimento Alternativo para HTML e XHTML: