Image

Acessibilidade nos sites: para que todos possam ler

Conheça melhor o funcionamento dos recursos de acessibilidade nos sites da network 612, inicialmente implantados aqui no blog, e nos demais sites.
, , , , , ,

Quando eu criei este blog, é claro que a primeira coisa que você pensa é “queria que todo mundo pudesse ler”. Mas tem uma coisa que eu andei pensando, que é justamente nas pessoas que possuem algum tipo de deficiência, seja ela visual, auditiva ou mesmo dificuldade para ler e entender melhor o que eu quero escrever, afinal é essencial levar mensagens positivas para todos. Foi pensando nisso que adotei recursos de acessibilidade aqui no blog – e nos demais sites da network 612.

O ambiente web é fascinante e cheio de descobertas. Mas para que todos tenham acesso a elas, é preciso se adaptar e adaptar o seu veículo, de modo a tornar iguais as oportunidades de conhecimento. O que ainda não acontece na internet brasileira em sua maioria esmagadora. E os números podem provar isso.

Apenas 0,74% dos sites brasileiros possuem algum tipo de acessibilidade mínima, de acordo com um levantamento realizado pela plataforma de dados BigDataCorp, em parceria com o Movimento Web para Todos, que pode ser melhor visto nesta matéria. Esse é um dado de abril de 2020, em agosto de 2019 foi de 0,61%, um crescimento ainda tímido, mas que mostra que ainda há um longo caminho para tornar a web realmente acessível.

Montei seis sites na internet, sendo cinco no ar e um em desenvolvimento. Todos eles passaram a contar com recursos de acessibilidade há pelo menos duas semanas. O que foi implementado nas páginas que desenvolvi é algo que já vinha planejando há um bom tempo, e que com a implantação de novos recursos, representa um salto importante e um modelo que precisa ser seguido daqui em diante.

Facilitando o acesso

Os recursos de acessibilidade na web são essenciais para dar a possibilidade as pessoas com deficiência de ter acesso ao conteúdo produzido diariamente pela network 612. Um passo bem expressivo, mas fundamental para garantir uma maior distribuição do conteúdo e para que este chegue ao maior número de pessoas sem barreiras.

Como você pode ver, o blog tem dois botõezinhos que coloquei em cada canto: no canto inferior esquerdo, temos um botão para várias capacidades de leitura, bem como uma assistente virtual que vai ler tudo isso que tá escrito aqui. Do lado direito, temos um botãozinho com outro assistente que vai interpretar os posts em Libras – Língua Brasileira de Sinais. Está disponível para todos e em qualquer tela.

Este é um esforço contínuo realizado para adaptar o blog – e todos os sites que eu desenvolvi – a todas as condições dos leitores. Foi implementado também no #site612 e em todos os sites desenvolvidos pela 612 Comunicação, estando assim em conformidade com as leis internacionais e a Lei Brasileira de Inclusão (Lei Nº 13.146/2015).

“Art. 63. É obrigatória a acessibilidade nos sítios da internet mantidos por empresas com sede ou representação comercial no País ou por órgãos de governo, para uso da pessoa com deficiência, garantindo-lhe acesso às informações disponíveis, conforme as melhores práticas e diretrizes de acessibilidade adotadas internacionalmente.”

Trecho da Lei Brasileira de Inclusão sobre sites da Internet

Deste modo, vamos apresentar os recursos de acessibilidade nos sites que foram inicialmente implementados no Blog Josivandro Avelar, posteriormente nos demais sites que eu desenvolvi, e que devem ser uma diretriz daqui em diante na 612 Comunicação.

O botão de acessibilidade

O botão de acessibilidade permite ao leitor ler esta página da maneira que melhor se adapta as suas condições, utilizando uma ou combinando mais funções. Foi desenvolvida pela UserWay e é uma ferramenta gratuita e de alto nível usada por sites de grandes empresas e também de governos.

Ao acionar o botão, o usuário vai encontrar um menu completo de funções para várias necessidades de adaptação de leitura, as quais serão melhor descritas a seguir.

Ele está aqui no canto esquerdo do site, e pode ser acionado se clicando nele, ou apenas selecionando o comando CTRL + U. Por padrão, ele está aqui no canto esquerdo, mas pode ser movido ou escondido acionando a função “Mover/Esconder”, assim permitindo que ele possa se mover para qualquer canto do blog.

Entenda a função de cada item
Teclas de navegação

Desativa o cursor do mouse e permite que o leitor navegue pela página através das teclas de navegação do computador. Ideal para aquelas pessoas que não tem um mouse, por exemplo, ou aquelas que não podem usar o recurso, sendo este um método de tecnologia assistiva.

Ler a página

Ideal para deficientes visuais ou pessoas com vista cansada, e também aquelas que tem uma certa dificuldade de ler as palavras escritas, este recurso aciona uma voz que vai ler tudo que está escrito no blog. Você vai ouvir uma voz feminina lendo o texto para você.

Você ainda pode selecionar a velocidade da voz: se ela vai falar normal, se ela vai falar mais rápido ou se mais devagar.

Desde antes da implantação da ferramenta, as imagens já de algum tempo contam com textos alternativos embutidos nas imagens, justamente para que os leitores de texto e assistentes virtuais leiam o que está descrito na imagem. Isso também funciona com a voz que implantei no blog.

Contraste

