WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Which control for deselectable, mutually exclusive options?

for

From: Isabel Holdsworth
Date: Jan 18, 2019 8:05AM


Thanks guys.
I like the idea of a group of radiobuttons with a "Clear selection" button.
Standard buttons aren't generally considered mutually exclusive, and
I'm concerned that some users might not read all of the bumph before
the buttons and might think that pressing a second button means
they've made two selections.
Cheers, Isabel

On 18/01/2019, Mark Magennis < <EMAIL REMOVED> > wrote:
> Hi Isabel,
>
> You could make each one a toggle button using <button>. But don't use
> aria-pressed if any of your users are using IE11 (which still includes most
> JAWS users) because IE doesn't support aria-pressed correctly. This is a
> pity because aria-pressed has the semantics to allow AT to report the
> current state and any change in state, but that doesn't happen in IE (with
> either JAWS or NVDA).
>
> You can easily create a toggle button without aria-pressed by changing the
> button's name when its state changes to indicate the new action, e.g. from
> "select French" to "unslect French". Make sure the button name is an action,
> not the state, because button names are always actions. Provide feedback to
> screen reader users using aria-live, e.g. "French is selected" or "You
> selected French". The button would need to have the additional action of
> changing the status of the currently 'selected' button in the group (if
> there is one) to 'unselected'. You'll need to inform users up front that the
> group only allows one selection so that they know this will happen. If you
> still feel it may not be clear, consider adding information about the
> additional action to the screen reader feedback, e.g. "French selected and
> German unselected".
>
> And don't make them look like standard radio buttons because otherwise users
> will think they are standard radio buttons.
>
> Mark
>
> Mark Magennis
> Skillsoft | mobile: +353 87 60 60 162
> Accessibility Specialist
>
>