WebAIM - Web Accessibility In Mind

E-mail List Archives

obligated autocomplete functionality

for

From: Gijs Veyfeyken
Date: Apr 3, 2014 3:20AM

Hi,

Input fields with autocomplete functionality are not an accessibility issue as long as the user is not obligated to select one of the suggestions provided through an autocomplete list. Like Google's search field for example or your browser's URL field.

I'm currently testing an interface where the user MUST chose an option in the suggestions list in order to submit the form.
So I'm looking for accessible autocomplete examples.

The default jQuery UI example looks promising.
https://jqueryui.com/autocomplete/#default

* Keyboard accessibility is not a problem.
* There's hidden text for screenreaders that announce the number of suggestions and how to navigate them (arrow keys).
* It works well with Jaws 14 in IE10.
* NVDA 2014.1 in Firefox 28 does the job, although sometimes the suggestions are not read out loud properly while using the arrow keys.
* VoiceOver 6.0 in Safari 7.0.2 struggles to read the list correctly while using the arrow keys. Only one letter or part of the suggestion is read out loud.

These are latest and greatest. I'm guessing the results with older versions will be (much) worse.

The "design pattern" for autocomplete is described in WAI-ARIA 1.0 Authoring Practices:
http://www.w3.org/TR/2010/WD-wai-aria-practices-20100916/#autocomplete

It also mentions:
"The widget has a role of combobox, and its parent role is input. It has a child with role textbox. The propertyaria-autocomplete indicates whether user input completion suggestions are provided."

That's definitely not the case for jQuery UI, it only uses role="presentation" on the list items.

Can anyone point me to other live examples enhanced with ARIA?

Thanks,

Gijs

---
Gijs Veyfeyken
AnySurfer - towards an accessible internet
A project of Blindenzorg Licht en Liefde vzw
Kunstlaan 24 box 21
1000 Brussels
Belgium