Visualize e depure a acessibilidade do site com o Tota11y

Tecnologias assistivas são a nova norma para web design. Uma vez que o design responsivo se tornou mainstream, ficou óbvio para os designers que apoiar mais usuários é uma necessidade.

Mas tem muito trabalho a fazer para acessibilidade na web. Este é um tema enorme e não é algo que você pode pegar sem ferramentas úteis.

Tota11y é um kit de ferramentas gratuito para visualizar os problemas de acessibilidade do seu site. Isso funciona diretamente no navegador para que você possa carregar o kit de ferramentas, clicar em seu site (ou em qualquer site!) Para encontrar recomendações de acessibilidade..

Isso funciona como uma biblioteca JavaScript que pode ser conectada a qualquer página. Você também pode executá-lo manualmente em sites ao vivo por meio do Chrome DevTools, mas nem sempre é útil, a menos que você esteja trabalhando no site de outra pessoa.

Tota11y adiciona uma pequena barra de ferramentas à sua página e é executada dinamicamente em todo o DOM. Sempre que você clique em um elemento que você terá uma pequena caixa de expansão com detalhes cobrindo problemas de acessibilidade.

Uma coisa que eu realmente gosto em Tota11y é a linguagem clara usado com cada caixa de chamada. A maior parte da documentação do WAI-ARIA parece ler os códigos de impostos. Ótimo para se colocar no sono, não tão bom para depurar um site.

Com esta biblioteca, você encontrará problemas e soluções escritas em linguagem simples. Muito mais fácil de consumir e as soluções são rápidas.

Se você visitar a página principal, você encontrará uma demonstração do Tota11y em execução no site. É a pequena aba preta localizada no canto inferior esquerdo da tela. Basta clicar para uma visualização expandida cobrindo todos os elementos da página principal.

A coisa toda é opensourced sob a licença do MIT, então é muito fácil trabalhar com.

Você pode pegar uma cópia no GitHub e usá-la para praticamente qualquer coisa. Tota11y também vem com um monte de plugins que você pode estender para o script principal. Estes adicionar funcionalidade para verificar preocupações de acessibilidade mais detalhadas.

Se você é grande em testes de acessibilidade, então você absolutamente quer uma cópia deste script na sua caixa de ferramentas.