Skip to main content

Os principais problemas comuns de acessibilidade web e como corrigi-los

por Jaime Iniesta

O tempo está a esgotar-se para todas as empresas privadas com clientes na UE cumprirem a nova Lei Europeia da Acessibilidade. Pouco mais de um ano para ser preciso, já que o prazo é 28 de junho de 2025.

Embora ainda haja muito trabalho a ser feito para tornar todos os websites acessíveis a todos, você pode fazer a diferença se começar a trabalhar hoje.

Apresentando os principais problemas de A11Y

Fizemos o trabalho difícil por você. Identificámos os problemas de acessibilidade mais comuns, baseados na nossa análise de mais de 70 milhões de problemas de acessibilidade em mais de 9 milhões de páginas web testadas.

Captura de ecrã da nova secção Top Common Accessibility

Esta nova secção oferece atualizações em tempo real com os problemas de acessibilidade mais comuns encontrados nos relatórios de validação de sites gerados pelo Rocket Validator. Agrupámos as causas mais comuns para problemas de acessibilidade e categorizámo-las pelo seu impacto. Isto dá-lhe uma ideia geral dos problemas mais comuns, ou pode filtrá-los para mostrar apenas problemas críticos, sérios, moderados ou menores.

Problemas críticos

Corrija os problemas mais críticos encontrados na maioria dos websites hoje! Clicar em cada problema da lista dar-lhe-á mais informações e um link para o guia relacionado. Aqui estão os 3 principais problemas de acessibilidade:

1. As imagens devem ter texto alternativo

Isto é essencial para utilizadores de leitores de ecrã, que dependem dele para compreender o propósito e significado das imagens.

Mesmo que a imagem contenha apenas texto, os leitores de ecrã não têm forma de traduzi-lo em palavras que sejam lidas ao utilizador. Como resultado, as fotos devem ter texto alt conciso e descritivo para que os utilizadores de leitores de ecrã compreendam o conteúdo e propósito da imagem, por exemplo:

<img alt="A running dog" src="p1.jpg">

Se uma imagem não é informativa e é puramente decorativa, você pode fornecer um texto alt vazio, por exemplo:

<img alt="" src="p1.jpg">

2. Os botões devem ter texto discernível

Isto é crucial para utilizadores de leitores de ecrã, que precisam de saber para onde estão a ir, o que estão a fazer e no que estão a clicar.

Certifique-se de que os botões têm uma etiqueta associada para que o leitor de ecrã a possa ler, por exemplo:

<button>Name</button>

<button aria-label="Name"></button>

<button aria-labelledby="labeldiv"></button>
<div id="labeldiv">Button label</div>

3. O zoom e o dimensionamento não devem ser desativados

O parâmetro user-scalable=”no” no elemento <meta name=”viewport”> não deve ser usado. Impede o dimensionamento de texto e o zoom, que são necessários para indivíduos com visão comprometida.

Utilizadores com visão parcial ou baixa irão frequentemente optar por aumentar as fontes do seu navegador para tornar o conteúdo web mais fácil de ler. Tudo o que é visível na janela do navegador num dado momento é o foco da viewport. Num ecrã de alta resolução, maximizar o navegador fornece uma grande área de foco da viewport que pode incluir toda a página online.

Em suma, isto deve ser evitado:

<meta name="viewport" user-scalable="no">

Além disso, se estiver a definir um maximum-scale na viewport, deve garantir que o seu valor é pelo menos 2.

Tome ação

Melhore a acessibilidade do seu website hoje. Use ferramentas como o Rocket Validator para identificar e corrigir estes problemas comuns. Certifique-se de que o seu site é acessível para cumprir os requisitos legais e melhorar a experiência do utilizador para todos.

Verifique os principais problemas comuns de acessibilidade

Pronto para validar os seus sites?
Comece o seu teste gratuito hoje.