Acessibilidade Digital — por onde começar?

Shirley Santos
Pretux
Published in
7 min readApr 22, 2021
Um círculo preto sem preenchimento junto com um desenho que se assemelha a uma pessoa de braços abertos. Nas extremidades das linhas que formam os braços e as pernas há círculos azuis e uma representação da cabeça também nesse mesmo estilo.
Símbolo atual da acessibilidade

Acessibilidade não é somente com relação a pessoas com deficiência mas sobre a inexistência de barreiras no contexto social que dificulte o acesso de todos os indivíduos. É composta por 7 dimensões, segundo Romeu Sassaki, conhecido como o “pai da inclusão” no Brasil, que são elas:

Arquitetônica — ausência de barreiras físicas residenciais, urbanas, privadas ou públicas.

Atitudinal — cultura sem preconceitos, estereótipos, estigma, discriminação, capacitismo.

Instrumental — sobre instrumentos, utensílios, ferramentas, produtos.

Metodológica — métodos e técnicas no meio social (escolar, profissional, familiar).

Natural — obstáculos da natureza.

Programática — ausência de barreiras em políticas públicas, legislações, normas.

Comunicacional — dentro da comunicação, seja ela interpessoal, escrita, virtual/digital.

Principais Conceitos

Com relação ao digital, especificamente, a acessibilidade permeia todas as áreas que compõem o “guarda chuva” do UX Design e suas dimensões, devendo ser aplicada desde o início, seja no código feito pelo desenvolvedor, seja pela interface em que se apresenta ou até mesmo no conteúdo quando, por exemplo, algo é apresentado através de imagens e precisa ser lido por pessoas que utilizam leitores de tela, ou quando um vídeo não possui legenda e impede de ser usado por pessoas em lugares barulhentos, ou pessoas com deficiência auditiva, ou ainda alguém com pouco domínio do português. Como disse a Livia Gabos no #011​ TIMEBOX — Acessibilidade dentro do processo de UX:

“Acessibilidade independe do lugar que você está, do modo de acesso ao conteúdo, das condições/capacidades físicas e financeiras ou das capacidades intelectuais e educacionais. Ela inclui:

1. Preço justo pelas coisas ou de graça

2. Acesso às informações por mais de um meio

3. Não limitar as pessoas em apenas uma perspectiva

4. Não subestimar ou superestimar as capacidades das pessoas”

Descrição da imagem: Vários círculos interligados uns com os outros demonstrando que dentro do círculo maior de Design de Experiência do Usuário existe a Arquitetura, Arquitetura da Informação e Design Visual interligados à criação de conteúdo (texto, vídeo, som); Desenho industrial interligado à Fatores Humanos e Design de Som e o Design de Interação ligado à Interação Humano-Computador que está metade do lado de fora do grande círculo enquanto se conecta aos demais citados anteriormente.
Legenda: “Guarda-chuva” do UX Design — Fonte: “A Project guide to UX design”(UNGER; CHANDLER, 2009).

Vale lembrar, também, que não dá pra falar de acessibilidade sem falar sobre Design inclusivo e Design universal, pois são conceitos que se complementam mas que muitas vezes se confundem.

Design Inclusivo

“É possível conceber e produzir produtos, serviços ou ambientes adequados a esta diversidade humana, incluindo crianças, adultos mais velhos, pessoas com deficiência, pessoas doentes ou feridas ou, simplesmente, pessoas colocadas em desvantagem pelas circunstâncias. Esta abordagem é chamada “Design Inclusivo” (do livro “ Design Inclusivo: acessibilidade e asabilidade em produtos, serviços e ambientes” — Jorge Falcato Simões e Renato Bispo).

Desenho Universal

Se apresenta por meio de 7 princípios, sendo eles:

  • Uso flexível ou equitativo;
  • Uso simples e intuitivo;
  • Informação perceptível;
  • Tolerância ao erro;
  • Baixo esforço físico;
  • Tamanho e espaço para aproximação e uso.

Apesar desse conceito ser conhecido, principalmente, no design de produtos físicos e ser relacionado à arquitetura, ele pode muito bem ser adaptado ao contexto digital, como a Helena Duppre escreve no artigo Design universal aplicado no mundo digital — faz sentido?

