Ao tornar seu site acessível para pessoas com deficiência, você acaba tornando acessível a todos. De fato, tornar seu site mais acessível pode até mesmo ajudar as pessoas a encontrar seu site nos mecanismos de busca. Por quê? Porque os mecanismos de busca usam alguns dos mesmos sinais que os leitores de tela fazem para encontrar e entender o conteúdo do seu site.
Mas exatamente como você faz um site acessível sem se tornar um especialista em codificação?
Aqui estão algumas dicas e truques que quase qualquer pessoa com conhecimentos básicos de HTML pode usar para melhorar a acessibilidade do seu site.
Ferramentas de acessibilidade da Web
O W3C tem uma lista fantástica de ferramentas de acessibilidade da web que você pode usar como um verificador para detectar possíveis problemas com o seu site. Dito isso, eu ainda recomendo fazer algumas explorações com um leitor de tela e experimentá-lo por si mesmo.
Entendendo os leitores de tela
Uma das maneiras mais importantes de melhorar a acessibilidade do seu site é garantir que ele seja compreendido pelos leitores de tela. Os leitores de tela usam uma voz sintetizada para ler o texto na tela. Isso parece bem direto; no entanto, os leitores de tela ou outras tecnologias assistenciais podem não entender seu site da maneira que você definiu no momento.
A primeira coisa que você pode querer fazer é experimentar um leitor de tela e ver como funciona. Se você estiver em um Mac, tente usar o VoiceOver.
- Vamos para Preferências do Sistema.
- Selecione Acessibilidade.
- Selecione VoiceOver.
- Verifica a caixa para ativar o VoiceOver.
Você pode ligá-lo e desligá-lo usando o comando F5.
Se você estiver em uma máquina Windows, talvez queira baixar o NVDA. Você pode configurá-lo para ativar e desativar o controle de atalho + alt + n.
Ambos os leitores de tela operam deixando o usuário navegar pelo teclado (isso faz sentido - se você não pode ver, usar um mouse seria um desafio) e criando uma área de foco para navegação. O foco é essencialmente onde o teclado é "apontado", mas geralmente é exibido como uma caixa realçada ao redor do objeto de foco em vez de um cursor.
Você pode alterar tanto o tom de voz quanto a velocidade de leitura da voz, se as configurações padrão forem incômodas (e, após cerca de cinco minutos ouvindo uma leitura de voz lenta padrão, elas geralmente são). As pessoas cegas costumam ler sites com seus leitores de tela em alta velocidade.
Pode ajudar a fechar os olhos ao fazer isso, mas também pode ajudar a mantê-los abertos e comparar. Algumas das coisas que você pode perceber imediatamente ao tentar ouvir o seu site é que parte do texto pode estar fora de ordem. Cabeçalhos e tabelas podem ficar confusos. As imagens podem ser ignoradas ou podem dizer "imagem" ou algo igualmente inútil. Tabelas tendem a ser lidas como uma série de itens sem contexto.
Você pode, esperançosamente, consertar isso.
Alt-Tags ou Atributo Alternativo
O atributo alt-tag ou alternativo (alt) é usado em HTML para descrever uma imagem. Em HTML, parece algo como isto:
Mesmo se você criar seu site com uma ferramenta visual que oculta seu código HTML, você quase sempre terá a chance de inserir uma descrição da imagem. Você pode inserir nada (alt = ""), mas seria realmente melhor dar a cada imagem uma descrição útil. Se você fosse cego, o que você precisaria saber sobre a imagem? "Mulher" não ajuda muito, mas talvez "Fluxograma de desenho para mulheres, incluindo acessibilidade, usabilidade, branding e design".
Texto do título
Os sites nem sempre exibem a tag de título HTML, mas é útil para os leitores de tela. Certifique-se de que cada uma das páginas do seu website tenha um título descritivo (mas não excessivamente detalhado) que informe aos visitantes sobre o que a página trata.
Dê ao seu site uma boa hierarquia de informações
Divida grandes blocos de texto com cabeçalhos e, se possível, use cabeçalhos com a hierarquia H1, H2 e H3 adequadamente. Não só torna o seu site mais fácil para os leitores de tela, torna mais fácil para todos os outros. Também é um ótimo sinal para o Google e outros mecanismos de pesquisa ajudarem a indexar melhor seu website.
Da mesma forma, você deve garantir que seu site esteja em uma ordem de conteúdo lógico e que você não tenha caixas de informações não relacionadas aparecendo. Se você estiver usando anúncios, observe que seus anúncios não são excessivamente invasivos e quebram o texto em seu site com muita frequência.
Faça melhores tabelas
Se você estiver usando tabelas HTML, poderá adicionar legendas às suas tabelas usando a tag para facilitar sua compreensão pelos leitores de tela, em vez de apenas tornar o título de uma tabela em negrito. Você também pode adicionar o elemento "escopo" e rotular claramente novas linhas e colunas em sua tabela, de modo que os leitores de tela simplesmente não percam uma série de células da tabela sem fornecer nenhum contexto.
Navegação do Teclado
Em geral, qualquer coisa que você coloque no seu site deve ser algo que alguém poderia fazer usando apenas um teclado. Isso significa que seus botões de navegação não devem ser botões suspensos animados se você não puder usá-los com um leitor de tela (experimente e veja se não tem certeza - alguns botões estão programados para uso do teclado).
Legendas ocultas
Se você adicionar vídeos ou elementos de áudio ao seu website, eles deverão ter legendas. O HTML5 e muitos serviços de streaming de vídeo (como o YouTube) oferecem suporte a closed caption. As legendas ocultas são úteis não apenas para acessibilidade, mas também para usuários que podem estar navegando em seu site em algum lugar onde não possam reproduzir áudio, como em um escritório ou em um local barulhento.
Para podcasts ou outros elementos de áudio, considere fornecer uma transcrição de texto. Além de ser útil para pessoas que não podem ouvir o áudio, o texto facilitará para o Google e outros mecanismos de pesquisa indexar esse conteúdo e ajudar no ranking do Google.
ÁRIA
Se você quiser ir para o nível avançado de acessibilidade, as especificações HTML5 ARIA ou WAI-ARIA pretendem ser o novo padrão daqui para frente. No entanto, este é um manual técnico complexo (e em evolução), então o que você poderia fazer é usar um validador ARIA para verificar se o seu site tem algum problema que você possa resolver. A Mozilla também tem um guia mais acessível para começar a usar o ARIA.
