‘Focus Order’ requires that components receive focus in a logical sequence.

Introduction

Your users need to find their way around your website in a sequential and meaningful order. You can control this with the ‘focus order’ of your website.

‘Focus order’ is the sequence in which users access components on your website. Users with keyboard-only navigation or screen readers will follow the focus order you have set, so it’s essential your focus order preserves meaning and usability. 

How to Pass ‘Focus Order’

Ensure the focus order of each web page follows a sequence that preserves the meaning and functionality of the page.

Exceptions

  • Complex items like tree diagrams do not have to be exactly programmed to a specific order if your users can reach every element.
  • You don’t need to set a focus order if your page doesn’t need to be navigated in a particular sequence to be understood. For example, a random collage of links or images.

‘Focus Order’ Tips

Unplug your mouse and verify that you can use the ‘Tab’ key to navigate to every part of your website and use every function, including search boxes and forms – make sure each page has a sensible focus order.

If you have complied with Keyboard, you may have already covered elements of this guideline.

See Also

Free Developer Resources

Join over 3,700 subscribers on my weekly web accessibility email and get free developer resources like WCAG Checklists and special offers.

Powered by ConvertKit

Over 600 developers like you have learned more about the Web Content Accessibility Guidelines with my guidebook.

Learn more >

About Author

I'm Luke, I started Wuhcag in 2012 to help people like you get to grips with web accessibility. Check out my book, 'How to Meet the WCAG 2.0'.