Artigo Introdução de wulin.com (www.vevb.com): 10 dicas de falha de uso para sites que todos podem usar.
1. Adicione texto alternativo ao seu logotipo
Isso tem dois benefícios: o leitor de tela pode reconhecer o significado da imagem do logotipo e, quando a imagem não é carregada, também pode dizer aos usuários não visivelmente com deficiência onde está seu logotipo.
Vários métodos:
<img src = logo.png alt = site de ensino da web>
Ou, se você usar a imagem em segundo plano para implementar o logotipo, também poderá adicionar o atributo do título para implementá -lo:
<span title = web página de ensino site> </span>
Obviamente, a imagem do link + em segundo plano é a melhor maneira, mas é melhor adicionar o atributo de título também:
<A Title = Web Ensino Rede> Rede de Ensino da Web </a>
2. Adicione marcos básicos
ARIA Landmark é um conjunto de regras de usabilidade do site definidas pelo W3C. Adicionar marco descritivo a diferentes módulos do site - ou diretamente chamado de função, é propício ao software de leitura de tela para entender melhor suas páginas da web, para que os usuários com deficiência visual possam usar melhor seu site.
<NAV ROUS = NAVEGUENT>
<div id = mainContent função = main>
<forma de ação = search.php função = pesquisa>
3. Aumente a definição de foco
De fato, muitos sites tentarão todos os meios para remover o estilo de foco do navegador, especialmente para o navegador do IE. De fato, faz sentido ter o navegador com o foco padrão. Pode indicar onde está o foco atual do mouse do usuário. Isso é especialmente importante para o streaming de teclado.
Portanto, não remova o estilo de foco. Mesmo se você acha que o estilo padrão não é bonito ou inconsistente (ou seja, uma caixa pontilhada, o webkit é uma caixa sólida destacada e o safari é azul, o cromo é laranja), você também pode definir uma cor de destaque:
A: foco {
Esboço: 1px vermelho sólido;
Antecedentes: amarelo;
}
Se o seu gerente de produto ou designer visual insistirem em remover o estado de foco, basta tirar o mouse por um dia e dizer a ele que você só pode usar a guia para alternar os links. . .
4. Defina itens de formulário necessários
Use o atributo REOTENDIDO ARIA para definir os itens necessários no formulário - bem, é principalmente informar ao software de leitura da tela:
<Tipo de entrada = Nome do texto = nome de usuário ARIA-REQUIRADO = TRUE>
5. Adicione um H1 à sua página
O motivo é simples, não apenas para SEO, mas também para a usabilidade geral e a legibilidade do site. Além disso, você não tem obsessão por código?
6. Defina o cabeçalho da tabela
Geralmente, muitas pessoas estão acostumadas a usar tags TD para todas as formas. De fato, as mesas têm não apenas tags HD, mas também th, col, escopo, etc.
Então, basta colocar, altere o cabeçalho para a tag:
<th SCOPE = COL> Data </th>
7. Defina a descrição da tabela
Não simplesmente adicione um P na frente de/depois da tabela. A tabela possui uma tag de legenda dedicada, como uma foto.
<tabela>
<Legenda> Cronograma da classe </gendion>
<tr>
...
8. Evite clicar aqui
Embora essa descrição de link não importa para pessoas comuns, é muito ruim para o software de leitura de tela. Na verdade, é uma interferência para usuários com deficiência visual.
Então, basta usar o link no lugar certo.
9. Remova o tabindex
Era uma vez, muitas pessoas usaram o Tabindex para aprimorar a experiência do usuário, mas esse atributo atrapalharia a ordem de leitura normal da página, o que é desastroso para usuários com deficiência visual e pode não ser amigável com usuários comuns.
Portanto, não abuse do atributo tabindex.
10. Verifique online
Bem, quando vi isso, descobri que na verdade era um anúncio, mas se o problema de usabilidade do site puder ser detectado, também é uma coisa boa. Uma ferramenta da Web desenvolvida pela WebAIM detectará automaticamente a inserção do URL. Testado foi muito bom.