Some interfaces include forms that consist solely of a select box, like a sorting component. And they are made to submit when the user selects an option
This approach omits the button to declutter the interface and save users a click. But it does so at the cost of usability and accessibility.
Minimal interfaces aren't necessarily simple interfaces. Counting clicks to infer usability isn't particularly useful either.
But here I'll explain how submitting a form when an option is selected causes issues for keyboard and screen reader users.
How keyboard users are affected
onchange is triggered by selecting a new option.
But some browsers wrongly fire the
onchange event when the user presses the Down key.
So as a user moves from the first to the second option, the form will be submitted before the user has a chance to move to the third option and beyond.
This happens in a number of Windows browsers like Chrome, Opera and Internet Explorer 9 and under.
How screen reader users are affected
Screen reader users can struggle too because the act of reading an option selects the option too.
This again causes the form to be submitted prematurely.
Apart from this, navigating users automatically when interacting with a form control is disorientating and unfamiliar—users don't expect this to happen.
What to do about it
Links are for navigation, forms are for input.
Using a select box for navigation is materially dishonest and fails Web Content Accessibility Guidelines Success Criteria 3.2.2:
Avoid the issues by including a button or by exploring ways to avoid the problem altogether.
Submitting the form when a select box option is selected might declutter an interface and reduce clicks, but it can cause significant problems for some people.
Inclusive design is about making things work for everyone no matter what. Taking control away from the user is a good way to cause problems for them.
Reducing clicks and decluttering an interface may be the result of a well-designed experience, but they're not objectives in and of themselves.
Just give users a button. This gives users a clear separation between input and submission which works well for everyone no matter which browser they use.
Sign up to Good Design
I’ll email you once a month on nailing the basics, avoiding complexity and making things that work for everyone.