WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Filter Component Accessibility

for

From: Patrick H. Lauke
Date: Aug 25, 2020 2:32AM

On 25/08/2020 08:41, Kalpeshkumar Jain via WebAIM-Forum wrote:
> Hi All,
>
> We have a Filters (checkboxes) section in the search result page.
> When the User toggles any of the filters the result section is updated.
> This change is dynamic and I believe it violates SC 3.2.2.

That's not necessarily the case, though opinions vary on this. Arguably,
having results dynamically change to reflect what the user just checked
is not, in my view, a change of "content that changes the meaning of the
Web page" https://www.w3.org/TR/WCAG22/#dfn-change-of-context

There have been similar discussions around 4.1.3, and whether or not it
applies in situations like this. The general consensus at the time was
that IF the newly displayed/filtered list of results has some text that
visibly says "Showing 1 - 20 of 80 results" or similar, then *that*
could be seen as a status, and should be dynamically announced when it
changes. This would then help AT users understand that ticking those
filter boxes had some kind of effect.

But otherwise, this is a scenario that falls between SCs, I'd say. It's
not a clear-cut failure.

> I checked various eCommerce sites and observed the same behaviour.
>
> In my opinion an 'Apply Filter' button should be provided so that there is
> no dynamic change and the User is in control of the interaction.
>
> I would like to know your opinion on this and also whether my suggestion
> makes sense.

If possible, by all means suggest an "Apply Filter" button. Otherwise,
another option would be to at least have a status (which could even be
visually hidden, but just announced by AT) that informs the user that
something has happened/changed (e.g. "Filter applied" or "Results
filtered" or similar). That then at least helps AT users.

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke
https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke