• Success Criterion 1.3.5
  • Conformance level AA

Combined Field Whose Autocomplete Token Fits Only One Use Case

1.3.5 — Identify Input Purpose

Scenario

Setting

A budget airline's flight search results

What’s wrong

A multi-purpose field (e.g., "email or mobile number") tagged with a single token matching only one, or neither — of its accepted purposes.

Example

<div class="member-fares-banner">
  <p>Sign in to see member fares</p>
  <label for="identifier">Email or mobile number</label>
  <input id="identifier" name="identifier" type="text" autocomplete="email">
</div>

Why it matters

Scanning flight search results, a traveler taps the "Sign in to see member fares" banner and, since they normally sign in with their phone number, gets only email autofill suggestions and never sees their saved phone number offered.

How to test

Inspect a combined field (e.g., 'email or mobile number'): check whether its single autocomplete token can represent both accepted input types — if it only matches one, it fails.

How to fix

For a field that genuinely accepts more than one input purpose, use a token like "username" that does not limit autofill to just one of them, or split the sign-in banner into two separate fields.

<div class="member-fares-banner">
  <p>Sign in to see member fares</p>
  <label for="identifier">Email or mobile number</label>
  <input id="identifier" name="identifier" type="text" autocomplete="username">
</div>

Outcome

From the search results banner, a traveler now gets autofill suggestions regardless of whether they sign in with email or phone.

Who is affected

Users who prefer signing in by phone number from the search-results banner, and anyone relying on autofill for either option, only get suggestions for the token that was chosen.

Learn more