WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: accessible example of double list box/picker

for

From: Bryan Garaventa
Date: Jul 21, 2017 11:26AM

Hi,
You can certainly extend the labelling if you want more explicit identifications of such fields. You can see how this is currently implemented in the GitHub archive at
https://github.com/accdc/tsg
Within the folder "Coding Arena/ARIA Listboxes"

If you are going to have multiple instances of different redistributable listboxes like this on the same page, I recommend surrounding each of them with a landmark or region that includes an explicit label that identifies the difference between each.

E.G

<div role="region" aria-label="Unique Name Here">
*** Associated Listbox widgets here. ***
</div>

This way, the beginning and ending boundaries will be conveyed between each section, the user can quickly navigate to the desired section or past an undesired one, and the purpose of the section is clear.



Bryan Garaventa
Accessibility Fellow
Level Access, Inc.
<EMAIL REMOVED>
415.624.2709 (o)
www.LevelAccess.com