A acessibilidade tem assumido um papel central, especialmente nos últimos anos, no campo do web design. Isto não deveria ser um sinal de surpresa, uma vez que predominam cada vez mais pessoas com deficiência auditiva ou visual, entre muitas outras. Os designers desempenham justamente um papel fundamental na hora de encontrar conteúdos na web que possam ser consumidos por qualquer pessoa, independentemente de ser portadora de deficiência ou não.
Hoje queremos ajudá-lo no caminho para um web design acessível. Apresentamos diversas ferramentas para realizar auditorias ou simples testes de acessibilidade web em seus portais e conteúdos.
Conteúdo
1. Legendas ocultas do YouTube
2. Analisador de contraste de cores para esboço
3. Configuração de prova no Adobe
4. ‘Onda’
5. Sem café
6. ACHeker
7. Ferramenta de análise de epilepsia fotossensível
8. Ferramentas de desenvolvimento de acessibilidade
9. Oráculo de cores
Ferramentas para medir a acessibilidade na web:
Closed Caption do YouTube
Atualmente existem muito poucas ferramentas que permitem que designers e desenvolvedores acessem aspectos auditivos do conteúdo da web. Embora não seja uma ferramenta de avaliação, o YouTube oferece nativamente um recurso que pode ajudar a aumentar a acessibilidade dentro do conteúdo do seu vídeo. Da mesma forma, as legendas ocultas opcionais permitem que você mostre o conteúdo do seu vídeo para um público mais amplo, especificamente aqueles com deficiência auditiva ou que falam idiomas diferentes. Além disso, se você usa o YouTube para hospedar ou incorporar conteúdo de vídeo, você pode aproveitar as funcionalidades manuais de transcrição e legenda no Gerenciador de vídeos.
Analisador de contraste de cores para esboço
Isso permitirá que você teste a acessibilidade de seus designs para usuários daltônicos, enquanto trabalha diretamente no Sketch. A ferramenta oferece a capacidade de calcular a taxa de contraste de cores de duas camadas (ou uma única camada em relação à área de design) e avaliá-la em relação aos padrões WCAG. Depois de concluir o teste, o plug-in fornecerá resultados de classificação positivos ou negativos com base nos requisitos de contraste de cores WCAG AAA e AA.
Configuração de prova no Adobe
É uma ferramenta muito semelhante à anterior com a qual a Adobe tomou as medidas necessárias para incluir testes de acessibilidade para daltônicos em seu software Illustrator ou Photoshop. Seus filtros permitem ver como será o design para usuários com diferentes daltonismo, protanopia e, principalmente, deuteranopia. Caso queira simular daltonismo, no desenho, acesse o menu, pressione “Visualizar > Configurações de prova > Daltonismo” e selecione protanopia ou deuteranopia. Mais uma vez, outra ótima solução para avaliar a acessibilidade do seu design enquanto você trabalha.
‘Onda’
Outra ferramenta gratuita projetada para facilitar a revisão da acessibilidade na web, fornecendo aos desenvolvedores uma representação visual dos problemas diretamente em suas páginas. Em relação aos testes abrangentes, eles avaliam vários problemas de acessibilidade, incluindo contraste de cores com atributos ARIA, e são baseados em padrões de conformidade de WCAG e Seção 508. Esta ferramenta baseada em navegador avalia o conteúdo da página após a aplicação de CSS, mas não avalia nenhuma fonte Javascript. Se o seu site possui muito conteúdo dinâmico com script, você pode optar pela extensão WAVE para Chrome, que também conta com 100% de segurança e relatórios, ideal para avaliar sites protegidos por senha, como portais de comércio e intranets.
NoCoffee
É uma extensão gratuita do Google Chrome que pode ser usada para simular uma ampla gama de problemas visuais, incluindo daltonismo, baixa acuidade, baixa sensibilidade ao contraste, campos visuais obstruídos e muitos outros. Deve-se notar que o NoCoffee não avaliará e avaliará necessariamente o seu site como outras ferramentas, embora lhe forneça uma perspectiva única sobre a experiência que os usuários com deficiência visual têm com o seu site.
ACheker
Uma ferramenta abrangente de revisão de acessibilidade que usa HTML para avaliar o conteúdo de uma única página. Você pode testar seu site inserindo a URL, fazendo upload de um arquivo HTML ou colando o código-fonte diretamente na ferramenta. Depois de enviar sua página, o AChecker verifica rapidamente o código HTML e gera um relatório que identifica possíveis problemas de acessibilidade. Existem algumas consultas adicionais que podem funcionar no AChecker, incluindo validadores HTML e CSS, mas você descobrirá muito sobre a acessibilidade do seu site executando o procedimento de diagnóstico padrão.
Ferramenta de análise de epilepsia fotossensível
Ferramenta beta gratuita que permite testar conteúdo para identificar risco de convulsão usando um mecanismo de análise desenvolvido pelo Trace Center da Universidade de Wisconsin Madison. O processo ajuda a determinar se as animações ou vídeos usados no conteúdo da web são suscetíveis de causar convulsões em usuários com epilepsia. Se você estiver procurando por mais ferramentas, o Trace Center tem outros recursos para ajudar os desenvolvedores a avaliar a acessibilidade de seu trabalho.
Ferramentas para desenvolvedores de acessibilidade
É uma extensão do Google Chrome. Isso adiciona uma auditoria de acessibilidade abrangente e um painel da barra lateral nas Ferramentas para desenvolvedores do Google (GDT). É necessário instalar a barra GDT para realizar a auditoria, mas é um processo simples: basta ter sua página aberta no Chrome, ir ao painel de acessibilidade nas Ferramentas do Desenvolvedor e clicar em executar. A auditoria ajudará você a identificar erros de acessibilidade, incluindo atributos ARIA ausentes, valores de contraste de cores e muito mais. Você pode ler a lista completa de regras de auditoria ou sugerir novos recursos analisando as extensões do GitHub.
Oráculo colorido
Este aplicativo gratuito simula várias formas de daltonismo adicionando um filtro de tela inteira ao seu sistema operacional (sim, funciona com Windows, Mac OS e Linux). As opções de filtro mostram as formas mais graves de daltonismo: deuteranopia, protanopia e tritanopia. Se o design passar por esses filtros, você sabe que também será facilmente legível por pessoas com daltonismo. Considerando que você pode ativar esses filtros instantaneamente, esta é a ferramenta perfeita para designers visuais que desejam avaliar seus designs enquanto trabalham.
Para desenvolvedores de conteúdo digital, para incluir o componente de acessibilidade em seus produtos, recomendamos estas ferramentas simples. E se quiser dar um passo adiante, convidamos você a visitar:
- Explore as checklists criadas pela Vox Media que permitem realizar uma verificação de acessibilidade de acordo com sua função no projeto.
- Visite o site da Iniciativa de Acessibilidade na Web do W3C, que explica este tópico em detalhes, compartilha boas práticas e oferece exemplos úteis sobre acessibilidade na web.
- Conheça a ferramenta OAW Rastreador, um aplicativo de código aberto desenvolvido pelo governo da Espanha que permite analisar o nível de acessibilidade de uma página web.
- Descubra como melhorar a Acessibilidade na Web de um comércio eletrônico
