Tecnologia é pra todo mundo

Como considerar a acessibilidade no processo de design de produtos digitais.

10 min readJul 5, 2022

No design, temos a falsa impressão de que o conceito de acessibilidade é apenas necessário quando envolve pessoas com alguma deficiência ou dificuldade, mas a realidade é que um design se torna mais completo quando pode ser utilizado por qualquer usuário, em qualquer lugar e a qualquer momento.

A natureza da acessibilidade

Tornar uma ferramenta acessível tem por conceito transpor os entraves que representam barreiras — sejam elas de origem técnica, visual, física ou cognitiva — promovendo a efetiva participação de todas as pessoas na realização de uma atividade, utilização de um produto ou serviço nos diversos âmbitos da vida social.

Além disso, alguns recursos projetados para ajudar pessoas com alguma deficiência geralmente também ajudam outras pessoas, como as legendas nos vídeos de redes sociais que tem como principal função ajudar pessoas com dificuldades auditivas, mas também podem facilitar a navegação daquele usuário que está rolando o feed com o som desligado.

Quando priorizamos a inclusão como um parâmetro essencial, não estamos somente promovendo a inclusão, mas também estamos gerando valor e beneficiando todos os usuários.

Acessibilidade é sobre pessoas

Antes de falar sobre ferramentas, precisamos nos aprofundar em algumas definições que ajudam a compreender melhor as necessidades das pessoas usuárias para as quais estamos projetando uma solução.

Uma das principais diferenças que precisamos entender está entre os conceitos de Igualdade e Equidade. O objetivo de ambos os conceitos é o mesmo: promover justiça de oportunidades. Entretanto, a forma como esse objetivo é alcançado varia com uma distinção fundamental.

Igualdade está baseada em tratar todas as pessoas da mesma forma, entregando os mesmos recursos e suporte para todos, igualmente;
Equidade parte do princípio de que não somos todos iguais e é preciso considerar esses desequilíbrios, adequando diferentes recursos e suportes de forma proporcional para garantir que todos tenham as mesmas oportunidades.

Design também é sobre pessoas.

No design, existem alguns processos que envolvem o mesmo objetivo mas que também funcionam de formas diferentes:

Design Universal: aborda questões de usabilidade e tem a intenção de ser inclusivo mas resulta em uma solução única que nem sempre atende às necessidades específicas de todo o público alvo. Como roupas de tamanho único: a intenção é boa, mas não serve pra todo mundo.
Design Inclusivo: desenvolve produtos com o princípio de que solucionar um problema para um determinado grupo pode estender os benefícios para muitos outros, considerando aspectos culturais, sociais, habilidades, raça, status econômico, linguagem, idade, gênero, entre outros.
Design Equitativo: envolve projetar propositalmente para grupos historicamente excluídos, ignorados, marginalizados ou sem representatividade na indústria, visando adequar a solução diretamente para suas necessidades específicas,

Quando focamos na equidade, reconhecemos a diversidade de contextos, particularidades, dores e necessidades de cada grupo e podemos, a partir disso, alocar os recursos necessários para atingir o potencial máximo da ferramenta que estamos desenvolvendo, construindo produtos ao mesmo tempo acessíveis e justos.

Alguns princípios e boas práticas

De acordo com a WCAG 2.0, podemos utilizar algumas abordagens para criar um conteúdo acessível, sobretudo torná-lo:

Perceptível: providenciar a melhor forma de apresentar a informação, através de textos, mídias e layout alternativos (mais simples) ou separação de background, tornando o conteúdo mais simples de ser lido e ouvido;
Operável: tornar todas as funcionalidades acessíveis pelo teclado, providenciar tempo para leitura e utilização de conteúdo, evitar animações extravagantes que possam causar desconfortos, convulsões ou competir com o conteúdo e providenciar ajuda para navegação e visualização de status do sistema;
Compreensível: elaborar textos claros e concisos, ações previsíveis e prevenção de erros;
Robusto: maximizar a compatibilidade com tecnologias atuais e futuras, incluindo assistência virtual;

