Facilitando a navegação pelo teclado – Blog do Microsoft Edge

Você usa um teclado para navegar em sites? Nesse caso, você provavelmente já se deparou com inúmeros problemas de acessibilidade em que grupos de entradas ou widgets não são fáceis, ou mesmo possíveis de serem acessados ​​apenas com o teclado.

Um site acessível por teclado permite que você acesse facilmente suas diversas seções e navegue nelas de maneira intuitiva.

Infelizmente, sites inacessíveis são comuns na internet. O Relatórios do Almanaque da Web que cerca de 50% dos sites não usam tabindex, uma técnica comum para tornar possível a navegação pelo teclado na web.

A questão é complexa, no entanto. Os desenvolvedores da Web podem criar sites acessíveis por teclado usando as tecnologias à sua disposição atualmente. Mas, muitas vezes, estas tecnologias não facilitam as coisas para eles. Criar um site totalmente acessível pelo teclado, especialmente um que tenha widgets complexos, como menus, submenus, barras de ferramentas, guias e outros grupos de entradas, não é gratuito; requer muito trabalho e conhecimento.

Na verdade, se você é um desenvolvedor web, provavelmente já se deparou com os seguintes problemas comuns ao tentar melhorar a acessibilidade do seu site:

• Definir um valor incorreto tabindex valor ou esquecendo de defini-lo.
• Esquecendo de ligar para o focus() função para mover o foco para o elemento certo.
• Não impedindo o comportamento padrão do navegador ao manipular as teclas de seta.
• Focando entradas desabilitadas ou ocultas por engano.
• Implementar um padrão de navegação por teclado que não atende às expectativas dos usuários.
• Não lidar adequadamente com todas as instruções do texto.
• Não restaurar o elemento selecionado anteriormente ao refocar.
• E mais.

Mesmo que você tenha conseguido resolver todos esses problemas, ainda assim enfrentou as consequências: ou teve que escrever muitos códigos complicados ou teve que usar uma biblioteca JavaScript. Em ambos os casos, agora você tem mais código para manter e seu site carrega mais código na inicialização.

Isso, por sua vez, também afeta os usuários do seu site. Quanto mais código seu site precisar, mais tempo levará para ele carregar e se tornar utilizável.

Apresentando o grupo focal

Esse problema de acessibilidade do teclado está em nossa mente há muito tempo. Projetamos uma solução inicial para isso em 2021chamado grupo focal, e então começamos a colaborar com outras pessoas nele, como parte do Grupo da comunidade OpenUIem 2022.

Levar o problema e uma solução antecipada para um amplo fórum colaborativo nos permitiu amadurecer a ideia do grupo focal e passar por iterações, levando em consideração muitas perspectivas. Isso levou a uma solução melhor e mais completa para desenvolvedores web.

Hoje temos o prazer de anunciar que o recurso de grupo focal está disponível para testes iniciais por desenvolvedores web no Microsoft Edge.

Os desenvolvedores também podem testar o recurso em outros navegadores baseados no Chromium. Contribuímos com a implementação do projeto de código aberto Chromium para alcançar o maior número possível de usuários da Web e trabalharemos com outros fornecedores de navegadores para implementar grupos focais para toda a Web.

Se você é um desenvolvedor web, o focusgroup torna sua vida muito mais fácil:

• Você não precisa escrever nenhum tabindex faça você mesmo o código itinerante ou importe uma biblioteca para ele.
• Usar o grupo focal é fácil; um único atributo HTML geralmente é a única coisa que você precisa adicionar.
• As teclas de seta são manipuladas para você, em todas as direções do texto e ignorando elementos desabilitados e ocultos.
• Os padrões de navegação do teclado fornecidos pelo grupo focal são baseados nas diretrizes do Guia de práticas de autoria ARIA.
• O Focusgroup também funciona para elementos no shadow DOM.

Mais importante ainda, o impacto que o grupo focal terá para os usuários que navegam em sites com teclado é enorme:

• Os sites carregarão mais rápido!
• Você obterá uma experiência de navegação de teclado mais consistente em todos os sites.
• Embora a tabulação permita navegar pelas seções principais de uma página, as teclas de seta superior, direita, inferior e esquerda funcionarão conforme o esperado e permitirão que você acesse os vários elementos ou entradas dentro de uma seção.

Estamos entusiasmados por ter desenvolvedores web experimentando nossa implementação inicial de grupo focal no Microsoft Edge e nos contando o que eles acham. Com a sua ajuda, podemos tornar a solução ainda melhor e eventualmente lançá-la como um recurso estável da plataforma web.

Para saber mais sobre o recurso e como usá-lo, confira nossa postagem no blog do Chrome para desenvolvedorese deixe-nos saber o que você pensa.

Juntos, vamos criar uma web mais acessível.