Acessibilidade no Design de Interação: exemplos e recomendações

André Grilo, Ph.D.
Tableless
Published in
6 min readJan 11, 2016

Acessibilidade é um assunto que ainda precisa ser muito discutido no contexto dos produtos digitais. Principalmente em tempos nos quais surgem, a cada dia, novas formas de interação. As tecnologias precisam acompanhar o ritmo e limitações de seus usuários. Entende-se que o bom design deve ser utilizável por qualquer pessoa, mas nem sempre isso ocorre, principalmente porque nos falta reforçar culturalmente a praxe da acessibilidade.

Acessibilidade e Usabilidade: dois lados da mesma moeda (UX)

Há uma relação muito forte entre acessibilidade e usabilidade. Ao pensarmos nos propósitos de cada uma, parecerá que estamos falando da mesma coisa, pois atuam como uma amálgama. Ambas conversam e chegam a uma mesma conclusão: uma experiência centrada no usuário.

A usabilidade presume um produto contextualizado aos objetivos e necessidades dos usuários [1] e, por esse motivo, trabalha com as especificidades desses sujeitos para proporcioná-los experiências adequadas.

Ao pensarmos nas especificidades dos usuários, devemos considerar todos os potenciais utilizadores, incluindo aqueles com deficiência, o que naturalmente incorpora as limitações que eles possuem. Isso traz a acessibilidade para dentro do projeto e, com ela, uma série de questões que farão parte do processo de design. Acessibilidade é, portanto, um componente primordial na usabilidade digital.

É importante lembrar que acessibilidade em produtos digitais não se limita a versões de alto contraste ou navegações via tecla tab. É preciso pensar em inovações voltadas para esses públicos.

Um bom exemplo disso é o Aipoly Vision App [2], uma belíssima solução para usuários com deficiência visual. O aplicativo auxilia a detectar os objetos e itens do ambiente. Por meio do reconhecimento visual, ele informa o nome das coisas e dos produtos a partir da câmera do smartphone.

Aqui no Brasil, tem muita gente pensando em como solucionar a experiência das pessoas com deficiência a partir da perspectiva tecnológica. É o caso de um canal de receitas culinárias no Youtube que transmite o conteúdo em Libras para seus usuários. Libras, a saber, é a Língua Brasileira de Sinais, muito utilizada pelos surdos e ensurdecidos em várias localidades do país. Essa forma de comunicação possui algumas características únicas na sua sintaxe e léxico, o que produz uma demanda diferenciada de conteúdo para esse público. Pensando nisso, o Laboratório de Aplicações de Vídeo Digital (LAViD), da UFPB, com apoio do Ministério do Planejamento, Orçamento e Gestão e outros órgãos federais, desenvolveram a plataforma VLibras, um tradutor de textos que exibe uma animação em Libras traduzindo os textos selecionados.

Nota/revisão: embora esses recursos sejam úteis e válidos em determinados contextos, não substituem a tradução e interpretação humana da língua de sinais. Surdos costumam apreciar e assimilar com mais eficácia a sinalização da LIBRAS quando executada por outras pessoas, além de estabelecer uma conexão identitária e cultural por ser considerada a língua do povo surdo.

Principais recomendações

Durante o Global Accessibility Awareness Day de 2015, o braço paulista da User Experience Professional Association (UXPA/SP) reuniu designers de interação, desenvolvedores e especialistas para compartilhar cases e práticas sobre o assunto. Clécio Bachini, desenvolvedor de longa estrada em projetos digitais, proferiu uma palestra bem didática em cima do tema: “Projetando para a acessibilidade digital” [3]. O vídeo na íntegra (20min) está logo abaixo. Fiz um resumo dos principais tópicos.

Bachini considera fundamental que haja uma mentalidade voltada a produtos digitais acessíveis, e busca desmistificar determinados discursos acerca do tema. Para ele, a acessibilidade deveria ser tratada com a mesma naturalidade de outras fases, porém de forma não-trivial, perpassando transversalmente toda a gestão do projeto — planejamento, arquitetura da informação, implementação etc. Segundo Clécio, é necessário envolver o time como um todo no processo de concepção da acessibilidade de um site, sistema ou aplicação para web.

“É Lei, não é bondade.”

Clécio inicia a sua fala chamando atenção para as implicações jurídicas dos produtos digitais, que devem oferecer acessibilidade aos usuários. Não é uma questão que depende da boa vontade de A ou B, mas uma prática a ser adotada em nível federal, prevista pelo decreto nº 6949/2009.

“O projeto não tem que ser ‘consertado’ para acessibilidade. Ele tem que ser PENSADO para acessibilidade.” (Clécio Bachini)

