𝗗𝗲𝘀𝗶𝗴𝗻 𝗱𝗲 𝗡𝗮𝘃𝗲𝗴𝗮𝗰̧𝗮̃𝗼 𝗽𝗼𝗿 𝗧𝗲𝗰𝗹𝗮𝗱𝗼 𝗽𝗮𝗿𝗮 𝗗𝗮𝘁𝗮 𝗚𝗿𝗶𝗱𝘀
Usuários avançados querem trabalhar sem o mouse.
Um data grid bem projetado permite que eles naveguem, editem e ajam usando apenas o teclado. Esses usuários se movem de duas a três vezes mais rápido do que usuários de mouse.
Se a sua grade exigir um clique para cada ação, os usuários avançados odiarão sua ferramenta.
A solução é simples. Requer cerca de cem linhas de código e escolhas de design inteligentes.
Siga estas regras para uma grade profissional:
• Tab: Use para entrar ou sair da grade. Uma vez dentro, o Tab deve alternar entre botões ou campos de entrada dentro de uma linha. Não use o Tab para navegar entre células.
• Teclas de Seta: Use para navegar entre células. Cima e baixo movem entre linhas. Esquerda e direita movem entre colunas.
• Enter: Use para acionar a ação principal de uma linha, como abrir uma visualização de detalhes.
• Espaço: Use para selecionar ou deselecionar uma linha.
• Escape: Use para cancelar uma edição ou fechar um menu.
• Home e End: Use para saltar para o início ou o fim de uma linha.
O maior erro é usar o Tab para navegar entre células. Em uma grade grande, isso é muito lento. Se uma grade tiver 7 colunas e 20 linhas visíveis, o usuário terá que pressionar Tab 140 vezes para terminar uma tela. As teclas de seta resolvem isso. Uma pressão move você para a próxima linha.
Para edição inline, siga o padrão de planilhas:
- Pressione Enter para começar a editar uma célula.
- Pressione Enter novamente para salvar a alteração.
- Pressione Escape para cancelar a edição.
- Pressione Tab para salvar e mover para a próxima célula editável.
Para ajudar os usuários a encontrar esses atalhos, use estes padrões:
- Adicione um atalho "?" para abrir um menu de ajuda.
- Mostre atalhos em tooltips nos botões.
- Use uma dica de onboarding única.
Uma boa navegação por teclado é um multiplicador de produtividade. É um pequeno investimento para um aumento massivo na velocidade do usuário.