Barreiras de navegação na web e soluções para garantir um conteúdo acessível


Foto em close de uma mulher de costas, do pescoço para cima. Ela está com os cabelos presos em um rabo de cavalo, usa um aparelho auditivo e segura um tablet nas mãos.

Para garantir a experiência de quem navega pelo seu site, você precisa ter um conteúdo acessível. Por isso, é essencial conhecer como as pessoas com deficiência navegam, as principais barreiras que elas encontram e como solucionar esses problemas.

Confira a adaptação que fizemos do artigo “Considerando a perspectiva do usuário: um resumo dos problemas de design”, do site em inglês WebAIM, que lista soluções para deixar seu conteúdo acessível:

Deficiência visual

Imagens

  • Faça a descrição de imagem no texto alternativo e, se necessário, preencha mais explicações no campo “Descrição”.
  • Utilize cabeçalhos e as áreas apropriadas do site.

Informações estruturadas visualmente, como tabelas e gráficos 

  • Utilize cabeçalhos e regiões de páginas apropriados.
  • Preencha os cabeçalhos de coluna e linha nas tabelas de dados.

Acesso ao conteúdo de forma linear

  • Assegure que a ordem de leitura e navegação do CSS ou os layouts de tabela sejam lógicas e intuitivas.
  • Crie links de atalho que permitam que quem navega no seu site possa pular os menus de navegação, listas longas de itens e outras coisas que talvez sejam difíceis ou cansativas de ouvir.

Navegação por links

  • Certifique-se de que o texto do link faça sentido por si só (fora do contexto), evitando termos como “Clique aqui” ou “Saiba Mais”.
  • Garanta que os links e botões contenham texto descritivo.

Navegação sem mouse

  • Não exija mouse ou interações por toque. Assegure que o conteúdo seja acessível pelo teclado.

Cores não são perceptíveis

  • Não dependa apenas da cor para transmitir significado.

Conteúdo visual em multimídia

  • Faça a audiodescrição do conteúdo dos vídeos, incluindo as informações em texto que aparecem na tela.

Baixa visão

Cores e contraste

  • Garanta que haja contraste suficiente entre o texto e o fundo, e em ícones e gráficos.
  • Não utilize apenas a cor para transmitir uma informação (complemente a cor com o texto, por exemplo).

Zoom e ampliação de conteúdo

  • Limite ou elimine o texto dentro dos gráficos.
  • Assegure que o conteúdo seja legível, e minimize a rolagem horizontal quando ampliado.
  • Teste a perda do conteúdo quando o tamanho do texto for aumentado por quem navega pelo seu site.

Deficiência auditiva

Conteúdos em áudio 

  • Crie legendas para conteúdos em vídeos e, se possível, janela de Libras.
  • Em eventos ao vivo, forneça legendas em tempo real (estenotipia).
  • Faça a transcrição de conteúdos em áudio, como podcasts.

Ruídos

  • Evite ter muitos sons tocando ao mesmo tempo.
  • Elimine, o quanto for possível, os ruídos de fundo no aúdio.

Deficiências motoras

Navegação sem mouse

  • Certifique-se de que todas as funções do teclado estejam disponíveis (tente alternar os elementos interativos).
  • Certifique-se de que a ordem da navegação seja lógica.

Navegação por itens numerosos 

  • Forneça um método para pular longas listas de links redundantes ou de conteúdos extensos.

Deficiências cognitivas

Layouts e esquemas de navegação complexos

  • Simplifique o layout o máximo que puder.
  • Coloque os esquemas de navegação do modo mais coerente possível.

Textos muito longos

  • Quando apropriado, agrupe informações textuais em cabeçalhos lógicos.

Interação com alguns tipos de conteúdo

  • Quando apropriado, complemente o texto com ilustrações ou outras mídias, e vice-versa.

* Este conteúdo contou com o apoio de Luciana Quintão de Moraes, poeta, graduada em Letras e voluntária do Movimento Web para Todos.

CONFIRA TAMBÉM:

Outras novidades