Considere as dificuldades

Mais de 1 bilhão de pessoas no mundo vivem com alguma deficiência, seja ela de qualquer nível ou origem. Além disso, toda semana, milhões de pessoas acessam a internet pela primeira vez.

É fundamental que os produtos e serviços tenham seu desenvolvimento centrado nesses usuários com uma boa usabilidade e, embora as restrições de cada grupo sejam variáveis, algumas implicações de design são similares e podem facilitar o acesso desses grupos à tecnologia.

É interessante ter atenção quanto às dificuldades:

Visuais: usuários com condições como miopia, daltonismo, epilepsia ou pessoas cegas podem ter dificuldades com baixos contrastes, nformações ocultas em links, cores como única identificação de ação, layout complexo e conteúdo desorganizado e separação entre a ação e seu contexto (como botões e campos de formulário);
Motoras: usuários com deficiências e limitações físicas, falta de força ou convulsões e espasmos podem dificultar atividades como: uso do mouse com necessidade de precisão de click, diferentes ações agrupadas ou muito próximas, mensagens exibidas em curtos períodos de tempo (pop-ups) e digitação e rolagem excessivas;
Auditivas: com diferentes níveis de severidade, incluindo perda total da audição, os usuários com limitações auditivas podem ter problemas com: conteúdo disponível apenas em áudio ou vídeo, estrutura dependente de tamanho de texto e posicionamento, longos blocos de conteúdo e telefone como único meio de comunicação;
Cognitivas: usuários com dislexia, dificuldade de aprendizado ou autismo podem ter dificuldades com: contrastes brilhantes, figuras de linguagem e expressões idiomáticas, palavras sublinhadas, em itálico ou em caixa alta, memória de páginas ou ações anteriores, depender de ortografia correta para realizar uma ação ou botões vagos e imprevisíveis.

Além disso, limitações que envolvem aspectos culturais, sociais, habilidades, raça, status econômico, linguagem, idade, gênero, lesões permanentes, ou restrições físicas/psicológicas circunstanciais também podem dificultar o acesso à tecnologia, como por exemplo:

Dispositivos: Usuários com celulares antigos que precisam carregar web;
Localização: Usuários que moram em zonas rurais sem acesso à internet ou que estão inseridos em diferentes culturas e linguagens e precisam entender o conteúdo disponível;
Status econômico: Usuários com limitações de dados para internet que precisam de um carregamento mais leve das páginas;
Tempo limitado: Usuários que precisam realizar ações remotas da forma mais rápida e eficiente possível;
Idade: Crianças e idosos podem ter perspectivas diferentes de entendimento das ações e elementos de layout;
Gênero: Em alguns casos, mulheres podem ter restrições de acesso e permissões a alguns serviços ou ter dificuldade de encontrar conteúdo confiável, podendo sofrer assédios e perseguições;
Circunstanciais: Uma pessoa com o braço quebrado precisa realizar ações com o uso de uma mão só.

Busque conhecimento

A acessibilidade para produtos digitais já não é mais um diferencial competitivo, mas sim um fator fundamental que pode afetar diretamente no sucesso de um produto ou negócio.

A inclusão digital também já está prevista na LBI (Lei Brasileira de Inclusão) de 2016 e no Decreto nº6949 de 2009. Tais normativas surgiram como forma de evitar barreiras tecnológicas, que dificultam ou impedem o acesso da pessoa com deficiência às tecnologias.

Além disso, o algoritmo do Google, por exemplo, leva em consideração alguns fatores referentes à acessibilidade digital para colocar determinado produto em posição de relevância nas pesquisas.

Destacamos algumas estratégias que podemos adotar para construir uma mentalidade voltada para produtos digitais acessíveis.

1. Aprenda sobre comunidades locais

