WebAIM - Web Accessibility In Mind

E-mail List Archives

Improving the Accessibility of My Projects

for

From: Bryan Hadaway
Date: Jan 8, 2020 9:35AM

Hi Everyone,

I'm new to accessibility, at least in terms of the really important stuff,
not just the trendy stuff from a decade ago, when everyone was adding
language switchers and font-size changers to their sites.

Here's the project I'm primarily focused on making accessibility-ready at
the moment:

https://wp-themes.com/generic/

Everything I learn from this will then cascade down into all my other
projects.

If anyone would be gracious enough to help me by testing it out and giving
me some pointers on things that I should improve, especially from those who
browse the web from a keyboard 24/7, I would be very grateful.

I'm open to any/all suggestions, but one particular dilemma I'm currently
faced with is the tabbing/focusing order of the menu and search form.

Aesthetically, both on desktop and mobile, it's the way I want it. I want
the search form on the right on desktop, and I want the search form above
the menu on mobile.

Functionally, I want people to be able to tab to search *before* the menu,
and herein lies the problem.

Everything looks and functions the way I want it to, but from a keyboard
perspective, one would expect tabbing to follow the normal visual order of
elements on the page, otherwise it might be a little jarring/confusing.

However, web design is about compromise because there are many, many, MANY
variables that have to be taken into account and it's impossible to make it
perfect for every scenario.

My assumption would be that keyboard users would rather reach the search
form before the menu, even if done in a different way, as opposed to having
to tab through the entire menu (of which some people add dozens of links)
before getting to search.

So, of the following scenarios, what do you think is the most pleasing and
easy for actual keyboard users:

A. Exactly the way I have it now.

B. I should just change the tabbing order to menu first, then search.

C. I should just change the tabbing order to menu first, then search, but
also add a "Skip to search" link before the menu.

D. Some other creative solution?

Thank you!