WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible Filtered Search

for

From: Birkir R. Gunnarsson
Date: Mar 10, 2015 6:28AM

You are looking for comboboxes.
)you can Google the phrases "ARIA roles combobox" (minus the quotes)
and also "aria authoring practices combobox" to see the definitions,
relevant roles and recommendations .. I have not had coffee yet so I
am too lazy to copy and paste the links, but this would be the first
match on Google).

Since he has not responded yet himself, I would like to point out
master Bryan Garaventa's extensive work on accessible comboboxes and
online demos for different implementations
"
1 Form with overlays:
http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20and%20Readonly)/demo.htm
(Where the State field opens an autosuggest list when you start
typing, and the Country field has an arrow toggle to pull down the
attached list)

2 Simple with overlay:
http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20with%20Substring%20Match)/demo.htm
(Where the edit field matches substrings to populate automatic suggestions.)

3 Simple with static inline rendering:
http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Native%20Inputs,%20Editable%20with%20Word%20Match)/demo.htm
(Where the typing of full words like 'modem' or 'printer' will
automatically match list items; using an inline display instead of a
layer)

4 Simulated with toggleable overlay:
http://whatsock.com/tsg/Coding%20Arena/ARIA%20Comboboxes/ARIA%20Comboboxes%20(Simulated,%20Readonly)/demo.htm
(Where the simulated button opens a language dropdown when clicked or
tapped, which can then be scrolled through)
"
hth



On 3/10/15, Graham Armfield < <EMAIL REMOVED> > wrote:
> Hi All,
>
> I'm looking for good examples of accessible search capability that can
> provide dynamic filtering based upon the characters the user has typed in.
> I'm thinking of functionality similar to Google search, where a list of
> possible options appears beneath the text box.
>
> Are there any resources out there to show the best practices, etc.
>
> Thanks
> Graham Armfield
>
>
>
> coolfields.co.uk <http://www.coolfields.co.uk/>;
> M:07905 590026
> T: 01483 856613
> @coolfields <https://twitter.com/coolfields>
> > > >


--
Work hard. Have fun. Make history.