Com essa afirmação, Bachini destaca que a acessibilidade deve estar nos objetivos do projeto desde o início, e não algo a ser “remendado” no produto. Abaixo seguem as recomendações proferidas na palestra.

  • Contar uma história: as informações da página devem estar estruturadas numa linha lógica. O conteúdo deve ser pensado consoante a quem irá receber a mensagem. Portanto, objetividade e uma sequência narrativa das informações são essenciais.
  • Manter a simplicidade: isso diz respeito não apenas à organização do conteúdo, mas à estruturação e hierarquia informacional, como níveis e subníveis de navegação. Redução de passos é fundamental.
  • Preocupar-se com a semântica básica: isso se refere principalmente aos seletores e propriedades de elementos HTML (h1, h2, textos alternativos de imagens), mas vai além da navegação via tecla tab. Aliás, Bachini diz que há outras formas de navegação por teclado, por meio de atalhos, teclas numéricas, entre outros recursos que os utilizadores lançam mão ao navegarem.
  • Acrescentar elementos paliativos: os elementos paliativos são aqueles que podem ser inseridos no código para transmitir a informação de maneira adequada ao usuário, permitindo, por exemplo, que o texto “09/01/2016" seja lido como “nove de janeiro de dois mil e dezesseis”. As especificações semânticas que viabilizam isso durante a codificação chamam-se ARIA (Accessible Rich Internet Applications). Bachini afirma que estes são recursos e reforço e devem ser dosados ao longo do código durante a implementação.
  • Preocupar-se com o contraste: outro importante aspecto. A boa escolha das cores e tipografia produzem melhor rendimento e legibilidade dos textos. Consequentemente, a ergonomia informacional será melhor para o indivíduo.
  • Realizar testes: sempre que possível, testar a solução com os recursos utilizados pelas pessoas com deficiência, como o leitor de tela, o navegador Lynx (que renderiza apenas os conteúdos de texto da página ou aplicação web). Principalmente, convidar e testar com as pessoas e verificar sua satisfação com o produto. Nada melhor do que o feedback deles próprios para direcionar o trabalho.
  • Não ser chato: Um dos pontos mais importantes a meu ver foi esse, que é onde tudo começa (ou pode acabar não começando): como convencer a adoção de recursos de acessibilidade na implementação do produto? Existem formas corretas de abordar o tópico, e a melhor é sempre apresentando as vantagens com clareza e o impacto a longo-prazo dos recursos e ações a serem adotados; acima de tudo, ser republicano ao propor e conduzir o assunto.

O Usability Geek publicou um guia interessante para acessibilidade na web, contendo uma lista de 10 dicas sobre como provê-la aos usuários. A lista também enfatiza acerca da navegação reduzida e da boa estruturação dos tópicos e árvore de conteúdos; além disso, apresenta dicas de técnicas complementares para os desenvolvedores.

Recursos úteis

  • eMAG: No Brasil o Governo Federal tem atualizado periodicamente o Modelo de Acessibilidade em Governo Eletrônico (eMAG), que pode ser consultado on-line ou baixado gratuitamente em PDF. As recomendações sobre contraste, lista de cores adequadas, semântica de código, contidas deste documento se baseiam nas diretrizes de órgãos como ISO e W3C, sendo então oportunas a todo projeto web, não apenas para os sites governamentais. Uma excelente documentação disponível em português.
  • Color Contrast Spectrum Tester: Essa ferramenta é muito útil para testar as cores utilizadas na interface gráfica. Basta inserir os valores hexadecimais que será gerada uma tabela de combinações de maior contraste para o matiz, informando a taxa de luminosidade.

__
[1] International Organization for Standardization — ISO (1998). Usability: Definitions and concepts. In: ISO/DIS 9241–11(en). Recuperado de https://www.iso.org/obp/ui/#iso:std:iso:9241:-11:dis:ed-2:v1:en em 10 jan 2016.
[2] Aipoly (2015, 19 dez). Aipoly Vision App [Vídeo, 1:33min]. Recuperado de https://www.youtube.com/watch?v=XMdct-5bERQ em 10 jan 2016.
[3] UXPA São Paulo (2015, 24 jul). Projetando para a acessibilidade digital -Clécio Bachini. [Vídeo, 22min, gravado em 21 mai 2015]. Recuperado de https://www.youtube.com/watch?v=mfe5jqXkPoQ em 09 jan 2016.

--

--

André Grilo, Ph.D.
Tableless

Design, Educação e Cibercultura. Reflexões sobre Design de Produto Digital e Experiência do Usuário.