wave accessibility testing tool tutorial
WAVE Web Accessibility Tool Tutorial: Como usar a extensão WAVE para Chrome e Firefox
Barra de ferramentas de acessibilidade da web foi explicado em detalhes em nosso tutorial anterior. Este tutorial é uma continuação do primeiro desta série, verifique-o aqui - Teste de acessibilidade da web - parte 1 .
Nesse tutorial, vimos alguns conceitos fundamentais do que é acessibilidade e como ela pode ser avaliada usando ferramentas de teste de acessibilidade.
Neste tutorial, veremos mais algumas ferramentas de acessibilidade como WAVE Toolbar, ferramenta de acessibilidade JAWS, técnicas e detalhes.
[imagem fonte]
O que você aprenderá:
porque o linux é melhor que o windows
ACENO(Ferramenta de Avaliação de Acessibilidade na Web)
A ferramenta WAVE é uma ferramenta de avaliação de acessibilidade na web - uma barra de ferramentas para Navegador Firefox.
É importante observar que WAVE não pode dizer se o seu conteúdo da web está acessível; apenas um humano pode determinar a verdadeira acessibilidade. Porém, WAVE pode ajudá-lo a avaliar a acessibilidade de seu conteúdo da web.
Todas as avaliações acontecem diretamente no navegador e nenhuma informação é enviada aos servidores WAVE. Isso garante relatórios de acessibilidade 100% privados e seguros.
Para fazer o download da barra de ferramentas de acessibilidade WAVE na web, vá para http://wave.webaim.org/toolbar/ e baixe em F navegador irefox . Certifique-se de abrir o URL de download no navegador Firefox, pois a barra de ferramentas WAVE suporta apenas o Firefox.
Como usar a barra de ferramentas WAVE Web Accessibility
A seguir estão os recursos que podemos usar ao trabalhar no navegador Firefox:
# 1) Selecione o site http://www.easports.com/ , a seguir clique em “Erros, Recursos e Alertas”, você encontrará a página com alertas de acessibilidade e erros na cor amarela. Passe o mouse sobre as imagens para ver os detalhes dos alertas.
( Observação : clique em qualquer imagem para visualização ampliada)
#dois) Agora clique em “Structure / Order View”, você obterá a página com os detalhes do Frame Inline.
# 3) Agora clique em “Text-only View”, o site será exibido sem imagens, estilos e layouts.
# 4) Os ícones “Outline View” na barra de ferramentas permitem que você saiba se os títulos estão em ordem ou não.
# 5) O ícone “Redefinir página” atualizará a página.
# 6) Clicar em “Desativar estilo” removerá os estilos CSS da página.
# 7) O botão “Chave dos ícones” exibirá uma lista de todos os ícones WAVE com detalhes, informações e recomendações adicionais.
Você também pode avaliar a acessibilidade do site sem baixar a ferramenta wave e usá-la diretamente online.
Passos para verificar a acessibilidade do site
Passo 1) Clique no URL: http://wave.webaim.org/
Passo 2) Introduzir o Endereço da página da web no texto caixa e pressione Enter. Vamos usar com como um exemplo. Então entre no site www.facebook.com na caixa de texto e clique no botão entrar.
Etapa 3) Você encontrará detalhes resumidos no lado esquerdo da navegação.
perguntas e respostas sql para experientes
- Os erros seriam exibidos em vermelho com uma contagem. No meu caso, está mostrando 13.
- Os alertas seriam exibidos em amarelo com uma contagem de 13.
- Os recursos estariam em verde com uma contagem de 10.
- Os Elementos Estruturais seriam 6 na cor azul.
- HTML5 e ARIA seriam 15 na cor roxa.
- Os erros de contraste seriam 14 na cor preta.
Clicar em cada ícone fornecerá mais informações sobre os elementos conforme mostrado acima para alerta (no centro da página).
Agora, vamos dar uma olhada em uma categoria diferente de ferramentas:
Validadores de acessibilidade de página da web grátis:
Algumas das melhores ferramentas de verificação de acessibilidade da Web:
- AChecker ferramenta de avaliação de acessibilidade de código aberto
- PowerMapper
- Manobrista de acessibilidade
- EvalAccess
- MAGENTA
Ferramentas para deficiência visual
A deficiência visual refere-se a uma perda de visão. Existem diferentes tipos de deficiência visual:
- Cegueira
- Visão baixa ou restrita
- Daltonismo
Usuários com deficiência visual usam software de tecnologia assistencial que lê o conteúdo em voz alta.Por exemploJAWS para sistemas operacionais Windows, NVDA para sistemas operacionais Windows, Voice Over para Mac. O usuário do UA com visão fraca também pode aumentar o texto com uma configuração do navegador ou uma configuração magnífica do sistema operacional. Vamos aprender esses recursos com a ajuda de ampliadores e ferramentas JAWS.
A) Lupas
1) Zoom Text Magnifier amplia tudo na tela do computador e torna o aplicativo fácil de ver e usar. Você pode baixá-lo de esse link .
Para ter uma boa ideia de como isso funciona, é altamente recomendável que você baixe uma versão de avaliação gratuita e experimente.
2) Lupa da janela também amplia diferentes partes da tela. Podemos abri-lo clicando no botão Iniciar em sua área de trabalho e, em seguida, digitar Lupa. Clique no programa Magnifier. Quando você passa o mouse sobre a página da web, esta ferramenta aumenta o tamanho da tela e exibe.
3) Usuários cegos de computador, que não podem usar um monitor normal de computador, usam uma tela Braille atualizável ou um terminal Braille para ler a saída de texto.
De acordo com Wikipedia , um display Braille atualizável ou terminal Braille é um dispositivo eletromecânico para exibir caracteres Braille, geralmente por meio de pinos de ponta redonda levantados através de orifícios em uma superfície plana.
B) JAWS- Acesso ao Trabalho com Fala
JAWS é um leitor de tela usado para testar páginas da Web no sistema operacional Windows que permite que usuários visualmente danificados leiam a tela. O JAWS oferece suporte a todas as versões de sistemas operacionais, além de fornecer display Braille atualizável.
A seguir estão os comandos de teclado para usar o JAWS:
As funções básicas testadas com a ajuda do JAWS são:
- O JAWS fornece o número de pressionamentos de tecla para navegar nas páginas da web. Por exemplo, teclas de seta, teclas Page Up e Down, Home, End e várias outras teclas de navegação JAWS.
- Links, imagens e mapas de imagens: O JAWS fornece combinações de teclas para navegar de um link para outro na página da web.
- Campos e controles do formulário HTML : JAWS fornece combinações de teclas para navegar entre os elementos do formulário
- Frames HTML : Navegue pelos frames com o teclado.
- Mesas : Navegar nas células da tabela
Esta é uma breve visão geral das diferentes técnicas e ferramentas que são utilizadas para realizar a avaliação da acessibilidade.
Dicas de teste de acessibilidade para desenvolvedores e testadores
- Todas as imagens ativas têm texto alternativo que indica o que o link ou botão faz?
- Todas as imagens decorativas e redundantes têm texto alt nulo (alt = ””)?
- Todas as imagens de informações têm texto alternativo que fornece as mesmas informações que as imagens fornecidas?
- A página está organizada com títulos? Eles estão marcados como títulos?
- Você pode acessar tudo usando o teclado?
- Sua página será lida em uma ordem lógica em um leitor de tela?
- Está claro qual elemento está em foco enquanto você usa o acesso do teclado?
- Todas as informações importantes em um vídeo estão disponíveis por meio de áudio padrão ou de áudio-descrição adicional?
A equipe de desenvolvimento pode certificar-se de que seu produto é compatível com acessibilidade por inspeção de código e teste de unidade.
Casos de teste típicos:
- Certifique-se de que todas as funções estão disponíveis apenas pelo teclado (não use o mouse)
- Certifique-se de que as informações estejam visíveis quando a configuração da tela for alterada para os modos de alto contraste.
- Certifique-se de que as ferramentas de leitura de tela possam ler todo o texto disponível e que cada imagem / imagem tenha um texto alternativo correspondente associado a ela.
- Certifique-se de que as ações de teclado definidas pelo produto não afetem os atalhos de teclado de acessibilidade.
Conclusão
A acessibilidade na Web oferece muitas oportunidades para usuários com deficiência. No entanto, temos que reconhecer o fato de que é difícil fornecer acesso completo para todo tipo de deficiência ou dificuldade que possa impedir um usuário de acessar o conteúdo de um site.
Etapas podem ser executadas, mas podem não ser 100%. Se seguirmos os padrões descritos neste artigo desde o estágio inicial de desenvolvimento, podemos criar facilmente um site acessível para a maioria dos usuários.
Sinta-se à vontade para sugerir mais dicas e ferramentas de teste de acessibilidade nos comentários abaixo.
PREV Tutorial | PRIMEIRO Tutorial
Leitura recomendada
- Tutorial WAT (Web Accessibility Toolbar) para teste de acessibilidade
- Tutorial de teste de acessibilidade (um guia passo a passo completo)
- Tutoriais detalhados do Eclipse para iniciantes
- Tutorial Geb - Teste de automação de navegador usando a ferramenta Geb
- Melhores ferramentas de teste de software 2021 [QA Test Automation Tools]
- 20 principais ferramentas de teste de acessibilidade para aplicativos da Web
- Tutorial de teste destrutivo e teste não destrutivo
- Teste Funcional Vs Teste Não Funcional