•  06-09-2019
  •  | 
  •  

Pergunta

Eu tenho uma página HTML com muitas caixas de texto. Tenho de classificá-los para purpose.But acessibilidade, eu não quero rótulo para visible.Is possível? Ou há alguma outra alternativa design?

Nenhuma solução correta

Outras dicas

Existem várias maneiras de colocar o texto em uma página e tê-lo escondido de outros usuários visuais enquanto acessível aos usuários de leitores de tela (como text-indent alta negativo).

No entanto, "acessibilidade" não é uma linha entre "As pessoas que não têm problemas usando a web" e "As pessoas que são cegas". Há muitas pessoas que se encaixam em nenhum dos dois grupos, e é muito fácil e muito comum para os autores de esquecer que a acessibilidade é sobre mais do que disponibilizar o conteúdo para as pessoas que não podem ver.

Usando display: none é ruim para isso, e eu apoio a consulta a respeito de porque você quer esconder todos os rótulos - não é provável que seja algum tag que você está usando para informar aos usuários o que o textarea é conter, por isso só marca isso como uma etiqueta e estilo em conformidade.

Se você ainda deseja ocultar o rótulo, posicionando-o fora da tela é melhor. Há uma recente deste na 456 Berea Rua blogue .

O ponto de um rótulo é descrever propósito da entrada, um bocado como dando-lhe um cabeçalho. Se você não usar um rótulo, como é que os seus utilizadores com visão sabe o que colocar na entrada?

O que quer que dá a pista visual para os usuários com visão também deve ser o rótulo para usuários de tecnologia assistiva.

Tente CSS: 

label {
    display: none;
}

Certifique-se de aplicar este estilo ao meio "tela" apenas: 

<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

Como mencionado, é sempre preferível ter um rótulo visível para todos os elementos de entrada - o que irá ajudar os usuários com visão e não enxergam. Dito isto, há certas situações em que isso não for viável, o que eu estou supondo que seu caso se enquadra. Para essas situações, você tem algumas opções.

A primeira é usar o atributo "título", que tem a vantagem de exibir uma dica de ferramenta para usuários com visão: 

<input type="text" title="first name" />

alguns outros A ter mencionado a segunda opção, que envolve o posicionamento do rótulo fora da tela usando CSS: 

<label for="first_name" 
  style="position:absolute;left:-1000px;width:1px;overflow:hidden;" />
<input type="text" id="first_name" />

Ao contrário de usar "display: none", leitores de tela ainda vai ler o rótulo. É também elegante em que os usuários que optam por desativar CSS vai ver o rótulo.

Não importa o que você vai com, definitivamente, recomendo download uma cópia de teste de JAWS de Freedom Scientific e testar sua solução fora.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top