Kanbritech Learn logo
HTML HTML References 45h track

Keyboard Shortcuts

Test your final project without a mouse and record any action you cannot complete.

Understand the topic

Keyboard shortcuts can make editing and testing efficient, but they vary by operating system, browser, editor, and keyboard layout. Learn a small set you use regularly and check your tool menu for exact bindings. Keyboard testing is also an accessibility check: a page should work without requiring a pointer. Application shortcuts must not trap focus or unexpectedly override common browser commands.

Worked example

<table><caption>Common keyboard actions</caption><tr><th scope="col">Action</th><th scope="col">Common Windows/Linux binding</th><th scope="col">Common macOS binding</th></tr><tr><td>Save</td><td>Ctrl+S</td><td>Command+S</td></tr><tr><td>Find</td><td>Ctrl+F</td><td>Command+F</td></tr><tr><td>Undo</td><td>Ctrl+Z</td><td>Command+Z</td></tr><tr><td>Reload browser</td><td>Ctrl+R</td><td>Command+R</td></tr><tr><td>Move between controls</td><td>Tab / Shift+Tab</td><td>Tab / Shift+Tab, depending on keyboard navigation settings</td></tr></table>

These are common defaults rather than guarantees. Enter activates links and buttons; Space commonly activates focused buttons and checkboxes.

Practice

Test your final project without a mouse and record any action you cannot complete.

Show a suggested answer
Move forward and backward with Tab and Shift+Tab, activate links and buttons, open disclosures, and fill the form. Confirm that focus remains visible and no control traps you.

Common mistake

Do not define single-letter global shortcuts without considering accidental activation and assistive technology users.

HTML documentation

Live Example

Try Coding

Result