Arte com o título "Site acessível", uma página de site com o botão principal destacado pelo contorno de foco do teclado e um cartão que mostra o contraste aprovado.
Categoria ›

Acessibilidade no site: por que importa e como começar

Faça um teste: abra o site da sua empresa, deixe o mouse de lado e tente pedir um orçamento usando só o teclado. Depois, aumente o zoom do navegador para o dobro e veja o que acontece com o menu. Para muita gente, isso não é um teste: é o jeito de usar a internet todos os dias.

Um site acessível é um site que todo mundo consegue usar: quem enxerga pouco, quem não enxerga, quem não consegue usar o mouse, quem não ouve, quem tem dificuldade de leitura. A seguir, quem são essas pessoas, o que a lei diz e sete cuidados práticos para o site da sua empresa atender todo mundo.

De quantas pessoas estamos falando

Segundo o módulo sobre pessoas com deficiência da PNAD Contínua 2022, do IBGE, cerca de 18,6 milhões de brasileiros com 2 anos ou mais têm algum tipo de deficiência, 8,9% da população dessa faixa. A mesma pesquisa mostra que quase metade delas, 47,2%, tem 60 anos ou mais.

E quem se beneficia de um site acessível é muito mais gente. Há os idosos que enxergam pior e têm menos firmeza nas mãos, sem se considerarem pessoas com deficiência. Há quem esteja numa situação passageira, como um braço engessado, e quem esteja numa situação comum, como o celular sob o sol forte ou um vídeo assistido sem som no ônibus. Um texto com bom contraste é mais fácil de ler para todos eles.

O que diz a lei

Além de ser a coisa certa a fazer, a acessibilidade é obrigação. O artigo 63 da Lei Brasileira de Inclusão (Lei 13.146/2015) determina que os sites mantidos por empresas com sede ou representação comercial no país sejam acessíveis, seguindo as melhores práticas e diretrizes adotadas internacionalmente.

A referência internacional é o WCAG, as Diretrizes de Acessibilidade para Conteúdo Web, publicadas pelo W3C, o consórcio que define os padrões da web. A versão atual é a WCAG 2.2. Ela tem dezenas de critérios técnicos e pode parecer intimidadora, mas a maior parte das barreiras que encontramos nos sites de pequenas empresas se resolve com os sete cuidados abaixo.

Homem idoso sorrindo enquanto usa o celular ao ar livre
Foto: Direct Media / StockSnap (licença CC0)

1. Contraste suficiente

Texto cinza-claro sobre fundo branco é bonito no projeto e difícil de ler na vida real. O WCAG pede um contraste de pelo menos 4,5 para 1 entre o texto comum e o fundo, e de 3 para 1 nos textos grandes. Não precisa fazer a conta: verificadores de contraste gratuitos dizem na hora se a combinação passa.

2. Texto alternativo nas imagens

Quem usa leitor de tela, o programa que lê a página em voz alta, ouve a descrição da imagem no lugar dela. Descreva o que a imagem mostra e por que ela está ali: “Fachada da clínica, com a entrada por rampa” diz muito mais do que “imagem1”. Imagens só decorativas podem ficar sem descrição, para não poluir a leitura.

3. Tudo funcionando pelo teclado

Muita gente navega só com o teclado, pulando de um item para o outro com a tecla Tab. Todos os menus, botões e campos precisam ser alcançados assim, numa ordem que faça sentido, e o item selecionado precisa ficar visível, com um contorno de destaque. Muitos sites removem esse contorno por estética, e quem navega pelo teclado fica sem saber onde está.

4. Títulos bem organizados

Um título principal por página e subtítulos em ordem permitem que quem usa leitor de tela pule direto para a parte que interessa, do mesmo jeito que quem enxerga passa os olhos pela página. Título não é só texto grande: é a estrutura do conteúdo.

Mãos digitando no teclado de um notebook, vistas de cima
Foto: Skitter Photo / StockSnap (licença CC0)

5. Links e botões que dizem para onde vão

“Clique aqui” e “Saiba mais”, lidos fora de contexto por um leitor de tela, não dizem nada. Prefira “Ver os planos de manutenção” ou “Baixar o cardápio em PDF”. Fica melhor para todo mundo, e o Google também entende melhor para onde o link leva.

6. Formulários claros

Cada campo precisa de um rótulo visível, e não só de um texto de exemplo que some quando a pessoa começa a digitar. As mensagens de erro devem dizer o que está errado e como corrigir, por escrito, em vez de apenas pintar o campo de vermelho.

7. Legendas e informação além da cor

Vídeos precisam de legenda, e nada deve depender só da cor para ser entendido. “Os campos em vermelho são obrigatórios” não funciona para quem não distingue o vermelho; um asterisco acompanhado da palavra “obrigatório” funciona para todos.

Um teste de dez minutos

Faça hoje três testes no seu site. Primeiro, navegue só com o teclado, da página inicial até o envio de um formulário. Segundo, aumente o zoom do navegador para 200% e veja se o texto continua legível e se nada fica cortado. Terceiro, passe a página inicial por um verificador de acessibilidade gratuito e anote o que ele apontar. Se algum dos três falhar, você já sabe por onde começar. E um bônus: boa parte do que torna um site acessível também ajuda no Google, como mostramos em SEO para pequenas empresas.

Para ir além

Sites para todo mundo

Na PubliCode, desenvolvemos sites com boas práticas de acessibilidade desde o projeto, e avaliamos sites que já estão no ar.

Agende uma consultoria sem compromisso e descubra o que o seu site pode melhorar para atender todo mundo.

Quer aplicar isso na sua empresa?

Agende uma consultoria gratuita: analisamos o seu cenário e mostramos os próximos passos para crescer na internet.