Acessibilidade na web: baby steps

Olá! Antes de entrarmos no assunto de acessibilidade web, precisamos entender o que é acessibilidade e para que ela serve.

Bom, para começar, acessibilidade é o processo de deixar as coisas ou lugares acessíveis para que qualquer pessoa consiga acessar, transpor, alcançar. Esse cuidado envolve várias áreas, como arquitetura, urbanismo, design e, é claro, também nossos sites.

A acessibilidade tem ganhado visibilidade nos últimos anos, apesar de ser um tema que deveria ser tratado e cuidado desde sempre. Agora vamos nos aprofundar um pouco mais sobre acessibilidade web.

A acessibilidade é uma questão de ética ao garantir que todos tenham direito e condições de navegar e desfrutar do conteúdo de sites.

O que é acessibilidade web?

Acessibilidade web é a construção ou o desenvolvimento de conteúdo digital para ser acessado por qualquer pessoa. O desenvolvedor é responsável pela elaboração do conteúdo, programação da página, criação do design e realização dos testes de qualidade.

Como a acessibilidade web funciona?

Infelizmente, a acessibilidade web não é tão simples como apertar um botão. Ela precisa que alguns componentes do seu site trabalhem juntos.

Quais são os principais componentes do meu site a que devo-me atentar para começar a ter uma acessibilidade básica? Abaixo, cito alguns componentes para que você possa ter como referência:

• UX – User Experience: Atentar ao posicionamento, tamanho de elementos, fontes e hierarquia é superimportante;
• UI – User Interface: Preocupar-se com cores, tamanho de elementos, contraste e hierarquia dos itens vai ajudar muito na usabilidade do seu site;
• Conteúdo textual: Ter textos simples e claros no seu site fará toda a diferença para quem utiliza um leitor de telas (item de que irei falar um pouco mais adiante);
• Formulários: Ter mensagens claras de preenchimentos e feedbacks ou mensagens de erros bem definidas vão ajudar muito o usuário;
• Multimídia: Falar de multimídia dentro de um site significa analisar recursos visuais como vídeos ou animações que ele possua. Procure colocar legendas nesses materiais para facilitar a vida do usuário.

Esses são os itens básicos necessários para que o seu site tenha o mínimo de acessibilidade.

Por que a acessibilidade é importante?

Para responder essa questão vou precisar que você pare e reflita sobre as perguntas abaixo:

• E se você não pudesse usar o mouse?
• E se você não pudesse ver a tela?
• E se você não pudesse ver um vídeo ou ouvir um áudio?

Você já precisou usar o seu computador sem o mouse, teclado ou um monitor que queimou? Se não, tente fazer o teste. Acho que vai concordar comigo que se tivesse que enfrentar qualquer uma das dificuldade acima não seria tão fácil e tão simples navegar pelos seus sites preferidos.

Estima-se que no Brasil aproximadamente 48 milhões de pessoas possuem algum tipo de deficiência, mas a maior parte dos sites brasileiros é inacessível. A realidade é que a maioria das empresas ainda não está preocupada em desenvolver sites acessível a todos.
“Nascer digital não é uma garantia de ser acessível!” (Kasdorf, 2018)

Por que me preocupar com acessibilidade no meu site?

Primeiramente, acredito que não deveria ser um questionamento, pois todos deveriam ter o direito à navegação e acesso garantidos. De qualquer maneira, vou citar três principais motivos para você tornar o seu site acessível:

É uma questão ética: deveríamos nos empenhar para que todos tivessem acessos a sites;

• Está previsto na lei: nem todos sabem, mas a acessibilidade web é prevista por lei. Isso mesmo, deixar o seu site acessível é lei e deve ser cumprida;
• Propósitos comerciais: já que os dados oficiais indicam que aproximadamente 48 milhões de pessoas têm algum tipo de deficiência no nosso país, pode-se calcular o quanto a inclusão dessas pessoas aos visitantes do seu site e produtos teria impacto positivo na receita da sua empresa!

