This page is a work in progress.
https://accesswatch.github.io/azaccess/work/web/keyboard-simulator.html
Practice navigating common UI patterns using only your keyboard. Your keystrokes are shown in real time.
Tab— Move focus to the next interactive elementShift+Tab— Move focus to the previous interactive elementEnter/Space— Activate buttons and linksEscape— Close modals, menus, popups←→— Navigate within tab lists, radio groups, menus↓↑— Navigate within select dropdowns and menus
Scenario: Complete a form
Tab through the form fields, type values, use ↓ to open and navigate the select dropdown, then submit.
Tasks
- Tab to the Name field and type a name
- Tab to Email and type an address
- Choose a department from the select
- Tab to Submit and press Enter
0 / 4 tasks completed
Scenario: Open, use, and close a modal
Press Enter on the button to open the modal. Tab through the fields inside. Press Escape to close it. Focus should return to the trigger button.
Tasks
- Press Enter on “Edit Profile” to open the modal
- Tab through the fields inside the modal
- Press Escape (or click Cancel) to close the modal
- Verify focus returned to the trigger button
0 / 4 tasks completed
Scenario: Navigate a tab panel
Tab to the tab list, then use ← and → arrow keys to switch between tabs. The panel content changes as you navigate.
Overview: This panel contains a high-level summary. You navigated here using Tab, then arrow keys.
Details: More detailed information lives here. Press ← to go back to Overview.
Contact: Reach out to accessibility@arizona.edu for help.
Tasks
- Tab to the tab list
- Use → to move to “Details”
- Use → to move to “Contact”
0 / 3 tasks completed