Understanding Success Criterion 2.4.3: Focus Order

Understanding Success Criterion 2.4.3 Focus Order

Users should be able to sequentially navigate through the content in such a way that they can easily consume information. 

Official Requirements

Success Criterion 2.4.3 Focus Order (Level A): If a Web page can be navigated sequentially and the navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning and operability.

Why is it required?

Keyboard users, people with mobility who must rely on a keyboard to access the web, have difficulty understanding content if it’s not presented in a logical, usable focus order. Users with disabilities might also interpret form fields in a different context if the logical order is not followed. 

How do we fix it?

By ensuring that the visible focus order matches the Document Object Model (DOM) order

Mistakes to avoid

  • Using CSS properties like flexbox to alter visual presentation may result in DOM order not matching the visual focus order
  • Focus order won’t make sense if CSS styles are disabled without making up for it
  • Using dialogs or menus that are not adjacent to trigger control in the sequential navigation order

Picture of Aditya Bikkani

Aditya Bikkani

Aditya is the COO of AELData, a growing technology company in the Digital Publishing and Education sectors. He is also an entrepreneur and founder of an accessibility tool called LERA. A W3C COGA (Cognitive and Learning Disabilities Accessibility) Community Member Aditya contributes to researching methodologies to improve web accessibility and usability for people with cognitive and learning disabilities.

Leave a Reply

Your email address will not be published. Required fields are marked *

Share on Social Media


Related Blogs

The Three Levels Of Accessibility

The Three Levels Of Accessibility

To make web accessibility a priority, you must establish objectives and monitor your progress. The Web Content Accessibility Guidelines (WCAG) provide the best framework currently

How Accessible Is Your Website?

Check your site’s accessibility in few seconds with our FREE accessibility checker. Ensure compliance with ADA & WCAG guidelines and improve user experience across the board.

Skip to content