Como funcionam os leitores de tela e o que considerar ao projetar

Um leitor de tela converte em voz ou em braille o que há em uma tela. Ele não «vê» o seu design: lê a estrutura que há por baixo. Se essa estrutura está bem feita, a experiência é boa; se não, o site se torna um muro.

O que ele faz com a sua página

O leitor percorre o código e constrói uma árvore de acessibilidade com os títulos, os links, os botões, os campos de formulário e as regiões da página. As pessoas usuárias não leem de cima para baixo: saltam entre títulos, listam os links ou vão direto a uma região, como o menu ou o conteúdo principal.

O que vale cuidar

• Títulos em ordem. Um único H1 e níveis que não pulem.
• Regiões. Cabeçalho, navegação, conteúdo principal e rodapé bem marcados, e um link para pular para o conteúdo.
• Textos de link com sentido. «Baixar o guia de acessibilidade» em vez de «aqui».
• Rótulos nos formulários associados a cada campo, e erros anunciados.
• Texto alternativo útil nas imagens com informação, e vazio nas decorativas.
• ARIA com critério. Primeiro HTML nativo; ARIA só quando for necessário, porque um uso incorreto piora a experiência.

Como testar

Teste com um leitor real, como NVDA ou JAWS no Windows, VoiceOver no macOS e no iOS ou TalkBack no Android, e melhor ainda com pessoas que o usam todos os dias. Um teste de cinco minutos costuma revelar problemas que uma ferramenta automática não vê.