What is Focus?

Author: Rob Dodson — Focus is one of the main pillars of accessibility, but it’s also an area that many developers are a little fuzzy on.

Here’s a good quote from Web AIM to help explain it:

“When an item has keyboard ‘focus’, it can be activated or manipulated with the keyboard.” In other words, if an element is currently focused, and you press a key on your keyboard, that keyboard event will be directed at that element. — http://webaim.org/techniques/keyboard/#intro

Users can change the currently focused element by pressing either the Tab or Shift-Tab keys. The order that elements receive focus is known as the “Tab Order”. Making sure you have a consistent, logical tab order is extremely important, especially for users who rely on the keyboard as their primary means of navigating a page.

In this episode of a11ycasts we’ll show off what it means for elements to be implicitly focusable, and correct some common mistakes relating to mixed up tab orders.