Skip to content

Commit 2456ada

Browse files
authored
Add accessibility section to autocomplete attribute page (mdn#43431)
* docs(HTML): add accessibility section to autocomplete attribute Add accessibility considerations documenting how autocomplete values help users with disabilities and satisfy WCAG 2.2 SC 1.3.5 (Identify Input Purpose, Level AA). Fixes mdn#37170 Continues the work from mdn#39088 * address pepelsbey review feedback Add autocomplete="off" anti-pattern and invalid values subsection to the accessibility section, as mentioned in issue mdn#37170. * fix: split combined accessibility subsection into two separate headers Separate "Avoid autocomplete='off' and invalid values" into two distinct subsections per reviewer feedback: "Avoid disabling autocomplete" and "Avoid invalid autocomplete values".
1 parent 03d0f9c commit 2456ada

File tree

1 file changed

+14
-0
lines changed
  • files/en-us/web/html/reference/attributes/autocomplete

1 file changed

+14
-0
lines changed

files/en-us/web/html/reference/attributes/autocomplete/index.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -251,6 +251,20 @@ With {{htmlelement("input")}} and {{htmlelement("textarea")}}, the `webauthn` to
251251
- `webauthn`
252252
- : Passkeys generated by the [Web Authentication API](/en-US/docs/Web/API/Web_Authentication_API), as requested by a conditional {{domxref("CredentialsContainer.get()", "navigator.credentials.get()")}} call (i.e., one that includes `mediation: 'conditional'`). If included, this is the last token in the space-separated token list. See [Sign in with a passkey through form autofill](https://web.dev/articles/passkey-form-autofill) for more details.
253253

254+
## Accessibility
255+
256+
Using appropriate `autocomplete` values helps users with cognitive disabilities, motor impairments, and other conditions fill out forms more quickly and accurately by reducing the need to type and remember information. When the browser can identify the purpose of a form field through its `autocomplete` value, it can offer stored data such as names, addresses, and payment details, which benefits all users but is especially important for those who find manual data entry difficult.
257+
258+
Providing valid autocomplete tokens also satisfies [WCAG 2.2 Success Criterion 1.3.5: Identify Input Purpose](https://www.w3.org/WAI/WCAG22/Understanding/identify-input-purpose) (Level AA), which requires that the purpose of input fields collecting user information can be programmatically determined. This enables user agents and assistive technologies to apply personalized presentations, such as displaying familiar icons next to fields, to help users understand and complete forms.
259+
260+
### Avoid disabling autocomplete
261+
262+
Setting `autocomplete="off"` prevents the browser from offering stored data for a field. While developers sometimes use this to prevent autofill for security reasons (such as one-time codes), it removes a feature that many users depend on. Users with cognitive disabilities may rely on autocomplete to recall personal information, and users with motor impairments benefit from reduced typing. Browsers may also ignore `autocomplete="off"` on login fields to support password managers.
263+
264+
### Avoid invalid autocomplete values
265+
266+
Using invalid or non-standard values (such as made-up strings to circumvent autofill) has a similar effect: the browser cannot match the field to any known purpose, so it cannot offer relevant suggestions. This also fails the WCAG requirement above, since the input purpose is no longer programmatically determinable. If you need to disable autofill for a specific field, consider using `autocomplete="off"` only where genuinely necessary (such as for CAPTCHA or one-time token fields) rather than applying it broadly across a form.
267+
254268
## Examples
255269

256270
```html

0 commit comments

Comments
 (0)