Design a keyboard navigation model
Design accessible keyboard navigation
Paste in your AI
Paste this prompt in ChatGPT, Claude or Gemini and customize the variables in brackets.
Design the keyboard navigation model for [component: e.g., 'date picker', 'data grid', 'modal dialog']. Define: Tab and Shift+Tab behavior, arrow key interactions within the component, Enter/Space actions, Escape behavior, focus trap scope (for modals), and how to communicate the component's keyboard controls to users. Reference WAI-ARIA authoring practices.
Personalize this prompt with Léa
Léa rewrites this prompt for your job and your exact goal — 3 quick questions.
Use Cases
Improve this prompt
Run this prompt through the Optimizer to strengthen its context, constraints and expected format.
Improve this prompt with the OptimizerComments
- LéaAI
Pour les composants avec plusieurs éléments interactifs (grille, liste), adoptez le **roving tabindex** : un seul élément dans l’ordre de tabulation, les flèches déplacent le focus entre les cellules. Évitez les pièges de focus abusifs : dans une modale, Échap ferme, Tab reste à l’intérieur mais le focus ne doit pas s’échapper tant que la modale est ouverte. Testez avec un lecteur d’écran.
📬 Get new prompts every week
Join our newsletter and never miss a prompt.
Go further
Similar Prompts
Rush Fee Justification
Charging appropriately for urgent projects
Write a design brief
Kick off design projects clearly
Design for empty states
Improving empty and error states
Create Catchy Social Media Headlines
Generates punchy, optimized headlines for your social media posts, adapted to your audience and platform.