How do I navigate a website with my keyboard?
Question
I've been reading about how I need to make sure my site can be navigated with a keyboard. Honestly, I'm not even sure where to start because I don't know what button I would hit on my keyboard. How do I navigate a website with my keyboard?
Answer
To navigate a website with the keyboard, you can start by hitting the tab key. You should see an indicator on the element that has focus.
Here are some keyboard navigation basics:
- Tab - move to next interactive element
- Shift + Tab - move to previous interactive element
- Return/Enter - activate elements (links, buttons, etc)
- Spacebar - activates buttons (such as to pause/play videos, submit forms, etc)
- Esc - close opened content (modals, navigation menus, etc) or cancel current action
- Arrows - navigate within widgets (tablists, checkboxes within a disclosure button, etc) and navigate around a page