WebAIM - Web Accessibility In Mind

E-mail List Archives

Accessible autocomplete / typeahead pattern

for

From: Adam.Lund@thomsonreuters.com
Date: Feb 28, 2017 12:09PM

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ËVh5BKMXLQCWX-1gMc
>lr8NYXAq_Fm1HiCKHyZcD0l0&s=QBD_PYcwWEEaTKFI331F8vzXuaq1Y90EgVucQJTAKc8&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>