Para fazer com que os links fiquem acessíveis “href acessível” para leitores de telas e usuários que usam o teclado para navegar na internet. É bem simples e vou descrever algumas técnicas, tentando ser mais claro e objetivo possível.
Adicionando o Atributo “title”
O atributo “title” é muito importante, é ele que vai dar a descrição do link e informar para onde ele vai levar o seu usuário.
<a href="acessibilidade.html" title="Ir a página de acessibilidade">
Acessibilidade
</a>
Facilite a vida dos seus usuários e escreva com um texto conciso, que faça sentido e que tenha relevância.
Adicione Teclas de Atalho
É uma boa idéia usar teclas de atalho na navegação principal, com isso você vai facilitar a vida de muita gente que tem dificuldade motora e não usa o mouse para acessar o seu conteúdo.
<a href="acessibilidade.html" accesskey="a">Acessibilidade</a>
Pular para o Conteúdo
Permita que o usuário possa ir direto ao conteúdo desejado.
Utilize um link com o atributo accesskey no topo do documento, faça com que ele seja o primeiro link do seu site. Com isso você evitará que o usuário percorra o site todo até chegar ao conteúdo desejado.
Caso você não queira que esse link apareça no topo, você poderá ocultar com CSS.
<div id="topo">
<h1>titulo do site</h1> <!-- "essa área é muito importante p/ SEO mas é assunto para outro post" -->
<a href="#conteudo" accesskey="p" title="ir ao conteúdo">Pular para o conteúdo</a>
</div>
<div id="menu">
<!-- os intens do menu -->
</div>
<div id="conteudo">
<!-- aqui é onde o usuário chegará, o conteúdo desejado -->
</div>
não que você vá colocar teclas de atalho em todos os links do seu site, mas pense nisso com carinho!
Navegando Através de Tab
Muitos usuários não podem ou não querem usar dispositivos como mouse para navegar em seu site.
Eles utilizam o teclado pra percorrer os links, geralmente usando a tecla “tab”.
Por este motivo seu código deve estar estruturado semanticamente, principalmente a estrutura de links, eles devem estar em uma ordem lógica de navegação, caso esteja, não é necessário usar o atributo “tabindex”.
Mas caso não esteja ou você queira conduzir seus usuários, use o atributo “tabindex” que permite definir a ordem de navegação dos links em seu sistema web.
<ul>
<li><a href="#" tabindex="3">Link 1</a></li>
<li><a href="#" tabindex="1">Link 2</a></li>
<li><a href="#" tabindex="2">Link 3</a></li>
<li><a href="#" tabindex="4">Link 4</a></li>
</ul>
Conduza seus usuários, dê a eles o que eles realmente precisam e querem ler