Known input field type missing autocomplete attribute

What is the problem?

Filling out forms on the web can be extremely time consuming. If the form lacks autocomplete attributes, then users with mobility disabilities may have difficulty typing each word manually.

In this example, we have three input fields inside of a form. Because the form fields have not specified the associated autocomplete attribute, the Chrome browser is trying to guess the intent of the form field, and is getting it wrong.

Transcript:

  1. User navigates to Company Name field and uses autocomplete address value
  2. City field has value of Doe
  3. State field has value of john.doe@acme.org
  4. Inspect DOM element for City field
  5. Note that no autocomplete value specified for input field

Add autocomplete value to input field

The autocomplete attribute allows the browser to do a pattern match against a list of values locally stored with the browser, and supplies the appropriate corresponding value when the input is programmatically tagged. This is a user setting that can be turned on or off, or modified by the end user. This reduces typing and reliance on memory because it uses stored values to fill in the fields. H98: Using HTML 5.2 autocomplete attributes

Transcript:

  1. User navigates to Company Name field and uses autocomplete address value
  2. City field has value of Brooklyn
  3. State field has value of NY
  4. Inspect DOM element for City field
  5. Note that City field has autocomplete="address-level2"
  6. Note that State field has autocomplete="address-level1"

[caption id=”attachment_7486” align=”alignnone” width=”1024”] Autocomplete settings displayed in Google Chrome[/caption]

Transcript:

  1. User opens Google Chrome Save and fill addresses

This example demonstrates that when the autocomplete values have been set correctly, a user can save a significant number of keystrokes. The letter t is typed into the first input field, and then an autocomplete list is displayed. When the autocomplete list is selected, the form fields that have relevant autocomplete values set are automatically completed.