Acessibilidade 26 Jun 2008 07:44 am
Accesskeys: Atalhos do teclado em uma página na web
Sabe os atalhos do teclado que adoramos usar nos nossos programas do dia a dia?
ALT+F4 pra fechar qualquer porcaria, CTRL+TAB para mudar de aba, etc…
Pois é, o HTML também possue suporte a essa funcionalidade, e é mais simples do que muito desenvolvedor imagina.
Onde poderiamos usar os atalhos do teclado em uma página web?
Ora, para pular para um conteúdo específico por exemplo, ou para o menu, ou qualquer parte do HTML, ou carregar outra página, o que pode ser muito útil em páginas ou sistemas na web que são acessados muitas vezes durante o dia, com várias rotinas de repetição e navegação.
Poderiamos por exemplo usar um ALT+C para pular para o conteúdo, ou ainda, ALT+L para ir para a lateral, as possibilidades são muitas, depende apenas do projeto que estamos desenvolvendo.
E por último porém não menos importante, atalhos ajudam pessoas com problemas de mobilidade que tem dificuldade em usar o mouse a chegar no conteúdo desejado, excelente! 
Vamos começar então a brincar um pouco com o seguinte código:
<body>
<ul id=’menu’>
<li>
<a href=”inicial.php” accesskey=”h”>Inicial</a>
<a href=”vendas.php” accesskey=”0″>Vendas</a>
<a href=”clientes.php” accesskey=”1″>Clientes</a>
<a href=”contato.php” accesskey=”2″>Contato</a>
<a href=”acessibilidade.php” accesskey=”k”>Acessibilidade</a>
<a href=”#atalho_conteudo” accesskey=”s”>Ir para o conteudo</a>
</li>
&/ul>
<div id=”conteudo”>
<a name=”atalho_conteudo”></a>
seu conteudo aqui
</div>
</body>
O que basicamente acontece no código acima.
Em um PC se você pressionar ALT+H irá para a página inicial, em um MAC aperte CTRL+H e terá o mesmo comportamento.
Da mesma forma se apertar ALT+0 irá para a página de vendas, ALT+1 para Clientes e ALT+2 para Contato.
Ainda, se pressionar ALT+K irá para uma página de acessibilidade, algo importante em páginas web e todas deveriam ter uma e a maioria das que fiz no passado recente não tem, mea culpa.
Ali voce poderia por além da política de acessibilidade do site, as teclas de atalho disponíveis no mesmo para facilitar a vida de quem as usa.
E por fim, se pressionar ALT+S irá pular para o conteúdo.
Até onde sei não existe nenhum padrão a ser utilizado nessas teclas de atalho, ou seja, um ALT+H não necessariamente tem que ir para a “home”.
Porém, mesmo não existindo um padrão documentado e aceito por todos, pela minha experiência de trabalho tanto na Itália, quanto agora no Reino Unido vejo que uma prática comum é utilizar os atalhos da seguinte forma:
- H para ir para inicial
- S para pular para o conteudo principal
- F para pular para o rodape
- N para pular para o menu principal
- K para ir a pagina de acessibilidade
- Numeros de 0 a 9 para o menu de navegacao
Repito, não é um padrão estabelecido, mas é muito utilizado, portanto sintam-se livres para fazer como quiserem, e se quiserem seguir a recomendação, melhor ainda
on 26 Jun 2008 at 9:28 am 1.Thiago Prado de Campos escreveu …
Bom Dia!
Rodrigo, é bom lembrar que ALT + é um comando reconhecido apenas no Internet Explorer. No Firefox a combinação é SHIFT + ALT + e no Opera SHIFT + ESC exibe todas as teclas de acesso da página, bastando ao usuário teclar a tecla do acesso correspondente. O incoveniente do ALT + do Internet Explorer é que ele substitui o acesso pelo ALT ao menu do navegador, se estas corresponderem às opções do menu.
As accesskey são mais utilizadas por usuários portadores de deficiência motora ou até mesmo visual. Elas podem ser usadas nos elementos de âncora (links), AREA, BUTTON, INPUT, LABEL, LEGEND e TEXTAREA.
No caso da Inglaterra, há um padrão, definido em http://www.direct.gov.uk/en/Hl1/Help/DG_020463
que consistem no esquema:
S - Skip navigation
1 - Home page
2 - Newsroom
3 - Site map
6 - Help
7 - Complaints
8 - Terms and conditions
9 - Feedback form
0 - Access key details
[]s
Thiago P. Campos
on 26 Jun 2008 at 1:03 pm 2.Danilo escreveu …
Eu apertei alt + h aqui, e não aconteceu nada!
on 26 Jun 2008 at 1:30 pm 3.Rodrigo Fante escreveu …
Pus um If caso fosse voce.
on 26 Jun 2008 at 2:47 pm 4.Rodrigo Fante escreveu …
@Thiago:
Primeiro, obrigado pelo excelente complemento ao artigo
Sobre a Inglaterra, aquela eh apenas uma pagina que mostra como esses atalhos sao usados no site directgov, nao sao regras do governo ou mesmo recomendacoes.
Trabalho na Inglaterra, perguntei pro pessoal no trabalho e aqui como no Brasil, nao existe nenhuma regulamentacao nesse sentido.
on 26 Jun 2008 at 2:48 pm 5.Rodrigo Fante escreveu …
Ah, e nasci em Londrina