WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible autocomplete / typeahead pattern

for

From:
Date: Mar 1, 2017 2:51PM


There's also the jQuery UI autocomplete widget:
http://jqueryui.com/autocomplete/

On Wed, Mar 1, 2017 at 4:36 PM, Shane Anderson < <EMAIL REMOVED> >
wrote:

> Southwest Airlines has one that works relatively well.
>
> https://www.southwest.com/flight/
>
> Regards
> Shane Anderson
>
>
> On Tue, Feb 28, 2017 at 2:09 PM, < <EMAIL REMOVED> > wrote:
>
> > Hello everyone, I have been searching for an accessible control that
> > behaves similarly to Twitter's typeahead or the select2 menu. Whereas a
> > user can select from a list of options or begin typing, which filters the
> > list of items based on the input. Select2 claims to be accessible so I
> > tested select2 with VoiceOver and JAWS 18, but the screen reader does not
> > report search results in real time, nor allow the user to navigate the
> > menu items.
> >
> > I've searched the greater Web and WebAIM archives, and have not found an
> > example of an accessible autocomplete control.
> >
> > Have you encountered any in the wild?
> >
> > Sincerely,
> > Adam
> >
> > . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
> > . .
> > Adam Lund
> > Accessibility Technologist
> >
> > Thomson Reuters
> > the answer company
> >
> > Phone: 651-687-4045
> > Mobile: 612-867-6185
> >
> > <EMAIL REMOVED>
> >
> > . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
> > . .
> >
> >
> >
> > On 2/28/17, 12:36 PM, "WebAIM-Forum on behalf of Angela French"
> > < <EMAIL REMOVED> on behalf of <EMAIL REMOVED> >
> > wrote:
> >
> > >
> > >This
> > >page<https://urldefense.proofpoint.com/v2/url?u=http-
> > 3A__www.sbctc.edu_for
> > >-2Demployers_default.aspx&d=CwIGaQ&c=4ZIZThykDLcoWk-
> > GVjSLm9hvvvzvGv0FLoWSR
> > >uCSs5Q&r=7shRp1gT1Lo1Xh4DghwcV2BuS_kAFTDSg7mIZ78wg-E&m> > CbVh5BKMXLQCWX-1gMc
> > >lr8NYXAq_Fm1HiCKHyZcD0l0&s=QBD_PYcwWEEaTKFI331F8vzXuaq1Y90EgV
> ucQJTAKc8&e> > >> is a landing page. In its main content area it contains a paragraph
> of
> > >>introductory text then three pictures with links to new pages. The
> > >>three picture-links are "Economic Development", "Employer Grants and
> > >>Loans" and "Centers of Excellence". The picture and the text are in
> > >>separate divs and these are wrapped in the anchor tag so that both the
> > >>picture and the text becomes clickable.
> > >
> > >When I listed with NVDA the alt text for the three pictures sounds
> > >cumbersome . Since the picture is just basically "eye candy" for the
> > >navigational link, I'm inclined to provide a null alt attribute.
> > >
> > >I would appreciate your opinion.
> > >
> > >
> > >
> > >Angela French
> > >Internet/Intranet Specialist
> > >Washington State Board for Community and Technical Colleges
> > >360-704-4316
> > > <EMAIL REMOVED> <mailto: <EMAIL REMOVED> >
> > >www.sbctc.edu<https://urldefense.proofpoint.com/v2/
> > url?u=http-3A__www.sbct
> > >c.edu_&d=CwIGaQ&c=4ZIZThykDLcoWk-GVjSLm9hvvvzvGv0FLoWSRuCSs5Q&
> > r=7shRp1gT1L
> > >o1Xh4DghwcV2BuS_kAFTDSg7mIZ78wg-E&mËVh5BKMXLQCWX-1gMclr8NYXAq_
> > Fm1HiCKHyZ
> > >cD0l0&s=frtZOEMcPYR9hdPQvzxLAEzYRP_OTFjzGskD37AyTnA&e= >
> > >
> > >> > >> > >https://urldefense.proofpoint.com/v2/url?u=http-
> > 3A__list.webaim.org_&d=CwI
> > >GaQ&c=4ZIZThykDLcoWk-GVjSLm9hvvvzvGv0FLoWSRuCSs5Q&
> > r=7shRp1gT1Lo1Xh4DghwcV2
> > >BuS_kAFTDSg7mIZ78wg-E&mËVh5BKMXLQCWX-1gMclr8NYXAq_
> > Fm1HiCKHyZcD0l0&s=MfBQ
> > >GQF87hSUx_taqpmCX_SrUL5bjC7Y0YdrzM6Bxyo&e> > >List archives at
> > >https://urldefense.proofpoint.com/v2/url?u=http-
> > 3A__webaim.org_discussion_
> > >archives&d=CwIGaQ&c=4ZIZThykDLcoWk-GVjSLm9hvvvzvGv0FLoWSRuCSs5Q&
> > r=7shRp1gT
> > >1Lo1Xh4DghwcV2BuS_kAFTDSg7mIZ78wg-E&mËVh5BKMXLQCWX-1gMclr8NYXAq_
> > Fm1HiCKH
> > >yZcD0l0&s=T25_UIy7ROUedmC9wkxdAOX5lE-6mNAwjHJQSAKJzKM&e> > >> >
> > > > > > > > > >
> > > > >