Precisamos falar sobre acessibilidade na web
Será que as páginas também são desenvolvidas para aqueles que possuem alguma limitação e/ou deficiência? Veja 6 dicas para você, pessoa desenvolvedora, tornar seu website acessível.
Sou desenvolvedora front-end há pouco tempo e desde o início de meus estudos percebi que, quando se fala em criar um website, a preocupação inicial é sempre com o layout (para alegria dos designers).
O foco está em ser bonito e atrativo, esquecendo que a primeira e mais importante característica de todo website deveria ter é acessibilidade.
Mas o que você quer dizer com isso?
No Brasil, de acordo com o último senso realizado pelo IBGE - Instituto Brasileiro de Geografia e Estatística, há mais de 45 milhões de pessoas com algum tipo de deficiência, seja ela visual, auditiva, física ou intelectual.
Sendo assim, desenvolver um website acessível é permitir que esses 45 milhões de pessoas tenham a plena capacidade de consumir o conteúdo que você está criando para o seu website.
É como fornecer uma rampa de acesso a um cadeirante, um piso tátil a um cego, a tradução de um vídeo para libras a um surdo, entre outros.
É muito fácil para quem enxerga e ouve com clareza e não possui nenhuma disfunção navegar pela internet nos dias de hoje. Através do visual você se localiza e decide o que consumir nos websites, assiste vários vídeos, consome todo tipo de mídia sem problemas e não fica incomodado com efeitos visuais, cores ou padrões.
Para os deficientes, a coisa não é tão simples assim porque aqueles com deficiência visual não enxergarão o layout para decidir o que querem consumir. Os que possuem deficiência auditiva se vêem impossibilitados de assistir vídeos sem a devida tradução para libras. Aqueles com transtorno do espectro autista não se sentirão confortáveis com a paleta de cores do website.
Ignorar a existência dessa parcela da população é infringir a Lei Brasileira de Inclusão da Pessoa com Deficiência que diz:
“Art. 63. É obrigatória a acessibilidade nos sítios da internet mantidos por empresas com sede ou representação comercial no País ou por órgãos de governo, para uso da pessoa com deficiência, garantindo-lhe acesso às informações disponíveis, conforme as melhores práticas e diretrizes de acessibilidade adotadas internacionalmente.”
A proposta não é tornar o seu website uma página feia com letras grandes, sem imagens ou vídeos, mas sim permitir que qualquer pessoa tenha a mesma agradável e irrestrita experiência ao navegar na sua página.
Ok, mas qual é o primeiro passo?
Antes de tudo é preciso que você saiba sobre a WCAG (Web Content Accessibility Guidelines), que são as diretrizes de acessibilidade para o conteúdo da web publicadas e atualizadas pela W3C (Web Accessibility Initiative).
É ali que encontraremos todas as orientações para o desenvolvimento de um website com conteúdo acessível e que acolha todo tipo de público.
De acordo com a própria W3C, “seguir estas diretrizes irá tornar o conteúdo acessível a um maior número de pessoas com deficiência, incluindo cegueira e baixa visão, surdez e baixa audição, dificuldades de aprendizagem, limitações cognitivas, limitações de movimentos, incapacidade de fala, fotossensibilidade e combinações destas características”.
Se você teve a curiosidade de verificar a WCAG, pode constatar que ela se trata de uma robusta compilação de normas e não teremos tempo de tratar de todas aqui.
Por isso, reuni esse pequeno (mas valioso) conjunto de 6 dicas simples que vão tornar o seu site mais acessível:
- Respeite as tags de cabeçalho e a hierarquia
As tags de cabeçalho existem e devem ser usadas para estruturar as páginas de seu website!
É recomendado utilizar apenas uma tag <h1> por página porque ela indicará qual é a palavra-chave mais importante daquela página.
As demais tags (<h2>, <h3>, <h4>, <h5> e <h6>) são utilizadas como subtítulos e, estas sim, poderão aparecer mais de uma vez em seu código. Mas não se esqueça de respeitar a hierarquia existente entre elas.
É através delas que a maior parte dos deficientes visuais navega e escolhe se o conteúdo oferecido é ou não relevante para ele.
2. Não deixe em branco! Todo <input> merece sua <label>
Nunca se esqueça de colocar uma <label> para rotular um <input>.
Equivocadamente e, alegando ser questão estética, muitos substituem a <label> por <placeholder> e caem num problema de acessibilidade muito comum porque os leitores de tela de pessoas com deficiência visual, por exemplo, não identificam o <placeholder>.
Obs.: se você colocar o mesmo valor para o atributo “for” na <label> e para o atributo “id” no <input>, ao clicar na label, o <input> fica em foco.
3. Utilize os elementos semânticos (tags com significado)
O HTML5 trouxe tags semânticas que merecem toda a atenção. Isso quer dizer que as tags têm significado e servem para deixar sua estrutura mais legível e organizada, não sendo necessário utilizar diversas <div> sem significado.
4. Marque o idioma principal do website
O atributo “lang” deve ser utilizado para definir o idioma que será utilizado no website e, também, caso haja alguma citação em idioma diverso daquele declarado na tag <html>, para que o leitor de telas pronuncie corretamente.
5. Dê um alt: “ ” para sua <img>
O atributo “alt” deve ser utilizado em toda tag <img> porque se trata de um texto alternativo à imagem. Ele deve ser preenchido com uma descrição sucinta da imagem, de maneira direta e simples.
6. Verifique a acessibilidade do seu site
Se você quiser conferir se seu website está acessível, basta utilizar os links abaixo:
http://www.acessibilidade.gov.pt/accessmonitor/
http://asesweb.governoeletronico.gov.br/ases
Esses são tópicos básicos para que você desenvolva um website acessível.
Em caso de dúvidas, dê uma olhada na WCAG! Não se esqueça também que a opinião das pessoas que utilizam seu site é muito importante, por isso mantenha-se aberto a feedbacks.
Tornar seu website acessível não é só uma questão de boa prática, mas de garantia de acesso irrestrito à informação a quem quer que seja, independente de sua deficiência.
Obrigada e até a próxima!