E-mail List Archives
Thread: Appropriate ARIA for keyword filter
Number of posts in this thread: 4 (In chronological order)
From: Chris Pearce
Date: Thu, Apr 24 2014 5:25PM
Subject: Appropriate ARIA for keyword filter
No previous message | Next message →
Hi,
I'm a front end developer seeking advice on what ARIA to use on the site I work on for my employer for a particular component, or even better any examples I can look at.
The component is a keyword filter used to filter the stores on the store list page: http://www.westfield.com.au/bondijunction/stores. I was looking at this: http://hanshillen.github.io/jqtest/#goto_autocomplete which we're using for our global search but I'm not entirely sure it's appropriate for this component?
The site is responsive with iOS being our biggest user base so VoiceOver support is important.
Thanks a lot
Chris
From: Larry C. Lyons
Date: Fri, Apr 25 2014 8:57AM
Subject: Re: Appropriate ARIA for keyword filter
← Previous message | Next message →
Hi,
I think I'm beginning to sound like a broken record here, but you may
want to check out what Assets.cms.gov has to offer. This autocomplete
demo we worked may fit your needs:
http://assets.cms.gov/resources/framework/2.0/Pages/autocomplete.html
hth,
larry
On Fri, Apr 25, 2014 at 11:03 AM, < = EMAIL ADDRESS REMOVED = > wrote:
> ---------- Forwarded message ----------
> From: Chris Pearce < = EMAIL ADDRESS REMOVED = >
> To: " = EMAIL ADDRESS REMOVED = " < = EMAIL ADDRESS REMOVED = >
> Cc:
> Date: Fri, 25 Apr 2014 09:25:08 +1000
> Subject: [WebAIM] Appropriate ARIA for keyword filter
> Hi,
>
> I'm a front end developer seeking advice on what ARIA to use on the site I work on for my employer for a particular component, or even better any examples I can look at.
>
> The component is a keyword filter used to filter the stores on the store list page: http://www.westfield.com.au/bondijunction/stores. I was looking at this: http://hanshillen.github.io/jqtest/#goto_autocomplete which we're using for our global search but I'm not entirely sure it's appropriate for this component?
>
> The site is responsive with iOS being our biggest user base so VoiceOver support is important.
>
> Thanks a lot
> Chris
>
>
--
Larry C. Lyons
web: http://www.lyonsmorris.com/lyons
LinkedIn: http://www.linkedin.com/in/larryclyons
From: Jesse Hausler
Date: Fri, Apr 25 2014 11:02AM
Subject: Re: Appropriate ARIA for keyword filter
← Previous message | Next message →
These are the semantics and aria we use for our autocomplete typeaheads.
Shown with two results to keep it short:
<input aria-activedescendant="foo" aria-expanded="true"
aria-haspopup="true" aria-autocomplete="list" role="combobox">
<div role="listbox">
<ul role="presentation">
<li role="presentation">
<a href="Javascript:void(0);" role="option" id="foo">
<mark>Hel</mark>lo World 1
</a>
</li>
<li role="presentation">
<a href="Javascript:void(0);" role="option" id="bar">
<mark>Hel</mark>lo World 2
</a>
</li>
</ul>
</div>
Good luck,
Jesse
On Fri, Apr 25, 2014 at 7:57 AM, Larry C. Lyons < = EMAIL ADDRESS REMOVED = >wrote:
> Hi,
>
> I think I'm beginning to sound like a broken record here, but you may
> want to check out what Assets.cms.gov has to offer. This autocomplete
> demo we worked may fit your needs:
>
> http://assets.cms.gov/resources/framework/2.0/Pages/autocomplete.html
>
> hth,
> larry
>
> On Fri, Apr 25, 2014 at 11:03 AM, < = EMAIL ADDRESS REMOVED = >
> wrote:
>
> > ---------- Forwarded message ----------
> > From: Chris Pearce < = EMAIL ADDRESS REMOVED = >
> > To: " = EMAIL ADDRESS REMOVED = " < = EMAIL ADDRESS REMOVED = >
> > Cc:
> > Date: Fri, 25 Apr 2014 09:25:08 +1000
> > Subject: [WebAIM] Appropriate ARIA for keyword filter
> > Hi,
> >
> > I'm a front end developer seeking advice on what ARIA to use on the site
> I work on for my employer for a particular component, or even better any
> examples I can look at.
> >
> > The component is a keyword filter used to filter the stores on the store
> list page: http://www.westfield.com.au/bondijunction/stores. I was
> looking at this: http://hanshillen.github.io/jqtest/#goto_autocompletewhich we're using for our global search but I'm not entirely sure it's
> appropriate for this component?
> >
> > The site is responsive with iOS being our biggest user base so VoiceOver
> support is important.
> >
> > Thanks a lot
> > Chris
> >
> >
>
> --
> Larry C. Lyons
> web: http://www.lyonsmorris.com/lyons
> LinkedIn: http://www.linkedin.com/in/larryclyons
> > > >
From: Chris Pearce
Date: Mon, Apr 28 2014 2:36PM
Subject: Re: Appropriate ARIA for keyword filter
← Previous message | No next message
Thanks guys.
Sent from my iPhone
> On 26 Apr 2014, at 3:02 am, Jesse Hausler < = EMAIL ADDRESS REMOVED = > wrote:
>
> These are the semantics and aria we use for our autocomplete typeaheads.
> Shown with two results to keep it short:
>
> <input aria-activedescendant="foo" aria-expanded="true"
>
> aria-haspopup="true" aria-autocomplete="list" role="combobox">
>
> <div role="listbox">
>
> <ul role="presentation">
>
> <li role="presentation">
>
> <a href="Javascript:void(0);" role="option" id="foo">
>
> <mark>Hel</mark>lo World 1
>
> </a>
>
> </li>
>
> <li role="presentation">
>
> <a href="Javascript:void(0);" role="option" id="bar">
>
> <mark>Hel</mark>lo World 2
>
> </a>
>
> </li>
>
> </ul>
>
> </div>
>
>
> Good luck,
>
> Jesse
>
>
> On Fri, Apr 25, 2014 at 7:57 AM, Larry C. Lyons < = EMAIL ADDRESS REMOVED = >wrote:
>
>> Hi,
>>
>> I think I'm beginning to sound like a broken record here, but you may
>> want to check out what Assets.cms.gov has to offer. This autocomplete
>> demo we worked may fit your needs:
>>
>> http://assets.cms.gov/resources/framework/2.0/Pages/autocomplete.html
>>
>> hth,
>> larry
>>
>> On Fri, Apr 25, 2014 at 11:03 AM, < = EMAIL ADDRESS REMOVED = >
>> wrote:
>>
>>> ---------- Forwarded message ----------
>>> From: Chris Pearce < = EMAIL ADDRESS REMOVED = >
>>> To: " = EMAIL ADDRESS REMOVED = " < = EMAIL ADDRESS REMOVED = >
>>> Cc:
>>> Date: Fri, 25 Apr 2014 09:25:08 +1000
>>> Subject: [WebAIM] Appropriate ARIA for keyword filter
>>> Hi,
>>>
>>> I'm a front end developer seeking advice on what ARIA to use on the site
>> I work on for my employer for a particular component, or even better any
>> examples I can look at.
>>>
>>> The component is a keyword filter used to filter the stores on the store
>> list page: http://www.westfield.com.au/bondijunction/stores. I was
>> looking at this: http://hanshillen.github.io/jqtest/#goto_autocompletewhich we're using for our global search but I'm not entirely sure it's
>> appropriate for this component?
>>>
>>> The site is responsive with iOS being our biggest user base so VoiceOver
>> support is important.
>>>
>>> Thanks a lot
>>> Chris
>>
>> --
>> Larry C. Lyons
>> web: http://www.lyonsmorris.com/lyons
>> LinkedIn: http://www.linkedin.com/in/larryclyons
>> >> >> > > >