# Failure of Success Criterion 4.1.2 due to a user interface control not having a programmatically determined name

ID: F68

Technology: failures

Type: Failure

## When to Use

HTML controls

## Description

This failure describes a problem that occurs when a form control does not have a name exposed to assistive technologies. The result is that some users will not be able to identify the purpose of the form control. The name can be provided in multiple ways, including the `label` element. Other options include use of the `title` attribute and `aria-label` which are used to directly provide text that is used for the accessibility name or `aria-labelledby` which indicates an association with other text on a page that is providing the name. Button controls can have a name assigned in other ways, as indicated below, but in certain situations may require use of `label`, `title`, `aria-label`, or `aria-labelledby`.

Elements that can use an explicitly-associated `label` element are:

- `input`
- `textarea`
- `select`

The `label` element is not used for the following because labels for these elements are provided via the `value` attribute (for Submit and Reset buttons), the `alt` attribute (for image buttons), or element content itself (`button`):

- Submit and Reset buttons (`<input type="submit">` or `<input type="reset">`)
- Image buttons (`<input type="image">`)
- Hidden input fields (`<input type="hidden">`)
- Buttons (button elements or `<input type="button">`)

## Examples

###

The following example demonstrates a form that visually presents labels for form controls, but does not use the `label` element to associate them with their controls. The code example below is a failure because assistive technology may not be able to determine which label goes with which control.

    <form>
      First name:
      <input type="text" name="firstname">
      <br>
      Last name:
      <input type="text" name="lastname">
      <br>
      I have a dog <input type="checkbox" name="pet" value="dog">
      I have a cat <input type="checkbox" name="pet" value="cat">
    </form>

###

In the following code example, `label` elements are present, but they are not programmatically linked to the corresponding input controls and may therefore not be properly determined by assistive technology.

    <form>
      <p>
        <label>First Name</label>
        <input type="text" name="firstname">
        <label>Last Name</label>
        <input type="text" name="lastname">
      </p>
    </form>

###

The search text box in the following code example does not have a programmatically determinable name. The name can be supplied with any of the approaches mentioned above.

    <input type="text" value="Type your search here">
    <input type="submit" value="Search">

## Tests

### Procedure

For all `input`, `textarea`, and `select` elements in the Web page (except inputs of type `hidden`, `submit`, `reset`, or `button`:

1. Check that each element has a programmatically determined name using one of the following ways:

   1. the text label or labels are programmatically associated with the control element via the `aria-labelledby` attribute (each id given as a value in the `aria-labelledby` attribute matches the `id` of the text label element).
   2. the control is programmatically determined through the value of its `aria-label` attribute.
   3. the text label is contained in a `label` element that is correctly associated to the respective `input` element via the label's `for` attribute (the `id` given as value in the `for` attribute matches the `id` of the input element).
   4. the control is contained within a `label` element that also contains the label text.
   5. the control is an `input` of `type` `image` and the `alt` attribute provides a text label.
   6. the control is programmatically determined through the value of `title` attribute.

### Expected Results

- If all options of check #1 are false, then this failure condition applies and the content fails the Success Criteria.

## Related Techniques

- H44
- H65
- G167
- ARIA6
- ARIA9
- ARIA16
- ARIA14

## Resources

- Accessible Rich Internet Applications (WAI-ARIA), Accessible Name Calculation