Acessibilidade: um caminho possível
A Organização Mundial de Saúde estima que, globalmente, mais de 1,3 bilhão de pessoas vivem com algum tipo de deficiência, o que representa 17% da população global. No Brasil, existem aproximadamente 45 milhões de Pessoas com Deficiência (PCDs), e o número aumenta, e muito, se considerarmos que todas as pessoas podem apresentar questōes de acessibilidade ao logo da vida; Isto porque as deficiências podem ser permanentes, temporárias e situacionais. As deficiências permanentes são aquelas que vêm de nascimento ou são adquiridas ao longo da vida, e que são irreversíveis. Já as temporárias, como o nome sugere, estão presentes por um período de tempo, como quebrar o braço e ficar com o gesso por um a dois meses. E as situacionais estão relacionadas ao contexto, como precisar pedir um uber após realizar um exame de dilatação de pupila (minha mãe precisou, e não conseguiu), devido à sensibilidade à luz que se encontrava naquela situação específica. Esses detalhes, embora pouco pensados no processo de desenvolvimento de um serviço digital, estão muito presentes no cotidiano das pessoas usuárias. Por exemplo: ninguém imagina como é pedir um uber, ligar para outra pessoa ou mexer no celular, segurando sacolas de feira ou uma criança nos braços. Ou sobre mexer no celular na rua, debaixo do sol.
Conceito
Acessibilidade é essencial para o bom desempenho de qualquer serviço digital, e para isso toda equipe envolvida no processo de desenvolvimento precisa se ater ao valor inegociável que a acessibilidade traz e não encará-la somente como uma feature no final de todo processo. Acessibilidade significa: Possibilidade de alcance, uso, acesso e autonomia de bens e serviços para pessoas com deficiência e para todas as pessoas. Acessi = dar acesso à informação + bilidade = habilidade de acessar a informação. É sobre acesso universal, não é altruísmo.
Até os anos 60, a causa da desigualdade é ocasionada pela lesão, doença ou limitação física. Foca em deficiência permanente (modelo médico). Entre as décadas de 60 a 80 o conceito foi se modificando e a limitação existe devido a sociedade ser incapaz de se ajustar à diversidade e preparar ambientes que se adaptam a todas as pessoas e pensam em todas as situaçōes, sejam permanentes ou não (modelo social).
Modelo Médico de acessibilidade: A deficiência é lida como um problema, e se a pessoa têm dificuldades é porque ela tem problemas e não porque a sociedade oferece inúmeras barreiras
Modelo Social de acessibilidade: Os problemas enfrentados não são pela deficiência, mas pelas barreiras que a sociedade impōe e a visão capacitista dificultando o acesso.
Uma sociedade capacitista é aquela que não enxerga uma pessoa com deficiência como um ser humano “normal”. Nela, esses indivíduos são vistos como seres inferiores, de menor valor. Leia mais a respeito de capacitismo neste link, abrirá em outra aba
Dificuldade na implementação
Mas como desde os anos 60 se pensou no modelo social e temos tanta dificuldade em implementar acessibilidade em nossos processos? Por causa da legislaçāo. A LBI (Lei Brasileira de Inclusão) foi publicada no diário oficial em 2015 e passou a valer de verdade em fevereiro de 2016. No Art. 63 trata as formas de comunicação, o que inclui a internet, na qual ela diz: “Seguir as boas práticas internacionais”. Idealmente uma empresa precisa seguir os critérios A e AA (duplo A) da WCAG para ser acessível de forma eficaz. Mas, legalmente ela pode atender alguns critérios do A e estar acobertada. Outra coisa que impacta na questão de implementação são as pessoas envolvidas no processo e os frameworks empregados. Segundo um levantamento do Panorama UX 2020 a maioria das pessoas que trabalham com UX são brancos (73%), homens (54%) e heterossexuais (75%). Apenas 6% se identifica como pessoa com deficiência, frente aos 24% de PCDs na população. Isso mostra um gap sócio-cultural entre quem projeta e quem consome. No artigo ”Why I Don’t Believe in Empathic Design” de Donald Norman, ele diz que “Há uma lacuna cultural entre os designers e as pessoas nas ruas para as quais eles estão tentando criar”, e isso exemplifica bem como precisamos desenvolver uma cultura de acessibilidade forte, ante os vieses e bolhas às quais somos integrados ao longo da vida. No contexto do Framework, é preciso se ter atenção e o enfoque necessário para trabalhar a acessibilidade. Numa pesquisa do The value of design, New Zeland 2017, é trazido que no processo de Design Thinking, as etapas de Discovery (descoberta) e Define (definição) representam apenas 5% do processo, sendo 2% para o Discovery e 3% para o Define. Idealmente, são nessas etapas que se aprofundam os entregáveis de persona, conhecer o público, mapa de empatia e desenhar as dores e necessidades. Em contrapartida, a etapa de Make (prototipação) representa 66% do processo e o deploy (entrega) representa 28%. Isso explica em partes, o motivo pelo qual produtos e serviços costumam ter problemas de usabilidade e também acessibilidade
Tudo isso impacta de forma estrondosa na experiência de pessoas usuárias que teriam uma melhor experiência com recursos de acessibilidade. O Movimento Web para Todos e a plataforma de dados BigDataCorp divulgaram na quarta-feira, 20 de maio de 2020, os resultados da segunda pesquisa sobre acessibilidade de sites brasileiros. Cerca de 14,65 milhões de endereços ativos foram avaliados no mês de abril, correspondendo a 68% dos sites do país. Os resultados da pesquisa deixam claro que a maior parte da web brasileira é inacessível aos 45 milhões de cidadãos que possuem alguma deficiência.
Motivação e Punição
O que leva as pessoas a pensarem ou falarem sobre acessibilidade? Segundo o Jared Smith, diretor da WebAim, dentro da pirâmide sugerida por ele, que vai de culpa à inspiração, estamos no nível de punição e exigência. Punição porque existem leis que punem e dão multas às empresas, e exigência para responder ao nível de complice, para que as empresas não sejam multadas. Ainda não foi possível entender o valor de negócio que a acessibilidade representa.
E podemos exemplificar isso com o número de processos que existem. Somente nos EUA, segundo o Relatório Digital Acessibility Trends estima que em 2020 teve 17.020 processos. (17 mil e 20 processos = 1 processo a cada 30min nos EUA), isso representa uma perda em dinheiro para o negócio somente por não colocar no escopo do projeto a acessibilidade. Veja alguns casos:
Domino’s Pizza processada em setembro de 2016 por Guilhermo Robles (Deficiente visual) alegando as Leis de acessibilidade digital dos EUA (ADA), por ter tentado pedir uma pizza no app e não ter conseguido
Apple foi multada em Agosto de 2018 por Himelda Mendez + Coletivo de deficientes visuais, alegando imagens inacessíveis, textos sem redimensionamento, formulários sem labels, captchas inacessíveis, PDF’s inacessíveis, busca não funcionava, contexto alterado a partir do foco
Site da Beyoncé foi processado em 2019 por Mary Conner (deficiente visual) alegando menus inacessíveis, linhas inacessíveis, videos inacessíveis, imagens sem descrição, ausência de navegação por teclado
Como começar?
Ao projetar se lembre que cada deficiência é um espectro. Como bem disse a Janaina Moreira:
As deficiências visuais variam de baixa visão a cegueira completa e incluem situações como daltonismo, visão embaçada, sensibilidade à luz e perda de visão periférica. Todos podem ter deficiências. Além das deficiências que a maioria das pessoas experimenta à medida que envelhecem, existem deficiências temporárias (como perda auditiva de curto prazo devido a uma infecção) e deficiências situacionais (como estar segurando uma criança e não poder pegar algo).
Faça um checklist que norteie seu processo de Design e desenvolvimento, responda:
- Definir os critérios mais urgentes: o que queremos e onde pretendemos chegar
- Quais usuários estão reclamando de acessibilidade? Um perfil específico? saber qual nível de autismo, por exemplo, e aqui podemos ter o auxílio de uma pessoa médica e/ou psicóloga que pode acompanhar e dar um parecer acerca do espectro. Saber se as pessoas surdas mapeadas no escopo são alfabetizadas na língua portuguesa, para saber se uma abordagem com transcrição de texto é melhor que um intérprete de libras digital (…)
- Quais pontos de Acessibilidade eu posso implementar com mais facilidade? Conhecendo o perfil, ou perfis, quais pontos conforme eu for olhar no WCAG eu consigo aplicar de forma mais fácil? Tirar os jargōes? Então já pode documentar isso e escrever os critérios que pretende atender no primeiro momento
- Quais características os usuários têm mais presentes? saber as características recorrentes, por exemplo: preferem dispositivos de toque, então seria melhor implementar um app ao invés de um site.
- Precisamos conhecer as pessoas: E isso vale para toda a equipe, não somente para a pessoa que ocupa a tarefa de pesquisa, descoberta e imersão. Os designers, P.O, Scrum, Dev, Q.A e todas as pessoas profissionais, podem ter algum nível de contato para melhorar a percepção do porquê estão projetando e para quem
- Quais barreiras elas enfrentam no dia a dia e saber o que provoca. O que é cômodo ou incômodo do ponto de vista da pessoa usuária: saber se sentem mais dificuldade com as cores, ou o texto e a legibilidade. Se a maior dificuldade são os termos, ou a área de toque muito precisa. Se preferem ouvir uma informação no lugar de ler… É como fazer “Um dia na vida”, na qual acompanhamos a pessoa em seu contexto real e observamos o que ela faz.
- Processo de Aprofundamento: o processo de aprofundamento contempla o que eu disse ali em cima, na qual toda a equipe precisa se aprofundar sobre as pessoas usuárias. É importante que a equipe leia, se preferir pode ouvir uma pessoa “especialista” ou que estuda a área de uma deficiência específica ou afins, mas a pessoa usuária é o caminho para dizer o que enfrenta.
Entenda a WCAG, e isso não significa decorá-la. A WCAG é um guideline, possui mais de 70 recomendaçōes e você sempre poderá acessá-la quando precisar conferir algum critério específico. O que se precisa fazer, neste momento, é ler… Ter conhecimento de causa, lembrar de recorrer a ela.
A WCAG tem 4 princípios base, são eles:
PERCEPTÍVEL: A informação e os componentes da interface devem ser apresentados as pessoas usuárias de forma que elas possam percebê-las
(Por exemplo, pessoas usuárias de leitores de tela fazem navegação por teclado, e a ordem de foco dos elementos é essencial. A Tecla tab, por exemplo, seguirá a lógica da página para “pular” de elemento em elemento e fazer a leitura. Imagina se começasse a ler o inicio da informação e pulasse para o final da página, como a pessoa entenderia o conteúdo? Isso se chama semântica do código, que precisa estar presente desde o processo de pensar o conteúdo do site (content first), à execução em código).
OPERÁVEL: Os componentes da interface e a navegação devem permitir que seus usuários as operem
(Existem diversas formas de acessar um conteúdo, principalmente hoje. Tablet, celular, relógio, TV, computador… E o conteúdo precisa se adaptar a esta realidade, flexível e diversa em formas de acesso. Os componentes precisam se manter compreensíveis quando viramos a orientação do celular, por exemplo, para ver um filme).
COMPREENSÍVEL: A informação e a interface devem ser compreendidas pelos usuários
(É preciso usar uma linguagem textual, visual, iconográfica de forma que contemple todas as pessoas. Isso significa dizer, por exemplo, pessoas que tem como primeira língua a Libras, pessoas que são neurodiversas e até mesmo a questão da linguagem neutra. Para pessoas autistas, por exemplo, recomenda-se o não uso de linguagens figuradas. E é bom que todas as pessoas usuárias consigam entender o que aquela informação/imagem/ícone quer dizer)
ROBUSTO: O conteúdo precisa ser robusto o suficiente para ser interpretado de maneira concisa por diversos agentes do usuário, incluindo tecnologias assistivas
(Pessoas acessam a informação por diversos meios e de diferentes formas. Isso significa dizer que há quem use Leitor de Tela, teclado braille, aplicativos de zoom de tela, tecnologias assistivas e por ai vai. O conteúdo precisa ser flexível a todas as formas).
Entendendo isso e as nuances que envolvem os princípios, ao se deparar com situaçōes projetuais, conseguimos correlacionar. Por exemplo: “Como a pessoa vai conseguir pedir um carro no meio da rua, sem acesso à internet ou com um sol escaldante? O que a WCAG pode ser útil nisso?”, e então acessa o site do Guia WCAG e procura “contraste”. Dessa forma é possível ir consumindo as guidelines e aprendendo conforme o processo de desenvolvimento.
Quando projetando, você pode montar um board e ir printando os cards que fizerem sentido de ir implementando primeiro, analisando o escopo do projeto e a viabilidade. Comece filtrando pela criticidade “A”, que são as recomendaçōes básicas. Depois, conforme evolução, pode conversar com a equipe e visualizar outros critérios a serem implementados. Lembrando que este é um processo inicial, e não final. Fale com toda equipe, converse com o Líder Ux, pergunte ao P.O (Product Owner), quais recomendaçōes de acessibilidade podem seguir. Feito isso, podemos conhecer as Heurísticas de Acessibilidade.
Adaptada por Denis Boudreau e Caitlin Geier em 2019, a partir das heurísticas de Nielsen; segue o mesmo formato do modelo original, porém com foco especifico em acessibilidade (baseada na WCAG); Originalmente criada para identificar possíveis problemas de acessibilidade ainda na fase de planejamento do produto ou serviço; Deve ser aplicada especialmente por designers de preferência por aqueles que já conhecem bem a WCAG.
01 MÉTODO DE INTERAÇÃO: É possivel interagir facilmente com o sistema usando o método de entrada que o usuário quiser (mouse, teclado, toque ou voz)
02 VÁRIAS FORMAS DE NAVEGAÇÃO: Os usuários podem navegar facilmente e encontrar o conteúdo que quiser, além de saber onde estão o tempo todo no sistema
03 ESTRUTURA SEMÂNTICA: Os usuários podem entender facilmente a organização dos elementos em tela
04 PREVENÇÃO DE ERROS: As interaçōes no sistema possuem instruçōes claras e significativas que ajudam a prevenir erros e fornecem aos usuários feedbacks claros que orientam suas açōes e como corrigir os problemas sempre que são exibidos
05 CONTRASTE E LEGIBILIDADE: Textos e elementos significativos em tela podem ser facilmente distinguidos e lidos pelos usuários
06 IDIOMA E COMPREENSÃO: O conteúdo apresentado em tela pode ser facilmente lido e compreendido pelos usuários
07 PREVISIBILIDADE E CLAREZA: A função de cada elemento em tela é previsível. A forma como cada elemento se relaciona com o sistema é clara e direta, evitando ambiguidades
08 TEMPO SUFICIENTE: Os usuários possuem tempo suficiente para concluir suas tarefas e não perdem informaçōes caso o tempo chegue ao fim
09 MOVIMENTOS: Qualquer elemento que se mova, seja animado ou pisque na tela, pode ser desativado de alguma forma para que não ocorram distrações e prejudique alguns usuários
10 ALTERNATIVAS VISUAIS E AUDITIVAS : Todo conteúdo significativo e puramente visual ou auditivo possui algum método alternativo baseado em texto para usuários que não podem ver ou ouvir
Mais uma vez, é preciso entender as heurísticas como recomendaçōes que serão aprendidas conforme utilização. Não tenha pressa em decorar, leia, procure exemplos e tente identificar os elementos nas páginas que visita.
Equipe
E para não esquecer: Falar e desenvolver a cultura de acessibilidade é uma tarefa conjunta, todas as pessoas são responsáveis. E para isso, vou exemplificar algumas atribuiçōes:
Pesquisa/ Research
Acessibilidade em toda parte: incluindo acessibilidade em seu planejamento de pesquisa, telas de recrutamento, sessōes de pesquisa e discussōes com sua equipe
Experiência individual: Cada pessoa terá experiências de vida diferentes. Concentre-se em aprender sobre elas como pessoas, não apenas usando-as como estatística
Mantenha-se Atualizada: Leia regularmente sobre as práticas recomendadas de acessibilidade, pesquisa e linguagem, deficiências, e avanços tecnológicos
Gama de Necessidade: Faça pesquisas com pessoas que se identificam como tendo deficiência (físico, intelectual, sensorial e /ou neurológicas)
Permanente | Temporário | Situacional: As necessidades de acessibilidade podem ser permanentes, temporárias e /ou situacionais; e fazendo pesquisas para um não significa que você entende outro
É só perguntar: Cada pessoa é especialista em suas necessidades. Se vocês sentem insegurança sobre as necessidades específicas de alguém, apenas peça para explicá-las a você
Consentimento informado: Para garantir o consentimento informado, tenha todas as informações disponíveis em diferentes formatos: falado, escrito, desenhado, traduzido, etc.
Procurar conselho: Obtenha conselhos de especialistas, incluindo cuidadores e organizações que trabalham e apoiam as pessoas com necessidades de acessibilidade
Seja flexível: Tenha preparo para ajustar sua linguagem de pesquisa, perguntas, atividades, horários, tecnologia e configurar o espaço de pesquisa para a pessoa participante
Dispositivos Próprios: Não teste a pessoa usuária. Sempre que possível, as incentive a usarem seus próprios dispositivos e configurações
Product Owners
Habilidades diversas: Pessoas com habilidades diferentes estão representadas em seu planejamento?
Necessidades negociadas: Você consultou e concordou com a acessibilidade, requisitos e marcos?
Habilidades adequadas: Você escolheu pessoas funcionárias e fornecedoras qualificadas para entregar resultados acessíveis?
Planejamento de Sprint: O teste de acessibilidade faz parte da definição de “concluído”
Alternativas de texto: Você já procurou alternativas de texto para imagens e mídia?
Ferramentas de terceiros: Você considerou a acessibilidade de recursos terceirizados?
Feedback inicial: Considerou necessidades de acessibilidade com antecedência em seu processo de design?
Pesquisa de usuário: Você já buscou feedback de pessoas com deficiência em sua pesquisa?
Rastreador de problemas: As partes interessadas podem facilmente evitar e consertar preocupações de acessibilidade?
Distribuir listas de verificação: Você compartilhou essas listas de verificação com sua equipe?
Content Maker
Os títulos separam o conteúdo: Todo o conteúdo é separado por títulos informativos?
Evite jargōes: Escreva para ser compreendido pelo seu público
Organize o conteúdo: Todos são elementos estruturais, como títulos, listas e extrair cotações escolhidas nas opções de CMS
As imagens têm texto alternativo: As imagens informativas têm uma alternativa equivalente em texto?
Evite texto em imagens: Todo o texto é dimensionado sem ficar borrado ou pixelizado?
Imagens complexas explicadas: Os mapas, gráficos, imagens e outras mídias complexas são descritas em texto ou tabelas?
Texto do link descritivo: O texto do link descreve sucintamente a finalidade do link e você evitou o texto do link genérico como “clique aqui” e “assista ao vídeo”
O vídeo contém legendas: Você forneceu legendas de vídeo? que identificam caixas de som, com todos diálogos e sons importantes?
A mídia tem transcrição de texto?: Você adicionou uma transcrição de texto para mídia que inclui todos os diálogos e identifica os palestrantes, sons importantes e recursos visuais importantes (como o texto da tela)?
Forte contraste de cor: Você escolheu cores que contrastam bem entre si?
Designers
Texto Legível: A tipografia é clara e legível?
ícones óbvios: O significado do seu ícone está claro? Ele precisa de um rótulo de texto? Você usou texto alternativo consistente?
Interaçōes rotuladas: Os campos de formulários, botões, links e outros interações são descritas de forma clara e inequívoca?
Alternativas de mídia: Os vídeos têm legendas legíveis e não competitivas? Uma transcrição de texto é colocada perto do reprodutor de mídia?
Considerações Downstream (handoff): Você transmitiu a estrutura do conteúdo, sequência e estados para os desenvolvedores?
Funcionalidade clara: O uso é óbvio ou são fornecidas mensagens de instruções úteis?
Mudanças explícitas de estado: O estado das interações dinâmicas é óbvio?
Cor considerada: Você forneceu alternativas para cores? Usou forte contraste de cor?
Apresentação flexível: O tamanho e a orientação do conteúdo são flexíveis?
Foco no feedback e ordem: O foco do mouse e do teclado é fácil de ver? Você delineou a ordem lógica do foco para usuários de teclado e leitor de tela?
Pontos de toque generosos: As interações são suficientemente dimensionadas e espaçadas?
Developers
Composição estrutural: Os elementos estruturais, como títulos, listas e tabelas são marcadas corretamente <h1> <h2> <h3> <ul> etc?
Ordem lógica do TAB: Todas as interações são acessíveis no TAB seguindo uma sequência lógica usando um teclado?
Imagem ‘alt’: Os elementos da imagem têm um ‘alt’? Atributo? Isso substitui a imagem quando não pode ser vista?
Esconder imagens decorativas: imagens decorativas estão escondidas de usuários de leitores de tela?
Identifique os elementos: O nome, função e estado de todos os elementos são corretamente e claramente definido?
Interação Intuitiva: O uso da interação é óbvio ou claramente explicado?
Correção de entrada: Erros de entrada são fáceis de encontrar e consertar?
Prefira HTML: Use HTML nativo sempre que possível. Moderadamente suplemente com ARIA que reflete Práticas de Autoria W3C ARIA
Acessível por teclado: São todas as interações, e apenas as interações, visíveis e previsivelmente utilizáveis?
Validação: A página passa nas verificações automatizadas de acessibilidade?
Quality Assurance
Validação: A página da web é validada e passa nas verificações automatizadas de acessibilidade
Alternativas não textuais: Forneça conteúdo não textual, como imagens e mídia de forma equivalente
Feedback de foco: Você pode ver facilmente o foco do teclado para todos elementos interativos?
Acessível por teclado: Você pode alcançar todas as interações sem um mouse, e em sequência lógica?
Estados visíveis: O estado de todos os elementos é dinâmicos e óbvio?
Apresentação flexível: O tamanho e a orientação do conteúdo são flexíveis?
Estruturalmente navegável: Você pode encontrar, usar e navegar por conteúdos com um leitor de tela?
Explicar interações: As interações e o uso são óbvios para usuários de leitores de tela
Teclado acionável: Você pode acionar todas as interações do teclado?
Explicar mudanças: As pessoas usuárias de leitores de tela são atualizadas se o conteúdo muda de forma dinâmica ou imprevisível?
Bibliografia
Accessibility Statement: https://about.abc.net.au/accessibility-statement/
Conheça o Brasil, Pessoas com Deficiência: https://educa.ibge.gov.br/jovens/conheca-o-brasil/populacao/20551-pessoas-com-deficiencia.html
Curso de Acessibilidade Digital do Marcelo Salles pela Mergo
Guia WCAG: https://guia-wcag.com/
GAIA — https://gaia.wiki.br/
Relatório Mundial sobre a Deficiência: http://apps.who.int/iris/bitstream/handle/10665/70670/WHO_NMH_VIP_11.01_por.pdf;jsessionid=502462B41D3F5C792DB74ECCDE0B915A?sequence=9
UX, deficiência e um mercado emergente: https://brasil.uxdesign.cc/ux-defici%C3%AAncia-e-um-mercado-emergente-7f4bbcd42795
WebAim: https://webaim.org/
