Segundo o Google, criar aplicativos acessíveis garante igualdade de acesso a cerca de um bilhão de pessoas com deficiência no mundo todo. Os aplicativos acessíveis também podem oferecer melhores experiências para usuários sem deficiência: proporcionar acessibilidade significa dar atenção aos detalhes e a como seus usuários interagem com seu aplicativo.

As necessidades especiais mais comuns que podem afetar o uso de um app são cegueira ou baixa visão, daltonismo, surdez, deficiências cognitivas e restrição das habilidades motoras. Existem tecnologias assistivas que ajudam a aumentar e melhorar as capacidades de acesso das pessoas com deficiência, como leitores de tela, dispositivos de ampliação, aparelhos auditivos e auxiliares de memória. O Android, por exemplo, funciona com o leitor de tela do Google TalkBack.

Além dessas tecnologias, também devemos considerar alguns recursos e cuidados básicos para que você possa alcançar um público muito maior. Neste artigo, vou falar sobre o que ter em mente ao planejar um app para garantir que ele seja acessível.

Descrição ativa nos elementos da tela

No momento do desenvolvimento do aplicativo, cada item presente em uma tela pode ser descrito e etiquetado para que, quando um usuário acessar via leitores de tela ou dispositivos de tecnologia assistiva, como TalkBack no Android, VoiceOver no iOS e JAWS na área de trabalho, o item seja lido para ele em voz alta. Caso essa categorização não seja feita da maneira correta, uma pessoa com baixa visão ou motoristas que colocam o celular em modo leitor enquanto dirigem acabarão abrindo um aplicativo sem som e inutilizado, pois quando o leitor passa por algum item com o campo da etiqueta vazio, ele não faz leitura. Logo, esses usuários ficam sem acesso às interfaces de teclado e não podem concluir tarefas no aplicativo.

Uma pessoa com baixa visão ou motoristas que colocam o celular em modo leitor enquanto dirigem acabarão abrindo um aplicativo sem som e inutilizado.

Por isso, a equipe de desenvolvedores deve adicionar atributos como o “contentDescription” a todos os componentes, como botões, ícones, imagens e guias, incluindo aqueles que não possuem texto visível, para que haja possibilidade deles serem acessados apenas por teclado. Esses rótulos explicam o significado e a finalidade de cada elemento interativo para os usuários. Procure manter essas descrições curtas e diretas, para não deixar difícil e demorada a navegação dos usuários.

Sugestões visuais

Considerando usuários daltônicos, monocromáticos ou que não possam identificar diferenças entre algumas cores, o procedimento mais indicado é incluir elementos de design como traços, padrões e texto descrevendo ações e conteúdo junto às cores, garantindo que eles continuem recebendo a informação.

No primeiro exemplo acima, o erro de falta de espaço no campo de texto está sendo avisado apenas pelo cursor colorido em vermelho – recurso que não é percebido por um usuário que não identifica essa cor ou até mesmo por uma pessoa desatenta. Já no segundo exemplo, oferecido pelo guia de usabilidade do Android, mais dicas mostram o erro: a cor do título muda e aparece uma mensagem clara abaixo do campo de texto explicando a quantidade limite de caracteres possíveis. A segunda maneira garante muito mais abrangência a diversos públicos sendo, portanto, a mais indicada como acessível.

Avalie também se seu projeto tem botões, imagens e linhas claras, de maneira que o layout facilite a navegação. Os elementos precisam estar visíveis, em tamanho suficiente para serem vistos.

Cores e contrastes

‍

Usuários com baixa visão ou pessoas que costumam baixar o brilho da tela do celular podem ter dificuldade em ler informações. Para facilitar a navegação, você pode aumentar as relações de contraste entre as cores de primeiro plano e de fundo em seu aplicativo. Considere também trabalhar com uma paleta de cores acessível, para que mais pessoas possam ver e usar suas telas sem dificuldades.

Os elementos decorativos, como logotipos e ilustrações, também precisam ser distinguíveis, principalmente se possuírem funcionalidades importantes. Os daltônicos, por exemplo, tem um distúrbio da visão que interfere na percepção das cores, com dificuldade para distinguir o vermelho e o verde ou, com menos frequência, o azul e o amarelo. Observe a diferença de telas sem contraste e com contraste:

Som

Para enviar sua mensagem claramente a usuários com deficiência auditiva, considere usar alternativas visuais ao som, como legendas e transcrições. Além disso, todos os materiais de vídeo e de áudio devem oferecer controles que permitam que os usuários possam pausar a reprodução, aumentar ou abaixar o volume e incluir ou desativar legendas.

Elementos touch

Os chamados touch targets são as partes da tela que respondem ao toque do usuário, mesmo que estejam além do limite visual de um elemento. Por exemplo, se você oferece como ícone de busca uma lupa, mesmo que ela seja pequena por conta do layout projetado para o seu aplicativo, é ideal que a área em volta do ícone também responda ao toque, para atender a todos os usuários, incluindo os que tiverem alguma dificuldade em clicar, como mostra a figura abaixo:

A área pintada de rosa representa o espaço da tela que responderá ao toque do usuário. O tamanho do touch target deve ser de no mínimo 48 x 48 dp (unidade de medida abstrata baseada na densidade da tela, correspondente a 1 pixel em uma resolução de tela de 160dpi, a resolução base), o correspondente a cerca de 9mm, independentemente do tamanho da tela, segundo as orientações do Android para Desenvolvedores.

Ao fornecer áreas de toque maiores, você torna substancialmente mais fácil para os usuários navegarem no seu aplicativo. Caso o seu público alvo seja infantil, pode ser interessante usar touch targets ainda maiores, para garantir que as crianças em fase de desenvolvimento das habilidades motoras tenham uma boa experiência.

Outro ponto a se considerar é o espaçamento entre um touch target e outro: caso os dois estejam colados, é possível que o usuário tente clicar em um, mas acabe clicando em outro - imagine, por exemplo, a dificuldade de uma pessoa com dedos grandes tentando digitar num teclado pequeno de smartphone. Para garantir a usabilidade e o equilíbrio de informações no seu layout, considere separar cada touch target do outro por 8dp de espaço, no mínimo.