Acredito todos são motivos mais do que suficientes para rever a acessibilidade do seu site.

Quem é responsável por regulamentar a acessibilidade web?

Para você que não sabe, existe um órgão responsável por regulamentar a internet. Esse é órgão conhecido como WC3 ou World Wide Web Consortium. É a principal organização de padronização da World Wide Web. Consiste em um consórcio internacional com 450 membros, agregando empresas, órgãos governamentais e organizações independentes com a finalidade de estabelecer padrões para a criação e a interpretação de conteúdos para a web.

Esse órgão cria e mantém algumas diretrizes para a Word Wide Web (como é conhecida popularmente a internet). Entre as diretrizes que oWC3 mantém está o WCAG – Web Content Accessibility Guidelines. O WCAG é um guia com algumas diretrizes que devem ser respeitadas e seguidas para conteúdos digitais.

Quais são os níveis de acessibilidade web?

O WCAG classifica a acessibilidade web em três níveis de conformidade:

• A: Nível básico
• AA: Nível intermediário
• AAA: Nível avançado

Os níveis definem o quanto um site web é acessível com base em alguns critérios como: perceptível, operável, compreensível e robusto.

Se você quiser medir o nível de acessibilidade de um site, poderá utilizar o WCAG Report tool: https://validator.w3.org/.

Agora que sabemos um pouco mais sobre as diretrizes e quem as organiza e controla, vamos nos aprofundar um pouco!

Tipos de deficiência que prejudicam o acesso às páginas da web

• Visual: perda total ou parcial da capacidade de enxergar;
• Neurológica: algumas doenças como Alzheimer ou AVC;
• Fala: dificuldade ou impedimento em se comunicar por meio da voz;
• Auditivo: Perda total ou parcial da capacidade de ouvir sons;
• Cognitivo: transtornos ou déficits de atenção;
• Físico: perda total ou parcial de algum membro do corpo.

Esses são alguns exemplos BÁSICOS de deficiências que podemos encontrar no nosso dia a dia e que provavelmente irão limitar o acesso ao seu site e conhecer mais sobre você e seus produtos. Se você se empenhar em resolver alguns desses desafios no seu site, certamente irá beneficiar muitas pessoas.

Algumas dicas técnicas para que você torne o seu site mais acessível

• Sempre utilize ”Alt” em imagens; isso facilitará a leitura pelos leitores de telas;
• Sempre utilize “Descriptions” nos seus “Form Buttons”;
• Sempre coloque “Labels” nos seus Inputs;
• Preencha sempre os “Captions” e “Titles”;
• Utilize e respeite a semântica correta na programação do seu site;
• Sempre coloque um conteúdo alternativo nos seus conteúdos de mídia;
• Preocupe-se com o contraste das cores no seu site;
• Considere sempre o tamanho e a visibilidade dos textos no seu site;
• Nunca utilize sons de fundo no seu site.

Algumas dicas operacionais que vão auxiliar muito o usuário na navegação pelo seu site

• Para quem não tem um mouse, a hierarquia dos itens vai ajudar muito a navegação pelo teclado;
• Para melhor orientação do usuário, deixe bem claro o foco e a ordem dos componentes da navegação;
• Para que o usuário consiga saber de onde ele veio, mantenha um histórico bem claro e visual (“breadcrumbs” ou caminho de pão).

Dicas para evidenciar mensagens e deixar os textos mais claros para facilitar a navegação pelo seu site

• Mantenha sempre uma linguagem clara e de fácil leitura nos seus textos;
• Evite usar abreviações, pois o usuários podem não saber seus significados;
• Mantenha uma consistência na navegação pelo seu site;
• Deixe sempre visíveis mensagens de erro e sugestões.

Dicas de robustez para o seu site, procurando aumentar a velocidade e o peso dele

• Prestar muita atenção na nomenclatura e nos textos dos componentes das páginas;
• Assegurar a compatibilidade com navegadores, dispositivos e tamanho de telas.

