Zoey loves browsing the Internet. Eles gostam de se perder na web interligada cheia de informações, desvendando pedaços de conhecimento que são dignos de serem favoritos. Mas eles não gostam de folhear grandes corpos de texto. Eles preferem imagens. Muitas delas. Eles passam as fotos da sua paixoneta no Facebook antes mesmo de considerarem a leitura da sua biografia. Seu anseio por memes e visualizações é inigualável para qualquer um neste planeta e suas histórias Instagram refletem isso. Elas estão apenas, você sabe, fortemente ligadas à sua natureza visual-learner. E não há nada de errado nisso.
Mas o mundo não tem apenas a Zoey dentro dele. Há o Trung-Anh, há o Sewon, há o Nayon, há o Venkatesh, há o Zeqiu, há o Dinko, há o Sade, há o Ivan, e há o Mohammed. Segundo a OMS, pelo menos cerca de 29% (2,2 bilhões) da população mundial (7,7 bilhões) tem alguma forma de deficiência visual, que é de pelo menos 3 pessoas na lista acima mencionada. Hmm, então, umm … agora que sabemos que 29% da população pode não ser capaz de ver o conteúdo visual, o que fazemos? Ainda mantemos a interpretação literal da citação de Fred Barnard “Uma imagem vale mais que mil palavras”? Eu ouso dizer que não. Nem sempre.
Uma pergunta frequentemente curiosa a fazer é – como é que as pessoas com deficiência visual utilizam um computador? Primeiro, penso que é importante compreender que ter uma deficiência visual não é sinónimo de ser cego. Portanto, se vir alguém a usar uma bengala branca, seria errado assumir que é completamente cego. Quando se trata de usar um computador, dependendo do seu nível de visão, eles podem usar leitores de tela para ler o conteúdo em sua tela. Alguns leitores de ecrã populares incluem JAWS, NVDA (gratuito e de código aberto) e VoiceOver (incorporado nos dispositivos Apple).
O Estado do Mundo
Great! Assim, temos uma forma dos utilizadores de leitores de ecrã interagirem com os seus computadores ou dispositivos móveis. Mas como é que um leitor de ecrã pode ler as fotografias da sua paixoneta? Ou memes? Ou gráficos/visualizações? Uma resposta possível aqui é que devemos fazer avanços médicos para curar sua visão ou qualquer coisa do tipo de ter um assistente de cuidados pessoais/amigo/família que possa explicar a eles o que está na tela. Outra possível resposta envolve a construção de um mundo onde seja possível que eles próprios o façam. Se a sua resposta foi mais próxima da primeira, então você claramente precisa se educar e se familiarizar com os conceitos do modelo social da deficiência.
Images
Vamos focar nas imagens. Para que o leitor de tela seja capaz de ler uma imagem, ele precisa saber do que se trata a imagem e depois apresentá-la ao usuário de uma maneira significativa. Por exemplo, vamos considerar uma imagem de uma família brincando com seus Huskies gêmeos (Go Huskies!). Como um usuário não leitor de tela, é fácil descobrir o que está acontecendo na imagem – não apenas o que está acontecendo em primeiro plano, mas também o fundo. Por exemplo, Jialin, um dos membros da família está usando uma camiseta que diz “100% humano”. O leitor de tela pode extrair totalmente a cena? Para fazer isso, os leitores de tela dependem dos desenvolvedores ou autores do conteúdo para fornecer um texto alternativo para as imagens usando o atributo “alt”, que foi introduzido ao público em 1995 como parte do HTML 2.0 (se você não estiver familiarizado com o que é um atributo alt ou que significado ele tem, este artigo fornece uma grande visão geral do atributo alt). O elemento HTML img então parece:
<img src="image1.jpg" alt="This is an image of two Huskies" />Hence, o leitor de ecrã irá agora ler “Image, This is an image of two Huskies”.
Leaving the alt attribute empty or providing meaningless text such as “Image 1”, as you can imagine, is not very helpful. Mesmo com o texto alternativo de “Esta é uma imagem de dois Huskies”, a informação que está sendo transmitida não está nem perto do que alguém que não usa um leitor de tela seria capaz de extrair, como o texto na camiseta de Jialin. Além disso, o leitor de tela já anuncia o conteúdo como uma “imagem” ou “gráfico”, o que torna redundante o texto “Esta é uma imagem”. Tudo isto com o pressuposto de que a imagem é colocada por um utilizador que tem acesso ao código para introduzir o texto alternativo.
Mas e em locais como plataformas de social media onde as imagens são carregadas por utilizadores que não têm acesso ao código. O Facebook, em 2016, mais de uma década após o seu lançamento, começou a empregar inteligência artificial para adicionar texto alternativo gerado automaticamente às imagens, e permitiu aos usuários editar esse texto, se necessário. A Instagram acompanhou e implementou este recurso no ano passado, 8 anos após o seu lançamento. As questões, entretanto, permanecem as mesmas – Quanta informação um texto alternativo deve fornecer? Uma descrição básica, de nível superior, é suficiente? Ao decidir o que apresentar aos usuários do leitor de tela, estamos assumindo e generalizando o que os usuários do leitor de tela estão procurando na imagem? Se uma imagem vale mais que mil palavras, então, metaforicamente, um texto alternativo não deveria ser mil palavras?
GIFs e Imagens Animadas
Leo tem um jogo de meme forte e é um especialista em encontrar um GIF gato para qualquer ocasião. Dado que um GIF é criado combinando várias imagens diferentes de uma forma que o resultado final dá uma impressão de um vídeo muito curto, será que enfrentamos os mesmos problemas que enfrentamos com as imagens? Pior. Como desenvolvedor, você certamente pode (e deve) adicionar um texto alternativo semelhante ao que fazemos para as imagens (GIF é um arquivo de imagem, afinal de contas). Mas em plataformas de mídia social, dependendo de como um GIF é processado pela plataforma, ele é renderizado usando um elemento img sem um atributo alt, ou usando um elemento video. Um elemento video não suporta de todo o atributo alt.
Então, todos aqueles widgets GIF que temos utilizado para colocar memes animados no Facebook e Instagram, os que nos tornam fixes e tudo mais, são inacessíveis para os utilizadores de leitores de ecrã. Aqui o nosso objectivo não é impedir o Leo de publicar GIFs (porque, miau) mas assegurar que tal conteúdo é apreciado por todos e não apenas por um subconjunto da população.
Gráficos e Visualizações
Tudo isso e ainda nem sequer chegámos às “coisas difíceis”. Introduzindo gráficos e visualizações interativas. Yisu e Xuhai são nerds de visualizações totais e como qualquer pesquisador, acreditam que os gráficos e visualizações são extremamente valiosos; raramente há um trabalho acadêmico sem pelo menos um gráfico ou visualização. Um gráfico transmite um conhecimento altamente visual e é geralmente incorporado numa página web usando uma das três técnicas principais:
- como uma imagem para conteúdo estático.
- como um HTML
canvasgráficos de elementos ou SVG (atualização de uma imagem em vários aspectos) para conteúdo estático. - e/ou como uma visualização interativa usando bibliotecas JavaScript (que normalmente empregam HTML
canvasou SVG como mecanismo subjacente) para servir conteúdo dinâmico e permitir aos usuários interagir com o gráfico.
Quando usado como imagem, as mesmas considerações se aplicam como discutimos acima com a complexidade adicional de apresentar informação científica. O que deve dizer o texto alternativo? Deve dar uma visão geral do gráfico? Deveria incluir estatísticas como média, média, mediana, modo, etc.? E em caso afirmativo, quais? Quanta informação é muito pouca e quanto é muito? Estas são perguntas difíceis.
Um HTML’s canvas é exposto como um bitmap, e sem a implementação de um conteúdo fallback adequado coloca vários desafios de acessibilidade. No entanto, existem várias técnicas para torná-los acessíveis e estão apenas a uma pesquisa no Google. Mas é claro, os desenvolvedores são responsáveis por conhecer essas técnicas e implementá-las em seu trabalho – algo que eu vi melhorar com o tempo, mas que não me prenderia a respiração. Pelo contrário, o SVG é encorajado para gráficos acessíveis, pois, de acordo com as especificações do W3C, os elementos infantis estão disponíveis para a API de Acessibilidade. No entanto, o suporte ao navegador ainda está sendo trabalhado e um gráfico SVG totalmente acessível requer esforço e pelo menos algum conhecimento fundamental do SVG, o que, mais uma vez, é uma responsabilidade que recai sobre os ombros dos desenvolvedores.
Para resolver algumas dessas preocupações, criei o evoGraphs – um plugin jQuery para criar gráficos acessíveis, que ganhou o Prêmio do Delegado para o Desafio de Acessibilidade na Conferência W4A em 2015. É certo que ele não aborda todas as questões destacadas quanto à complexidade da apresentação de informações científicas. Assim, os gráficos acessíveis são uma área activa de exploração para mim e para outros investigadores.
Como uma visualização interactiva (como ChartJS, Google Charts e D3), a representação de informação actualizada dinamicamente é complicada. A maioria dos utilizadores de leitores de ecrã não utilizam um dispositivo apontador (como o Mouse, Trackpad, etc.) e a maioria das interacções ou são apenas limitadas ou são mais utilizáveis na prática quando se passa por cima de determinados elementos. Sem tais interações, o propósito das visualizações interativas para um usuário leitor de tela torna-se nebuloso e, sem a devida consideração, a compreensão do conteúdo pode se tornar mais perplexa.
Adicionalmente, muitas bibliotecas gráficas modernas permitem a modificação dinâmica do conteúdo. A retransmissão das informações para os leitores de tela, quando o conteúdo é modificado, pode ser tratada usando adequadamente os atributos ARIA, que se tornou uma recomendação do W3C em 2014 e é, honestamente, uma dádiva de Deus. Mas, como com os SVGs, o suporte estável do navegador para todos os recursos ARIA ainda é um trabalho em andamento, especialmente quando usado dentro de SVGs. Ainda é necessário um treinamento adequado do desenvolvedor para utilizar totalmente o que o ARIA tem a oferecer.
The Path Forward
Desde quando Tim Berners-Lee criou a World Wide Web, até hoje, a tecnologia tem aumentado drasticamente. Infelizmente, o mesmo não se pode dizer sobre a acessibilidade de tais tecnologias. Quando uma determinada tecnologia se torna acessível a pessoas com deficiência, o mundo já avançou para tecnologias mais avançadas. Portanto, o jogo de recuperação nunca acaba. E não acabará – a menos que a acessibilidade se torne a consideração fundamental no desenvolvimento de novas tecnologias.
Mas nem toda a esperança se perde. Temos e continuamos a dar grandes passos no domínio da acessibilidade web, tanto na investigação académica como nos produtos industriais. Estudantes e novos desenvolvedores estão sendo ensinados os conceitos de acessibilidade e técnicas para tornar a web mais acessível. Seguindo em frente, eu prevejo dar um passo atrás e pensar em adaptar o software por necessidades do usuário, em vez de esperar que os usuários se adaptem ao software. Por exemplo, continuamos a assumir que informação um utilizador leitor de ecrã quereria extrair de uma imagem ou construímos ferramentas que aprendem mais sobre o utilizador e apresentam informação que o utilizador prefere apreender? Para mim, o futuro afasta-nos da generalização e aproxima-nos da personalização – uma World Wide Web verdadeiramente centrada no utilizador.
- “Vision Impairment and Blindness”. Organização Mundial da Saúde, Organização Mundial da Saúde, https://www.who.int/news-room/fact-sheets/detail/blindness-and-visual-impairment. Acesso 20 Out. 2019.
- “A Picture’s Worth”: D. H. Hepting, Ph.D.” A Picture’s Worth | D. H. Hepting, Ph.D., http://www2.cs.uregina.ca/~hepting/projects/pictures-worth.
- HTML 2.0 Materiais, https://www.w3.org/MarkUp/html-spec.
- Sharif, Ather, e Babak Forouraghi. “evoGraphs-A jQuery plugin para criar gráficos acessíveis na web.” 2018 15º IEEE Annual Consumer Communications & Networking Conference (CCNC). IEEE, 2018.
- “WAI-ARIA Overview”. Iniciativa para a acessibilidade da Web (WAI), https://www.w3.org/WAI/standards-guidelines/aria.