Acessibilidade web: guia prático para sites
Acessibilidade é a diferença entre um site que toda a gente consegue usar e um que exclui uma parte dos visitantes sem que ninguém se aperceba. A maioria dos requisitos é simples e barata se for tratada durante a construção.
Este guia cobre o que verificar, como testar sem ferramentas caras, e o que é obrigação legal em vez de boa prática.
O essencial, por ordem de impacto#
Cumprir estes pontos resolve a maior parte das barreiras reais, e nenhum é caro durante a construção.
- HTML semântico. Títulos, listas, botões e ligações com as etiquetas corretas — é a base de tudo.
- Navegação por teclado. Tudo o que se faz com o rato tem de ser possível com Tab e Enter.
- Indicador de foco visível. Nunca remova o contorno sem pôr algo melhor no lugar.
- Contraste suficiente. 4,5:1 para texto normal, 3:1 para texto grande.
- Texto alternativo nas imagens. Descritivo nas informativas, vazio nas decorativas.
- Rótulos nos formulários. Associados ao campo, não apenas texto de espaço reservado.
- Erros claros. Junto ao campo, a dizer o que corrigir, não só a vermelho.
- Não usar só a cor para transmitir informação.
- Legendas em vídeo, e transcrição em áudio.
HTML semântico resolve sozinho uma proporção enorme dos problemas. Um botão que é um <div> falha imediatamente em teclado e em leitores de ecrã.
Testar sem ferramentas caras#
Cinco testes que qualquer pessoa pode fazer e que apanham a maior parte dos problemas.
| Teste | Como fazer | O que revela |
|---|---|---|
| Só teclado | Guardar o rato e navegar com Tab | Armadilhas de foco, elementos inacessíveis |
| Zoom a 200 % | Ampliar no navegador | Disposição que parte, texto cortado |
| Verificador automático | Extensão gratuita de acessibilidade | Contraste, rótulos, estrutura |
| Leitor de ecrã | O que já vem no sistema operativo | Se a página faz sentido em voz |
| Escala de cinzentos | Filtro do sistema | Informação transmitida só por cor |
Os verificadores automáticos apanham cerca de um terço dos problemas. O teste de teclado apanha muitos dos restantes e demora dois minutos.
Erros frequentes#
Padrões que aparecem repetidamente e que são fáceis de evitar.
- Remover o contorno de foco por razões estéticas — torna o site inutilizável com teclado.
- Usar <div> com um clique em vez de <button>, perdendo teclado e semântica.
- Texto de espaço reservado em vez de rótulo: desaparece quando se começa a escrever.
- Contraste baixo em texto secundário, muito comum em cinzentos claros.
- Imagens com texto embutido, ilegíveis para leitores de ecrã e para tradução.
- Carrosséis automáticos sem controlo de pausa.
- Modais que não devolvem o foco ao elemento que os abriu.
- Ícones sem rótulo acessível, sobretudo em menus e botões de fecho.
Obrigação legal e âmbito#
O enquadramento varia por país e por tipo de organização, mas a direção é a mesma em todo o lado.
| Contexto | Situação |
|---|---|
| Setor público na União Europeia | Obrigatório, com declaração de acessibilidade |
| Serviços digitais e comércio | Cada vez mais abrangido por legislação europeia |
| Empresas fornecedoras do Estado | Frequentemente exigido em concurso |
| Norma de referência | WCAG 2.1 nível AA |
| Sites privados sem contrato público | Boa prática, com risco legal a aumentar |
| Aplicações móveis | Abrangidas pelas mesmas orientações |
Independentemente da obrigação legal, o argumento prático é simples: uma parte significativa da população tem alguma limitação, e limitações temporárias afetam toda a gente em algum momento.
Perguntas frequentes
A acessibilidade encarece o projeto?
Durante a construção, pouco — a maior parte é escrever HTML correto e escolher cores com contraste suficiente. Corrigir depois de o site estar feito custa muito mais, porque implica mexer em estrutura já construída. É por isso que deve estar nos requisitos, não numa auditoria posterior.
As ferramentas automáticas chegam?
Não. Apanham cerca de um terço dos problemas: contraste, rótulos em falta, estrutura de títulos. Não conseguem avaliar se um texto alternativo é útil, se a ordem de tabulação faz sentido, ou se a página é compreensível em voz. Combine automático com teste de teclado e com leitor de ecrã.
Acessibilidade ajuda no SEO?
Ajuda, por sobreposição real: HTML semântico, títulos bem estruturados, texto alternativo e vídeo legendado servem ambos os objetivos. Não é uma tática de SEO, mas as duas coisas puxam na mesma direção porque ambas dependem de o conteúdo ser compreensível sem depender da apresentação visual.
Preciso de conformidade total?
Se estiver legalmente obrigado, sim, ao nível exigido. Caso contrário, trabalhe por prioridade: corrija primeiro o que bloqueia utilização — teclado, contraste, rótulos, formulários — e trate depois os pontos mais finos. Um site com o essencial resolvido é utilizável; a conformidade formal completa é um passo seguinte.
acessibilidade webwcagsite acessívelnavegação tecladocontraste acessibilidadeleitor de ecrã