logo Accessibility Academy
PrinciplesBrowse ExercisesBrowse CoursesSettings

Exercise 4.2 - Name, Role, Value

The following website contains an input that does not have an accessibility name. A screen reader would not be able to provide useful information on what the input is for.

Note: Exercise 1.3 also violates this criterion because there was script usage to make generic html elements function like user interface controls without providing a role. For a better understanding of this criterion, make sure to also complete that exercise!

Requirements

Pending requirement:

The input must have the proper accessibility name "search". Do not get confused with the name attribute. The only techniques that set the accessible name are the following:

  • Having a <label> reference the input with the for attribute
  • Having an aria-label or aria-labelledby on the input
  • Having a placeholder
  • Having a <label> as a parent of the input

Need help?

Show me the solution

Learning Material

logo Accessibility Academy
PrinciplesBrowse ExercisesBrowse CoursesSettings

Exercise 4.2 - Name, Role, Value

The following website contains an input that does not have an accessibility name. A screen reader would not be able to provide useful information on what the input is for.

Note: Exercise 1.3 also violates this criterion because there was script usage to make generic html elements function like user interface controls without providing a role. For a better understanding of this criterion, make sure to also complete that exercise!

Requirements

Pending requirement:

The input must have the proper accessibility name "search". Do not get confused with the name attribute. The only techniques that set the accessible name are the following:

  • Having a <label> reference the input with the for attribute
  • Having an aria-label or aria-labelledby on the input
  • Having a placeholder
  • Having a <label> as a parent of the input

Need help?

Show me the solution

Learning Material

Editor

Preview Page