Focus Order

Focus Order is a primary element. It is mandatory to include in your digital product.

┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈

Remove the ability to focus on elements that are not meant to be discoverable. This includes things like inactive drop downs, off screen navigation, or modals. An example of focus order failure is keyboard navigation using the arrow key to traverse a tree component.

Summary Points:

  • Content on a page should be consistent and be able to be operated successfully with a keyboard

  • Relationships on the page should be logical and even predictable

  • Content on a page is defined by the technology, order and limitations of said content, such as HTML

  • Utilize the tabindex attribute, this specifies the order in which things receive focus on a page while using a keyboard

Focus Order HTML Example:

Includes a navigation menu and form

Further On This Topic:

https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms-focus-order.html