Participe de meetups sobre acessibilidade com profissionais que tratam de regiões ou temáticas específicas para conhecer melhor os diferentes usuários e suas possíveis necessidades.

Existem comunidades online que trabalham especificamente para garantir a acessibilidade em diferentes dispositivos e sites e alguns grupos podem ajudar com consultorias online, como o Movimento Web para todos e o serviço de tecnologia assistiva da Universidade de Washington.

2. Represente diferentes grupos

Explore diferentes etnias, estilos, habilidades físicas e classes sociais para elaborar personas e representar usuários em ilustrações e imagens.

3. Teste com pessoas que possam ter alguma dificuldade

Inclua participantes com dificuldades nas personas, pesquisas e testes de usabilidade. ONGs e comunidades locais podem ajudar com essa ponte.

4. Empodere os usuários sobre sua segurança e privacidade

Alguns usuários precisam de ajuda para realizar atividades que exigem input de dados privados, como pagar contas e criar contas, por exemplo.

Deixe-os confortáveis para dividir informações pessoais dando mais transparência às opções de privacidade.

Posicione as opções e controles de privacidade em espaços claros e fáceis de encontrar;
Explique claramente sobre o uso de dados do seu produto;
Acione canais de comunicação para receber feedbacks e tirar dúvidas específicas.

5. Estruture um bom HTML

Valide se o conteúdo está publicado diretamente no HTML para permitir que a tecnologia assistiva interprete corretamente as informações necessárias para adaptação e transcrição de conteúdo.

Algumas ferramentas podem ajudar nesse processo:

The WC3 Markup Validation Service: ajuda a validar a linguagem e encontrar erros que podem impedir que leitores de texto traduzam o conteúdo.
ARIA Landmark Roles: especificação que significa que aprimora os atributos do HTML para facilitar o escaneamento de textos.
Testes de Acessibilidade: os testes e plugins verificam a acessibilidade do seu site, comparando com um banco de dados e com diretrizes baseadas na WCAG. Outras ferramentas que ajudam a testar: Site improve, Ases web e Wave.

6. Projete para dispositivos modestos e baixas conexões

Reconheça que alguns usuários podem ter dispositivos mais velhos e com tecnologia limitada de armazenamento e/ou acesso a internet e:

Teste seu layout com uma resolução de 480 x 800 px;
Reduza o tamanho do seu aplicativo e ofereça uma versão light, quando possível;
Controle processos para minimizar o uso da bateria de dispositivos móveis;
Disponibilize o conteúdo off-line e ofereça indicadores de progresso;
Renderize o conteúdo progressivamente;
Teste seu produto em modo avião para simular baixa conectividade;
Minimize as atualizações para alterações relevantes e explique para o usuário o que foi aprimorado;
Permita que o usuário teste seu produto de forma gratuita;
Teste seu produto em modo retrato e paisagem;
Dê um zoom para checar se seu design tem alguma quebra de layout acima de 200%;

7 . Priorize o uso do teclado

Algumas pessoas podem ter dificuldades para utilizar o mouse e precisam de ferramentas que exijam um baixo esforço físico. Para isso:

Considere projetar para telas móveis e touch screens e teste a navegação por todo o conteúdo através do teclado ou comando de voz;
Agrupe as ações em áreas específicas da tela, diminuindo assim o movimento em diversas áreas e regiões;
Permita que o usuário personalize as configurações, preferências e meios de comunicação sempre que possível.

8 . Minimize erros e comunique o status do sistema

Também conhecidas como 1ª e 5ª Heurísticas de Nielsen: previna os possíveis erros de navegação e forneça ajuda para fazer e desfazer ações.

Crie avisos de fácil compreensão, que possam ser notados e diminua a carga cognitiva através de pop-ups de confirmação ou avisos informativos;
Permita a ação de desfazer, de forma fácil e rápida;
Inclua botões de ação e notificações dentro do contexto do fluxo;
Apresente feedback do sistema e mantenha a comunicação com o usuário antes, durante e depois de completar alguma tarefa;

