Acessibilidade: preparar o site para leitores de tela
4 min de leitura
Alguns visitantes do seu site podem usar tecnologias assistivas, como leitores de tela, para navegar no seu site. Leitores de tela são aplicativos usados por pessoas com deficiência visual. Eles escaneiam o conteúdo do seu site e, em seguida, "leem" o conteúdo em voz alta para o visitante. Os visitantes que usam leitores de tela geralmente também usam a tecla Tab para navegar pelo seu site, pois podem não ser capazes de ver onde clicar.
A ordem DOM do seu site é a ordem em que os leitores de tela e a tecla Tab destacam e/ou "leem" o conteúdo na sua página. Ele deve seguir uma ordem lógica para garantir que seus visitantes tenham a melhor experiência possível em seu site e possam entender e desfrutar de seu conteúdo.
Observação:
Alguns visitantes podem não usar um leitor de tela, mas ainda usam a tecla Tab para navegar no seu site, como pessoas com problemas de mobilidade. Portanto, recomendamos sempre garantir que a ordem DOM do seu site esteja correta.
Neste artigo, saiba mais sobre:
Sobre a ordem do DOM do seu site
O DOM é a ordem dos elementos no seu site. Isso é particularmente importante quando os visitantes do seu site estão usando leitores de tela e/ou a tecla Tab, pois eles precisam ser capazes de navegar pelo seu site em uma ordem lógica. Por exemplo, o menu do site deve vir primeiro, seguido pelo resto dos elementos no cabeçalho, depois o título da página, o conteúdo da página etc. Se a ordem do DOM estiver incorreta, isso pode fazer com que o leitor de tela/tecla Tab pule uma parte ou percorra o conteúdo da sua página de forma indesejada.
O Wix define automaticamente uma ordem DOM para você. A sequência usa a ordem visual dos elementos, da esquerda para a direita e de cima para baixo. Ao desenvolver nossas ferramentas de acessibilidade, testamos nossos produtos usando os seguintes leitores de tela:
- Windows + Firefox ou Chrome: NVDA (Leitor Grátis)
- iOS + Safari: Voiceover (Leitor Embutido)
Isso significa que criamos a ordem DOM automática do seu site com as funções dos aplicativos acima em mente. Você pode testar a ordem automática do DOM do seu site usando a tecla Tab do teclado ou um leitor de tela no seu site online.
Alterar a ordem DOM do seu site
Se você testar a ordem DOM do seu site e perceber que a ordem não é lógica, você pode alterá-la manualmente no Assistente de Acessibilidade. O Assistente é uma ferramenta que verifica seu site, localiza possíveis problemas de acessibilidade e fornece soluções práticas para corrigi-los. Além disso, você também pode usar o Assistente de Acessibilidade para alterar as configurações avançadas de acessibilidade em seu site.
Importante:
Se a ordem de tabulação do seu site for lógica, você não precisa fazer nada. Alterar a ordem quando ela já está correta pode causar problemas para os visitantes que usam leitores de tela e/ou a tecla Tab.
Para alterar as configurações do DOM:
- Selecione Configurações na barra superior do seu Editor.
- Selecione Assistente de acessibilidade.
- Selecione o ícone Mais ações
no canto superior direito do Assistente.
- Selecione Configurações avançadas.
- Selecione Ordem automática do DOM.
- Desative a alavanca no painel.
- Selecione Desativar na janela pop-up.
- Selecione o ícone Camadas
no canto inferior esquerdo do Editor. - Verifique a lista e exclua todos os elementos redundantes. Isso inclui elementos duplicados que não têm uso no seu site e podem confundir os usuários que utilizam leitores de tela.
- Arraste e solte os elementos na ordem que você desejar.
Observações:
- Navegar em um site usando a tecla Tab, navega apenas pelos elementos interativos e não pelos elementos estáticos, como texto. Se você quiser testar um leitor de tela em elementos estáticos, como texto, siga as instruções na Central de Ajuda do seu leitor de tela sobre como navegar adequadamente em um site com um teclado.
- Elementos fixados são colocados automaticamente no final da sequência de tabulação. Se você quiser que ele seja colocado no início da sequência, recomendamos que você solte o elemento e coloque-o no cabeçalho.
Próximos passos:
- Abra o Editor mobile e repita os mesmos passos.
- Volte para a Lista de verificação de acessibilidade para continuar trabalhando na acessibilidade do seu site.
Esse artigo foi útil?
|