Afinal, o que precisa para começar?

Agora que estamos na mesma página, quais referências temos hoje com relação à Acessibilidade Digital? A ideia é listar tudo que conheci até aqui com relação ao tema, para cada etapa dela. Vou citar as principais referências que aprendi durante o Bootcamp de Acessibilidade da How com o Paulo Aguilera Filho, em que a PretUX, lindamente, me concedeu bolsa; das minhas experiências anteriores na Mob Design Assistivo; no estágio no Sensibiliza UFF (Divisão de Acessibilidade e Inclusão) e do tempo no INT (Instituto Nacional de Tecnologia) na Divisão de Desenho Industrial e Tecnologia Assistiva.

Sobre Normas, Diretrizes e Guias de Acessibilidade:

W3C (World Wide Web Consortium): A mais referenciada, direcionada a padronizações mundiais para soluções Web, seus conceitos podem ser adaptados para as demais plataformas. Lá você encontrará especificações técnicas como a WAI-ARIA (Web Accessibility Initiative — Accessible Rich Internet Applications) dentre outros conteúdos importantíssimos.

WCAG(Web Content Accessibility Guidelines): Diretrizes que se baseiam nos princípios Perceptível, Operável, Compreensível e Robusto que se desdobram em critérios de 3 níveis de conformidade.

ATAG (Authoring Tool Accessibility Guidelines) : Diretrizes de Acessibilidade para projetar ferramentas de criação de conteúdo da web que são mais acessíveis para autores com deficiência.

UAAG (User Agent Accessibility Guidelines) : Diretrizes de Acessibilidade para Agentes do Usuário — explicam como tornar, para pessoas com deficiências, navegadores, extensões de navegador, reprodutores de mídia, leitores e outros aplicativos que processam conteúdo da web.

ISO 9241–171:2008: Orientação sobre acessibilidade para softwares.

eMAG: Modelo de Acessibilidade para sites do Governo Federal.

Acessibilidade Toolkit: Kit de ferramentas desenvolvido para facilitar e simplificar o entendimento das diretrizes de acessibilidade WCAG.

Manual para uso não sexista da linguagem: Como o nome já diz, trata-se de um guia para uma linguagem equitativa e inclusiva.

Sobre pessoas com ou sem deficiências

LBI (Lei Brasileira de Inclusão): assegura meios de garantir direitos para promoção da equidade à pessoas com deficiência.

Cartilha do Censo 2010: Onde é possível entender melhor o panorama brasileiro com relação à deficiências e talvez utilizar como critério de priorização de funcionalidades ou projetos.

Triângulo verde sobre fundo bege com tópicos escritos lateralmente organizados em retângulos na ordem em que serão descritos a seguir, de cima para baixo: 45.606.048 de brasileiros, 23,9% da população total, tem algum tipo de deficiência — visual, auditiva, motora e mental ou intelectual. Segundo: 25.800.681 (26,5%) são mulheres e 19.805.367 (21,2%) são homens. Terceiro: 38.473.702 pessoas vivem em áreas urbanas e 7.132.347 em áreas rurais.
“Características Gerais da População, Religião e Pessoas com Deficiência”, do Instituto Brasileiro de Geografia e Estatística — IBGE.

Inclusive Toolkit/Kat Holmes: Apesar de estar em inglês, evidencia de maneira bem visual as pesquisas. Vale a pena jogar no Google tradutor, se for o caso.

Bonecos dispostos em forma de tabela. A primeira linha tem a representação de alguém com apenas um braço, seguido de braço quebrado, e de alguém segurando um bebê; na segunda linha: pessoa cega, outra com catarata, e um motorista distraído. na terceira linha, alguém surda, seguida de uma com infecção de ouvido e depois um bartender num ambiente barulhento. e na quarta linha uma pessoa que se comunica de maneira não verbal, outra com laringite e a última com sotaque acentuado.
Fonte: Inclusive Microsoft Design — Toolkit Kat Holmes

Ferramentas

Plugin Colorblinding — Plugin para Chrome que simula o daltonismo.

Accessibility Scanner (Android) — ferramenta que sugere melhorias de acessibilidade a aplicativos sem exigir conhecimento técnico.

