Address Entry Patterns

Autocomplete Tokens

Address inputs use native autocomplete tokens while noting that hints do not verify the address.

Program

Autocomplete tokens help browsers understand field intent. They are hints for entry, not proof that an address is valid.

address_autocomplete_tokens.html
Visuals: captured from real browser rendering
<form class="address-tokens" aria-describedby="token-note">
  <label>Street <input name="street" autocomplete="street-address" value="123 Web Lane"></label>
  <label>City <input name="city" autocomplete="address-level2" value="Chicago"></label>
  <label>State <input name="state" autocomplete="address-level1" value="IL"></label>
  <label>Postal code <input name="postal" autocomplete="postal-code" value="60607"></label>
  <p id="token-note">Autocomplete hints do not verify this address.</p>
</form>
<style>
  .address-tokens { display: grid; gap: 8px; max-width: 34rem; border: 1px solid #94a3b8; padding: 12px; }
  .address-tokens label { display: grid; gap: 4px; }
  #token-note { margin: 0; color: #475569; }
</style>

  1. Connect the note to the form.

    The form points to the note explaining the hint behavior.
    The form points to the note explaining the hint behavior.

  2. Add the street-address token.

    The street input uses the native street-address token.
    The street input uses the native street-address token.

  3. Add the city token.

    The city input uses address-level2.
    The city input uses address-level2.

  4. Add the state token.

    The state input uses address-level1.
    The state input uses address-level1.

  5. Add the postal-code token.

    The postal code input uses postal-code.
    The postal code input uses postal-code.

  6. Check address hints.

    The note says autocomplete hints do not verify the pinned address.
    The note says autocomplete hints do not verify the pinned address.
autocomplete tokens Tokens tell the browser what kind of address data each field expects.
pinned values The address values remain exact lesson data.
not verification Autocomplete hints do not validate the address.