Acessibilidade Digital: Como tornar o teu website mais acessível → Acessibilidade é a capacidade de tornar um conteúdo acessível a diferentes dispositivos ou diferentes utilizadores. Tornar a web acessível não beneficia apenas pessoas com deficiências permanentes, mas também beneficia a comorbilidades provisórias como, por exemplo, partir um braço, uma cirurgia ocular, etc. A acessibilidade é uma necessidade. Disponibilizar o conteúdo para diferentes utilizadores, em diferentes situações, de forma que todos possam acedê-lo é uma contribuição para que a internet se torne universal.
O estado da Acessibilidade Digital no Mundo
O Digital Report de 2023, da DataReportal, destacou um relatório “2022 Business Disability Forum Survey”, que alertou para o facto de 42% dos respondentes não conseguirem completar uma compra online, devido a websites e aplicações inacessíveis.
O mais recente relatório da Web Accessibility In Mind (WebAIM), ao analisar um milhão de websites, verificou que, em fevereiro de 2021, 97,4% das home pages apresentava pelo menos uma falha no que toca ao cumprimento das diretrizes do W3C.
Esta tabela identifica os erros mais comuns identificados nos websites, segundo as regras WCAG como, por exemplo, baixo contraste, falta de texto alternativo nas imagens, botões e links vários, entre outros. Na tabela abaixo é identificado quais é que são os segmentos de mercado que mais e menos erros cometem.
Para quem é a acessibilidade digital?
A Acessibilidade Digital é para todos. As deficiências que podem condicionar o acesso à web podem ser classificadas em 5 diferentes tipos: Visuais, Auditivas, da Fala, Motoras e Cognitivas. A acessibilidade não é útil apenas para deficiências permanentes, mas também para comorbilidade provisórias e para vários níveis de dificuldade de acesso à Web, por não sabermos ler, escrever ou interpretar.
Sabias que há websites em Portugal que têm disponível uma solução de Linguagem Gestual? – Exemplo: Website da Câmara Municipal de Bragança
Segundo o Gabinete de Estratégia e Planeamento do Ministério do Trabalho, Solidariedade e Segurança Social (GEP/MTSSS), em 2016, em Portugal:
- 9% da população tinha muita dificuldade em ver;
- Mais de 68 mil portugueses não conseguia compreender os outros ou fazer-se compreender;
- Mais de 27 mil portugueses não conseguia ver;
- 0,3% da população não consegue ouvir;
A acessibilidade digital torna a internet disponível para todos.
Porquê é que os websites devem ser acessíveis?
De acordo com o Decreto-lei n.º 83/2018, de 19 de outubro, é obrigatório que todos os sítios Web publiquem a sua Declaração de Acessibilidade. O prazo para o fazer terminou a 23 de setembro de 2020.
Na UE o standard que contém os requisitos de acessibilidade aplicados à Web e às aplicações móveis é a Norma EN301549. Esta não é mais do que uma cópia do standard WCAG 2.1 conformidade ‘AA’. Em Portugal esses requisitos constam do RNID conforme decretado pelo DL n.º 83/2018.
Tecnologias para auxiliar na acessibilidade digital
Leitor de ecrãs
O leitor de ecrãs permite ao utilizador com deficiência visual “ouvir” o conteúdo web que está no ecrã do dispositivo.
Navegador Textual
O navegador textual carrega apenas textos, sem imagens ou outros conteúdos ilustrativos. Usado por pessoas com alguma dificuldade visual total ou parcial ou por conexões lentas à Internet.
Display em Braile
O display em braile é um dispositivo de saída que imprime textos em braile. A partir de circuitos eletrónicos e mecânicos, imprime as letras num dispositivo tátil no sistema braile.
Navegador com voz
O Navegador com voz permite a navegação através de comandos de voz. Usado por pessoas com alguma incapacitação motora.
Ampliar os ecrãs
Este é um tipo de software que amplia textos para quem tem dificuldade em ler.
A Equalweb é uma aplicação que junta tudo isto num só local, possibilitando ter soluções inclusive bem mais complexas. Esta aplicação é utilizada, por exemplo, para websites como a Zara e a Zara Home.
Resumo de Boas Práticas para o desenvolvimento de websites acessíveis
Existem inúmeras boas práticas para o desenvolvimento de websites como, por exemplo:
- Especificar o idioma do site (através do atributo ‘lang’ do HTML5)
- Usar a semântica do HTML 5 (os leitores de ecrã interpretam a estrutura de HTML e alguns podem ler os conteúdos da seguinte forma: “paragrafo: [texto]”.
- Contraste – do texto. O contraste é fundamental para a legibilidade.
- Navegação via teclado – a partir de teclas de atalhos, por exemplo. Alguns leitores de ecrã já vêm com algumas teclas de atalho importantes.
- Assegurar que a informação de um determinado elemento, como um link, não depende de cores. Por exemplo, um botão que ser verde para indicar uma ação positiva, poderá não ser interpretado corretamente por um daltónico.
- Escolher fontes e cores legíveis.
Ainda assim, existem algumas recomendações da W3C para o desenvolvimento de sites acessíveis.
WCAG (Web Content Accessibility Guidelines)
A WCAG (Web Content Accessibility Guidelines) é um conjunto de recomendações da W3C (organização que junta indivíduos e organizações de todo o mundo com o objetivo comum de desenvolver os standards para conteúdo acessível da web que colmate as necessidades dos indivíduos, organizações e governos internacionalmente).
Sabias que as regras de acessibilidade do (W3C) foram introduzidas na Comunidade Europeia há cerca de 20 anos e que Portugal foi o primeiro Estado-membro a aderir às respetivas diretrizes?
Esta organização disponibiliza um documento com boas práticas divido da seguinte forma em:
- Princípios são a base para a acessibilidade na Web;
- Diretrizes são os 12 objetivos básicos sobre os princípios;
- Critérios de sucesso para cada diretriz há critérios para cumprir, que vão de A (mais baixo) a AAA (mais alto);
- Técnicas
Princípio nº1 – Ser Percetível
O utilizador deve conseguir perceber o conteúdo. Este, não pode ser invisível para alguns sentidos.
#Diretriz 1.1 – é necessário ter alternativas em texto a imagens ou diagramas
- Dica 1: usar o atributo ALT nas imagens.
<img src=”logo.jpg” alt=”Este é o Logo da Empresa”>
- Dica 2: Colocar os links para uma página a explicar os diagramas que tenham na página.
- Dica 3: nos formulários, indexar os inputs aos respetivos labels, ou colocar um title nos inputs caso ELES NÃO TENHAM LABEL, ou para inputs tipo img, colocar um alt.
<label for=”email”> Insira seu email <label>
<input type=”text” title=”Código de Área”>
<input type=”img” alt=”Enviar Formulário”>
- Dica 4: informar em código quais é que são os elementos não textuais que devem ser ignorados pelas tecnologias assistivas, basta inseri-lo via CSS. O exemplo em baixo é com uma imagem como background
div {
background: ulr(‘imagens/minha_imagem.jpg’) no-repeat;
}
#Diretriz 1.2 – conteúdo em áudio e vídeo
- Dica 1: oferecer um texto alternativo, como uma transcrição do vídeo ou do áudio.
- Dica 2: possibilidade de colocar linguagem gestual.
#Diretriz 1.3 – adaptável
- Dica 1: usar bastante a semântica HTML.
- Dica 2: não criar conteúdo que dependa de forma, cor ou qualquer característica que dependa da visão ou audição.
#Diretriz 1.4 – discernível
- Dica 1: oferecer formas para que o utilizador possa alterar o tamanho das fontes
- Dica 2: oferecer formas para que o utilizador consiga ajustar o contraste na página
- Dica 3: caso o website tenha áudio automático, após 3 segundos o utilizador deve ter uma forma de controlar este áudio
Princípio #2 – Ser Operável
O conteúdo deve ser acessível de forma que qualquer utilizador possa interagir com ele, de forma a que este seja operável e o teu website seja digitalmente acessivel.
- Dica 1: utilizar cabeçalhos para estruturar os títulos das seções da página.
- Dica 2: criar uma sequência lógica entre os links da página.
- Dica 3: utilizar breadcrumbs no topo da seção para que o utilizador saiba onde está na página, ou num conjunto de páginas.
#Diretriz 2.1 – acessível via teclado
- Dica: disponibilizar uma navegação alternativa via teclado.
#Diretriz 2.2 – tempo suficiente
- Dica: dê ao utilizador tempo suficiente para navegar pela página e ler o conteúdo
#Diretriz 2.3 – convulsões
- Dica: não colocar elementos na página que pisquem mais do que 3 vezes num segundo.
Princípio #3 – Ser Compreensível
Toda a interface precisa de ser intuitiva e compreensível para conseguires ter um website com acessibilidade digital.
#Diretriz 3.1 – legível
- Dica: utilizar o atributo lang do HTML para que os mecanismos de leitura de ecrãs possam saber qual é a linguagem que está em cada página.
#Diretriz 3.2 – previsível:
- Dica: não criar menus dropdowns que apenas surgem ao utilizador quando este passa o rato por cima, pois dificulta a sua interação.
#Diretriz 3.3 – Assistência
- Dica 1: fornecer mecanismos para que o utilizador não cometa erros.
- Dica 2: caso o utilizador cometa erros, devemos informar qual é o erro cometido e como corrigi-lo.
Princípio 4 – Ser Robusto
O conteúdo deve ser construído de forma a que qualquer utilizador consiga aceder com qualquer tecnologia de acesso à web.
#Diretriz 4.1 – compatível
Usar e abusar da semântica HTML e construir páginas que possam ser compatíveis com a maioria dos dispositivos, inclusive com tecnologias assistivas.
Através do Website de Acessibilidade do governo é possível calcular qual o nível de conformidade dos websites com estas regras.
Exemplos: O website da Zara Home segundo a ferramenta governamental que avalia a acessibilidade em Portugal teve uma pontuação de 8.8 em 10.
Tornar os websites e aplicações acessíveis irá permitir-te não só estar em conformidade com a lei, mas também a possibilidade de obter uma certificação – Certificação de Maturidade Digital (incm.pt).
Conclusão:
A acessibilidade digital é uma necessidade. Disponibilizar o conteúdo para diferentes utilizadores, em diferentes situações, de forma que todos possam acedê-lo é uma contribuição para que a internet se torne universal. Seguir os critérios supramencionados e aplicar estas dicas é tornar todos os teus ativos digitais mais acessíveis.
Esperamos que tenhas gostado de ler sobre Acessibilidade Digital. Deixa-nos o teu comentário sobre o assunto a baixo, e não te esqueças de deixar algum amor à nosso autora Inês Dias.
Inês Dias
Olá, eu sou a Inês! E adoro t-shirts com frases. Sou licenciada em Ciências da Comunicação, com especialização em Publicidade e Relações Públicas e mestre em Negócio Eletrónico.
O meu quotidiano profissional inclui gerir redes sociais, tráfego pago e lojas online. Apaixona-me o Marketing Digital, a criação de estratégias e fazer o check nos KPI’s 😉
Estou aqui para te ajudar em temas como redes sociais, e-mail marketing, anúncios no universo Meta e Google e lojas online (se forem construídas em Shopify consigo ser ainda mais útil 😊).