Tab Index: Navegação mais acessível no Flash

Já tentou navegar na internet sem usar mouse? Bem difícil, você diria. Mas é assim que um usuário com deficiência motora, por exemplo, navega, na base do Tab e Enter. Agora imagine a dificuldade que este mesmo usuário teria tentando navegar em um site totalmente desenvolvido em Flash. A Macromedia/Adobe já dá uma ajuda ao indexar automaticamente os botões para ficarem acessíveis ao teclado com o Tab/Enter, mas cabe ao desenvolvedor organizar essa navegação. Isso, apesar de muito simples de fazer, praticamente ninguem faz. Conheca o tabIndex O tabIndex é uma propriedade do flash que define a quantidade de tabs que o usuário deve apertar até chegar em determinado botão e, consequentemente, permite organizar a navegação e deixá-la mais acessível. A sintaxe do tabIndex é bem simples.
nome_do_botao.tabIndex = X;
No caso, nome_do_botao é um nome que você define e X é o índice, ou seja, quantos Tabs tem que apertar para chegar até o objeto. Veja um exemplo de navegação sem tabIndex

[flash https://www.richardbarros.com.br/testes/no_tab_index.swf w=340 h=200]

Agora vamos aplicar o tabIndex aos ítens do menu:
item1.tabIndex = 1;
item2.tabIndex = 2;
item3.tabIndex = 3;
item4.tabIndex = 4;
item5.tabIndex = 5;
item6.tabIndex = 6;
item7.tabIndex = 7;
Veja como fica:

[flash https://www.richardbarros.com.br/testes/com_tab_index.swf w=340 h=200]

O resultado á bem melhor para quem não pode usar um mouse, não é? Você pode baixar o FLA fonte clicando aqui e conhecer mais sobre acessibilidade no site AcessoDigital.net.

Gostou do artigo? Siga-me no Twitter @richardbarros

3 comentá em “Tab Index: Navegação mais acessível no Flash

  1. Rodrigo 16/09/2008 09:33

    Obrigado! A explicação é simples e objetiva.

    Responder

  2. Fernando 07/06/2009 14:10

    Richard, obrigado pela explicação, porém estou com o seguinte problema: meu formulario carrega no nive3 e o tab busca nos niveis abaixa tambem, nos botoes. Como fazer pra funcionar somente no formulario no nivel dele?
    Agradeço

    Responder

Faça um comentário

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>