Stark — Plugin para análise de contraste para Figma, Adobe XD e Sketch.

PageSpeed Insights(PSI): Ferramenta que produz relatórios de performance de uma página tanto em dispositivos móveis quanto no desktop, com sugestões do que pode ser melhorado.

Funkify — Plugin de experimentação web que simula usuários extremos com diferentes habilidades e deficiências como dislexia e deficiência cognitiva, motora e visual.

Validador de marcação da W3C — serve para HTML, XHTML, SMIL, MathML, etc.

Obs.: Conforme for testando outros, incluo aqui na lista.

Acessibilidade em conteúdos

Nesse tópico, tenho como referência a Redesign for All e recomendo fortemente pesquisar sobre:

  • Descrição da imagem/Texto alternativo
  • Audiodescrição
  • Legendas
  • Disponibilização em diferentes línguas, como LIBRAS(Língua Brasileira de Sinais).

Complementos:

Vieses inconscientes , equidade de gênero e o mundo corporativo — sobre falta de acessibilidade feminina no cenário trabalhista, produzido pela ONU Mulheres

Como fazer descrição de imagens (Movimento web para Todos)

Dicas/exemplos práticos para UX Designers:

Depois de ler até aqui, você deve estar pensando que é impossível colocar tudo isso em prática. Quero ressaltar que não compactuo com a ideia do “melhor isso do que nada” pois tratando-se de acessibilidade não podemos nos contentar com uma entrega pela metade, até porque ela não é uma parte e sim intrínseca a todo processo . Mas entendo que — me incluo nessa — essa visão de tornar acessível não se constrói de uma hora pra outra. Sendo assim, a seguir algumas ações práticas que podem contribuir:

1º Una-se a pessoas com a mesma visão que você e fracione a acessibilidade em pequenas entregas ao invés de tentar entregar um grande projeto:

Exemplos: Antes de querer que a empresa toda que você trabalha tenha práticas acessíveis, comece pelo seu time, depois pelos que interagem com ele, e assim por diante. O conteúdo a ser subido no site que você fez ainda está em produção? Que tal checar com o marketing se as legendas e transcrições já foram feitas?

2º Formulários e entrevista quanti/quali: perguntar se a pessoa tem alguma deficiência ou necessidade específica e quais recursos são necessários para que ela tenha acesso ao serviço/solução que você pretende oferecer pode ser uma alternativa para entender quem e fato usa.

Entenda o Público-alvo ao qual se destina: há diversos estudos prontos de institutos de pesquisa ou pesquisadores disponibilizados na internet. Utilizá-los como parâmetro e validar com testes de usabilidade economiza o tempo gasto com entrevistas para entender as especificidades (não estou sugerindo que deixe de fazer, hein?!) e gerar soluções que atendam o maior número de pessoas dentro do seu público alvo.

Exemplo: se está criando uma solução em que é comum ao público 60+(com mais de 60 anos), é essencial que exista ajuste do tamanho da tipografia, dicas de preenchimento, tolerância ao erro.

4º Durante a construção da interface: demarcou a área de clique dos botões? É clicável por vários tipos de dispositivos de entrada? Existe bom contraste? O status/andamento é perceptível? A tipografia está legível?

5º Faça um checklist para suas entregas baseado nos critérios nível A de acessibilidade, quando se tornar um hábito, se desafie a mudar o nível (isso não exclui testes de usabilidade com diferentes personas).

Ex: Dimensão Perceptível nível A(com base nos critérios da WCAG):

a. Tem alguma imagem, captcha ícone relevante para a compreensão da informação que esteja sem texto alternativo?

b. Os conteúdos de áudio e vídeo estão descritos e legendados?

c. A arquitetura permite um entendimento equivalente para quem ouve e pra quem vê o conteúdo?

Este é um artigo em constante construção. Alguma sugestão de referência? Manda aqui no comentário ou para o e-mail shirleysantosps@gmail.com.

Obrigada pelo tempo de leitura! 😉(emoji piscando)

--

--

Shirley Santos
Pretux
Writer for

Researcher Ops — Entusiasta de assuntos relacionados à acessibilidade, LGPD e Diversidade e Inclusão | linkedin.com/in/shirleysantosps/