Issue of the week – Focus

We have been so busy with new clients here at ADASure that we have regrettably fallen behind with our blog posts. Thankfully, the additional work has helped us gain more insight into key issues that our partners are dealing with now. We wanted to share in hopes of helping other professionals identify and fix these issues.
The most common guideline in which we have seen problems with this week has to be the Level AA guideline 2.4.7 – Focus Visible. The intent of this guideline is to allow anyone who can only access the internet with a keyboard to enjoy have the same experience and functionality afforded to a user who has a keyboard plus pointing device.
The success criterion is simple; users should be able to access all functionality of the website with only a keyboard. The problems we commonly see are:

• Focus is missing or randomly appears and disappears on the site
• Logical sequence for the user flow is problematic (also covered under Level A guideline 1.3.2)
• Keyboard traps (covered under Level A guideline 2.1.2 – No Keyboard Trap)
• We wanted to cover all of these guidelines in one post since they are all related to keyboard-only users.

Focus is one of the areas you tend to take for granted.  It’s a seemingly small issue but it is critical and will stop users from accomplishing their goal if it’s not working.
We’ll illustrate with a specific example we saw this week. One website had a huge selection of items available to purchase and worked well with a keyboard and mouse. The difficultly arose when we attempted to navigate the site with a keyboard only. Focus randomly appeared for some items and would jump around the page so you were never sure where you would land.
Without focus, we were unable to tell what product we were on. Guesswork, luck and counting key clicks let us do a few things but it was long and painful. In this case, it took us 92 clicks to get from the top of the page to the footer. Since focus didn’t work properly, users did not know where you would end up.
Navigating to the footer enabled us to get to more areas of the site but not all. What’s really frustrating, for any user, is that you could easily miss the item in the footer that you wanted. If a user clicked one time too many then they would have to start all over at the top, recount their tabs, and hope they landed on the correct link the second time. Not only is this an accessibility issue but it’s also a usability issue. You could sell more if your website was open and accessible to all users.
Logical sequence is truly covered under Level A guideline 1.3.2 but we mention it since the impact is magnified when a user is unable to use a pointer device. In many of the cases we worked on this week, we found a common theme.  An example,

1. User tabs to Menu item 1
2. Pressing tab again takes user to menu item 2
3. Pressing tab again takes user to the fifth menu item
4. User is unable to get to menu items 3 or 4 with any combination of keys

We hope calling out some of these items helps other professionals improve their sites in order to make them accessible to everyone. Please feel free to reach out to us if you have any questions. We’re always happy to help answer questions at no charge.
 
#ADA #Compliance #usability #disabled #Website #TitleIII #Section508 #WCAG2