E-mail List Archives

Search E-mail List Archives for

Number of posts in this thread: 5 (In chronological order)

From: Graham Armfield
Date: Tue, Mar 10 2015 4:11AM
Subject: Accessible Filtered Search
No previous message | Next message →

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>

From: Birkir R. Gunnarsson
Date: Tue, Mar 10 2015 6:28AM
Subject: Re: Accessible Filtered Search
← Previous message | Next message →

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 ADDRESS 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.

From: Sailesh Panchang
Date: Tue, Mar 10 2015 8:10AM
Subject: Re: Accessible Filtered Search
← Previous message | Next message →

Here is another one
http://jqueryui.com/autocomplete/#custom-data
Sailesh


On 3/10/15, Birkir R. Gunnarsson < = EMAIL ADDRESS REMOVED = > wrote:
> 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 ADDRESS 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.
> > > >

From: _mallory
Date: Tue, Mar 10 2015 1:20PM
Subject: Re: Accessible Filtered Search
← Previous message | Next message →

Another note to read:
https://www.marcozehe.de/2014/03/11/easy-aria-tip-7-use-listbox-and-option-roles-when-constructing-autocomplete-lists/

Though it sounds like a combobox could work similarly.
_mallory

On Tue, Mar 10, 2015 at 10:10:53AM -0400, Sailesh Panchang wrote:
> Here is another one
> http://jqueryui.com/autocomplete/#custom-data
> Sailesh

From: Larry C. Lyons
Date: Tue, Mar 10 2015 1:53PM
Subject: Re: Accessible Filtered Search
← Previous message | No next message

You may find this autocomplete useful. Its already been fully tested as
accessible and should have all the requisite ARIA roles and properties.

http://assets.cms.gov/resources/framework/3.3/Pages/#autocomplete

hth,
larry
--
Larry C. Lyons
Applications Architect
Valdez International

On 10 March 2015 at 14:00, < = EMAIL ADDRESS REMOVED = > wrote:

>
> ---------- Forwarded message ----------
> From: "Birkir R. Gunnarsson" < = EMAIL ADDRESS REMOVED = >
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Cc:
> Date: Tue, 10 Mar 2015 08:28:50 -0400
> Subject: Re: [WebAIM] Accessible Filtered Search
> 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
>

--
Larry C. Lyons
web: http://www.lyonsmorris.com/lyons
LinkedIn: http://www.linkedin.com/in/larryclyons