Muda as cores da página para permitir que esta se adapte a sua condição de vista, adaptando-se assim a qualquer tipo de dificuldade visual do leitor. As funções são estas:

  • Cores invertidas: voltada para os daltônicos, o que está branco fica preto e as cores de tudo – até das imagens – se inverte para permitir uma vista menos cansada para este público, bem como para outros tipos de deficiências visuais.
  • Contraste escuro: ideal para você que não quer cansar a vista nas leituras noturnas, é o modo noturno, que virou uma tendência também nos aplicativos móveis. Tal como o último, ele passa a exibir um fundo escuro, mas com as letras verdes e amarelas, mantendo a cor das imagens.
  • Contraste de luz: deixa o layout do site com as cores e linhas mais fortes do que no padrão normal do site.
  • Dessaturar: é o modo preto e branco do blog, ajudando na leitura e compreensão das imagens pelos leitores com deuteranopia, tritanopia e outras formas de daltonismo.
Links destacados

O recurso ajuda a localizar onde estão os links do blog, ou seja, onde o usuário vai clicar.

Texto maior

Este recurso vai aumentar o tamanho da fonte de todos os textos do blog, para adaptar-se a visão do leitor. Possui três níveis de tamanho, de modo que o leitor pode selecionar o que melhor se adapta a sua visão.

Espaçamento das letras

O recurso aumenta o espaçamento das letras de tudo o que está escrito no blog, também para adaptar-se a visão do leitor. É voltado para pessoas com dislexia ou outros tipos de deficiências visuais.

Tal como no recurso de texto maior, o leitor pode selecionar até três níveis de espaçamento.

Parar animações

Este recurso interrompe todas as animações que o blog possui. Algumas animações de alguns layouts de sites podem desencadear convulsões. Este site tem poucas ou quase nenhuma, mas a função está disponível em caso de haver alguma.

Fontes legíveis

Também voltada para disléxicos e outros portadores de deficiência visual, este recurso vai trocar a fonte de todo o blog – que é Montserrat – por Arial.

Cursor

Este recurso aumenta o tamanho do cursor do mouse em 400% do tamanho, permitindo assim uma melhor visão de onde você vai clicar ou selecionar.

A mesma função conta com uma barra de leitura, que faz com que o leitor se guie por onde ele está lendo o texto, de modo que não vá se perder na leitura. Esta função é voltada para a redução da fadiga ocular de usuários com deficiência visual, disléxicos, pessoas com deficiências cognitivas e usuários com presbiopia.

Barra de ferramentas

Este recurso revela em tamanho maior as barras de ferramentas das imagens, bem como o texto alternativo delas caso haja. É voltada para pessoas com baixa visão com necessidades de acessibilidade.

Estrutura da página

É um índice de onde estão os tópicos das páginas geradas pelo blog. O índice básico da página inicial do Blog Josivandro Avelar para este tema vai consistir nos 10 primeiros posts, nos widgets da barra lateral e nos widgets de rodapé.

Nas outras abas, há o índice de estrutura e de links daquela página, assim facilitando a navegabilidade da página.

Mãos que falam

Além dos recursos do botão do bonequinho, implementei também um botão no canto direito do site, de tradução para a Língua Brasileira de Sinais – Libras.

Esse botão é um assistente de código aberto chamado VLibras – resultado de uma parceria entre o Ministério da Economia (ME), por meio da Secretaria de Governo Digital (SGD) e a Universidade Federal da Paraíba (UFPB).

O widget está em vários sites públicos, como os do Governo da Paraíba e os sites do Governo Federal. E pode ser implementado em qualquer site. Permite que o deficiente auditivo selecione qualquer parágrafo do texto – ou o texto todo – que é traduzido por um assistente virtual para a Linguagem Brasileira de Sinais.

O widget permite ainda selecionar ainda a linguagem regional de cada estado para a tradução em LIBRAS, além da velocidade da mesma.

Declaração de Acessibilidade

O Blog Josivandro Avelar e os demais sites passarão a contar nos menus e nos widgets da UserWay com declarações de acessibilidade – veja aqui a do blog.

São cinco sites a mais dentro do ainda pequeno número de sites adaptados para pessoas com deficiências – e ainda vem aí um sexto site. É um exercício de inclusão e de cidadania num momento em que o consumo de Internet aumenta em momentos como esse em que estamos mais em casa, e é preciso se fazer entender para todos os públicos.

Implementar os recursos de acessibilidade nos sites não é um bicho de sete cabeças. Foi um trabalho ágil, onde em um dia testei, em um dia implantei, e a isso também se inclui o próprio layout. Atender e entender os públicos é um exercício constante de empatia, entendendo as dificuldades que as pessoas enfrentam. Afinal, é não pensar apenas em mim. É solucionar para facilitar a vida.


Sites desenvolvidos pela 612 Comunicação que receberam os recursos de acessibilidade

Em breve: Viaje Mais Online – o site está em desenvolvimento e em breve receberá os recursos, assim que finalizado.

Plugins instalados para acessibilidade nos sites

Deixo aqui os links dos plugins WordPress que utilizei para implantar os recursos de acessibilidade nos sites da network 612, assim facilitando a vida do pessoal que gostaria de implantar os recursos em seus sites, e não sabia onde encontrar.


Receba os posts do site em seu e-mail!

Toda vez que um post for publicado no site, você irá receber na hora.

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.

Antes de deixar o seu comentário, leia a Política de Comentários do site.

Luneta Sonora

Um podcast sobre tudo e o nada ao mesmo tempo.
  1. Luneta Sonora 130: Mais uma semana trazendo novidades
  2. Luneta Sonora 129: Um episódio organizado no meio da desorganização
  3. Luneta Sonora 128: Só mais um episódio com recados da semana
  4. Luneta Sonora 127: Sério que eu esqueci dos três anos do podcast?
  5. Luneta Sonora 126: Se eu esqueci de alguma coisa, eu não me lembro
  6. Luneta Sonora 125: Como eu esqueci de oito desenhos?

Assine A Luneta

Receba os posts do site em uma newsletter enviada às segundas, quartas e sextas, às 8 da manhã.