Leitores de telas: o que são e para que servem?

Leitores de tela são programas ou aplicativos que convertem textos em sons. Geralmente, transformam os textos em uma voz sintetizada que é transmitida para o usuário, permitindo que ele ouça os sons/textos em vez de visualizá-los no seu site.

Atualmente, a maioria dos sistemas operacionais utilizados já possuem leitor de tela integrado, bastando ativar esse recurso no seu dispositivo utilizado. Além dos leitores de tela nativos, existem empresas especializadas nesse assunto que mantêm os seus leitores de telas. Abaixo, alguns dos principais utilizados no Brasil:

• DOSVOX – sistema de código aberto mais utilizado no Brasil, disponível para Windows ou para Linux;
• Orca – tecnologia assistiva livre, de código aberto, flexível e extensível, utilizada nas distribuições do GNU/Linux que se baseiam no ambiente gráfico GNOME;
• Nitrous Voice Flux – controle de computador por voz gratuito;
• IBM Via Voice – controle de computador por voz;
• NVDA – software livre de leitura de tela para Microsoft Windows com suporte para vários idiomas.
• YeoSoft Text to MP3 Speaker – leitor de tela em inglês e português;
• JAWS para Microsoft Windows – leitor de tela com suporte para vários idiomas;
• Virtual Vision – leitor de telas em português do Brasil.

Conclusão

Atualmente, a população do Brasil é aproximadamente 211 milhões de pessoas com 48 milhões possuindo algum tipo de deficiência. Segundo pesquisa da CNN Brasil, apenas 1% dos sites no Brasil possuem acessibilidade.

A acessibilidade, além de ser prevista em lei, é uma questão de ética ao garantir que todos tenham direito e condições de navegar e desfrutar do conteúdo de sites. Agora imagine se você puder unir essas duas imposições (legal e ética) e, ao mesmo tempo, incrementar o tráfego no seu site com aumento de receita e faturamento do seu site/empresa. O melhor dos dois mundos ou “doing well by doing good”.

Você que trabalha com web/digital, em quantos projetos você foi realmente abordado em que seria necessário aplicar o critério de acessibilidade?

Para finalizar este texto, deixo aqui uma frase para ponderação:

“O poder da web está na sua universalidade. O acesso de todos, independentemente da deficiência, é um aspecto essencial”.

Bibliografia

• W3C Org: https://www.w3.org/TR/UNDERSTANDING-WCAG20/conformance.html#uc-levels-head
• Todos Por Acessibilidade: https://www.youtube.com/c/TodosporAcessibilidade
• Wikipedia: https://pt.wikipedia.org/wiki/Leitor_de_tela
• CNN Brasil: https://www.cnnbrasil.com.br/nacional/brasil-tem-apenas-1-de-sites-com-acessibilidade/
• W3C: https://www.w3.org/WAI/standards-guidelines/wcag/
• Talita Pagani: https://www.linkedin.com/in/talitapagani/?originalSubdomain=br
• Acessibilidade Toolkit: http://acessibilidadetoolkit.com/
• Wikipedia: https://pt.wikipedia.org/wiki/Acessibilidade_web
• Brasil Media: https://www.brasilmedia.com/Acessibilidade-na-Web.html
• Catraca Livre: https://catracalivre.com.br/cidadania/lei-obriga-acessibilidade-na-internet/
• Izabelle Florence: https://izabelleflorence.com/pecha-kucha-presentation-web-accessibility/
• Accesibility: https://www.accessibility.works/

Leia também: Acessibilidade no e-commerce: desafios encontrados por pessoas com deficiência

O post Acessibilidade na web: baby steps apareceu primeiro em E-Commerce Brasil.

Na próxima semana farei mais um review com depoimento e resenha sobre Acessibilidade na web: baby steps. Espero ter ajudado a esclarecer o que é, como usar, se funciona e se vale a pena mesmo. Se você tiver alguma dúvida ou quiser adicionar algum comentário deixe abaixo.