Acessibilidade Web: Por que Isso Faz Parte do Desenvolvimento

Um elemento pode parecer perfeito na tela e ainda ser impossível de usar de outro jeito. Acessibilidade começa quando você deixa de perguntar só "está bonito?" e passa a perguntar "dá para perceber, entender e operar?".

<!-- Parece um botão para quem usa mouse, mas não se comporta como um -->
<div class="botao" onclick="comprar()">Finalizar compra</div>

<!-- A solução já traz semântica, foco e teclado -->
<button type="button" onclick="comprar()">Finalizar compra</button>

No primeiro caso, alguém pode enxergar o controle e clicar com o mouse. Porém, quem usa Tab talvez nem consiga chegar nele; um leitor de tela pode anunciá-lo apenas como texto. O problema não está na pessoa: está na barreira criada pela interface.

A mesma barreira aparece em contextos diferentes

A decisão de colocar legenda em um vídeo, por exemplo, ajuda situações bem distintas:

• Permanente: uma pessoa com deficiência auditiva acompanha as falas pela legenda.
• Temporária: alguém com dor de ouvido evita usar o áudio.
• Situacional: uma pessoa no ônibus que esqueceu os fones.
• Contextual: em uma sala silenciosa, o áudio precisa ficar desligado.

Isso não significa que todas as pessoas usam a interface do mesmo jeito. Significa que a tarefa principal não deve depender de uma única forma de ver, ouvir ou mover.

Tecnologias assistivas usam o que o código comunica

Leitores de tela, ampliação, controle por voz e dispositivos de entrada alternativos dependem das informações que o HTML, CSS e o JavaScript fornecem. Um botão nativo com o texto "Finalizar compra" oferece, de uma vez:

• um nome: "Finalizar compra";
• uma função: botão;
• uma forma de receber foco;
• ativação por mouse, toque e teclado.

Teste prático de 60 segundos

1. Abra uma página que você desenvolveu.
2. Tire a mão do mouse e pressione Tab até chegar à ação principal.
3. Confirme se existe um indicador visível de foco.
4. Pressione Enter ou Espaço e veja se a ação funciona.
5. Aumente o zoom para 200% e confira se o conteúdo continua utilizável.

Se uma etapa falhar, você encontrou uma barreira concreta para investigar.

Dica: trate acessibilidade como responsividade ou segurança: uma qualidade do produto desde o começo, não uma correção no fim.

No próximo nó, vamos conhecer a referência que organiza boa parte desse trabalho: WCAG e os princípios POUR.