9. Atenção ao diagramar seu layout

Mantenha um layout simples, consistente, linear e lógico para auxiliar leituras dinâmicas e pessoas com dificuldades cognitivas e elimine complexidades desnecessárias.

Utilize legendas e transcrições para descrever imagens;
Forneça um espaçamento apropriado para uso, alcance e manipulação de componentes, independentemente do tamanho do corpo do usuário, postura ou mobilidade — o tamanho médio da impressão digital do dedo indicador de um adulto é de 1,6 a 2 cm, aproximadamente 60 a 76 px.
O tamanho mínimo recomendado para um elemento clicável deve ser de 48x48px;
Forneça atalhos;

10. Reflita sobre sua paleta de cores

Busque utilizar bons contrastes e cores simples para a identidade visual de seu produto e considere permitir a alteração de contraste entre fundo e texto.

Além disso, cores podem carregar significados diferentes para diferentes culturas, portanto pesquise e teste bastante antes de lançar seu produto.

Um bom contraste obedece a proporção de 4,5:1 para textos normais e 3:1 para títulos (ou textos maiores que 18px);
Teste seu produto em telas dimerizadas ou na luz do sol e use plugins para simular e escanear a perspectiva de usuários com baixa visão e daltonismo;
Utilize elementos visuais em conjunto com as cores para indicar ações, status ou contextos: parear textos e ícones com as cores pode ajudar o usuário a reconhecer padrões e decidir ações mais facilmente.

11. Atenção ao formatar textos

Considere traduções para diferentes idiomas e teste na sua interface, evite jargões e termos técnicos e escreva de forma simples e clara, utilizando palavras e expressões de fácil compreensão.

Além disso, tenha atenção à formatação:

Faça uma combinação harmônica entre formas, cores e textos e use imagens para auxiliar na compreensão do conteúdo;
Aumente o tamanho de componentes e fontes de texto legíveis para acessibilidade visual;
Resuma o conteúdo para textos curtos, divididos em subtítulos, frases e marcadores simples;
Mantenha o alinhamento a esquerda;
Forneça grandes áreas clicáveis;
Coloque títulos auto descritivos em links e botões;

12. Abuse das tecnologias disponíveis

Busque sempre desenhar páginas leves, com rápido carregamento e informe-se sobre as atualizações de ferramentas para utilizar sempre que possível.

Existem muitas ferramentas disponíveis no mercado para auxiliar na elaboração de design inclusivo, como:

Dispositivos de áudio ou sintetizadores de voz;
Leitores de tela com destaque de frases;
Dispositivos táteis;
Comandos de voz;
Mouse com controle por movimento da cabeça ou boca ou identificação de ponto focal;
Assistência visual através de chamadas de vídeo;
Tradução em libras.

Seja criativo

Elencamos uma série de estratégias para ajudar a pensar seu projeto em relação à acessibilidade, mas você não precisa engessar essa lista!

O caminho ideal envolve entender o problema que precisa ser resolvido, pesquisar e entender os usuários afetados por este problema e utilizar as melhores ferramentas disponíveis para cada ponto que precisa ser validado.

Isso pode incluir estratégias de negócio, frameworks de design, tempo e esforço de desenvolvimento e custo, bem como outros fatores que precisam ser colocados dentro do seu planejamento.

Portanto, pesquise, participe de eventos e se informe a respeito desse tema!

Um design inclusivo pode abrir portas importantíssimas para que usuários ao redor do mundo tenham participação no desenvolvimento das tecnologias que os circundam.

Ao projetar de forma acessível, tomando decisões intencionais e contextualizadas, podemos empoderar pessoas a viver de forma mais independente, afinal, o acesso à tecnologia deve estar disponível para todos.

Artigo publicado para o blog da Accurate Software em 22 de Agosto de 2021.