Quer Construir Sites Acessíveis? Conheça as Principais Diretrizes do Projeto A11Y

David Branco
ArcTouch
Published in
3 min readJul 26, 2021
Uma imagem com duas setas direcionais apontando para cima e para baixo num fundo laranja
Sites acessíveis

Desenvolver sites acessíveis não é uma questão exatamente recente. Desde 2015, existe uma lei brasileira que demanda que os todos os sites tragam os recursos necessários para que todas as pessoas possam navegar neles. No entanto, menos de 1% dos sites brasileiros têm os recursos necessários para que isso aconteça.

Por outro lado, segundo o IBGE, existem mais de meio milhão de pessoas cegas e mais de 6 milhões de pessoas com baixa visão em todo o país. Essas pessoas constituem 3,5% da população local e dependem de recursos específicos para conseguir navegar na internet. Isso sem contar pessoas com outras deficiências, que também são impactadas por essas limitações.

A melhor forma de acolher essas pessoas no ambiente digital é construindo sites acessíveis e que, conforme proposto pelo projeto A11Y, seguem as WCAG, Web Content Accessibility Guidelines.

O que é o projeto A11Y?

O a11y é um projeto com o objetivo divulgar informações sobre acessibilidade web. Seus criadores almejam a colaboração coletiva de pessoas desenvolvedoras em todo o mundo para tornar a experiência na internet verdadeiramente acessível e inclusiva.

O nome do projeto vem da palavra em inglês “accessibility” (acessibilidade). A11Y mantém a primeira e última letras da palavra e traz o número 11 entre ambas, o qual corresponde à quantidade de caracteres entre as duas letras.

3 critérios básicos para sites acessíveis

No site do A11Y Project, você encontrará uma checklist com os critérios que seu site precisa atender para poder ser considerado acessível. Três dos principais (e mais fáceis de colocar em prática) são:

Valide seu HTML

Caso você ainda não tenha esse hábito, é uma boa ideia começar a colocá-lo em prática. Ter um HTML válido permitirá que você tenha a certeza de que seu website está oferecendo uma experiência homogênea nos mais diversos navegadores, o que é positivo para todos os usuários. Além disso, um HTML válido facilita a vida de quem usa tecnologias assistivas. O site do projeto A11Y sugere usar esse site para fazer essa validação.

Dê uma title diferente para cada página

Por estar logo no topo do documento HTML, a title da página é, geralmente, a primeira informação que é lida para quem usa softwares de leitura. Por conta disso, se a title for a mesma em diversas páginas, ela pode confundir a navegação de usuários que dependem de um software de leitura, fazendo com que eles pensem que não mudaram de página ou tenham dificuldades para achar a página certa.

Evite ao máximo o atributo autofocus

O atributo autofocus faz com que o foco da tela seja alterado sem que o usuário peça. Por conta disso, quando esse recurso é utilizado, uma pessoa cega ou com baixa visão pode acabar tendo sua navegação prejudicada. O uso desse atributo também dificulta a navegação de pessoas com deficiência no controle motor, fazendo com que elas precisem fazer um esforço extra para retornar à parte do conteúdo pela qual elas realmente se interessaram.

Desenvolver sites acessíveis pode ser desafiador, mas não é impossível. Hoje em dia, encontramos muitas ferramentas que seguem as diretrizes de acessibilidade presentes no WCAG, como o Axe e o Acessibilidade Toolkit, as quais ajudam pessoas desenvolvedoras e gestoras de conteúdos durante todo o processo de desenvolvimento e implantação de acessibilidade em sites.

Comece pelos 3 critérios que comentamos por aqui e vá gradualmente fazendo as demais mudanças. Isso fará pouquíssima diferença na sua rotina e, ao mesmo tempo, pode fazer toda a diferença no dia de alguém que depende desses recursos para navegar na web.

Se você quiser aprender ainda mais sobre as melhores práticas para desenvolver sites acessíveis, confira o nosso webinar sobre o tema. Ele conta com a participação de alguns de nossos especialistas mais experientes no assunto, então vale a pena assistir e aprender muito com eles.

Tem interesse em aprender ainda mais sobre tecnologia e desenvolvimento? Dê uma olhada nos nossos demais artigos e nas oportunidades que temos para você aqui na ArcTouch. Construímos lovable apps and digital products e você também pode fazer parte disso.

--

--

David Branco
ArcTouch

Head of Engineering @ ArcTouch | We build lovable apps and digital products. Join us! 📱💻