What does this accessibility issue mean?
Accessibility issue summary: input button is missing discernible text
Input buttons on your website (for example, button types whose purpose is ‘submit’ or ‘reset’) should have an accessible name attribute or accessible text that describes their purpose.
If input buttons do not have a name or accessible text, it can cause confusion for users who rely on assistive technology like screen readers, as it may not be clear what the button’s purpose is.
Input buttons without accessible names violate WCAG Level A rules. This accessibility issue is related to WCAG Level A rules around Name, Role, Value.
Solution:
Ensure input buttons have discernible text.
Example HTML violation: Indiscernible input button text (WCAG Level A Issue)
<input type="button" />
The above HTML violates the input-button-name accessibility rule because the input
button does not have an accessible name. An accessible name for input
tags can be provided using various methods such as the value
attribute, title
attribute, or ARIA attributes like aria-label
or aria-labelledby
.
How to fix "Indiscernible input button text (WCAG Level A Issue)" issue
<input type="button" value="Submit" />
Remember, accessible interfaces allow users with disabilities such as vision impairments to interact with your web application. In the case of the "input
buttons", accessibility rules recommend that each button has a non-empty accessible name. Assistive technologies can then refer to the object by name, not just by type. When an input button doesn’t have an accessible name, people who use assistive technologies have no way of knowing its specific purpose.
You can learn more about these accessible name rules from the W3C Web Accessibility Initiative or from Accessibility Insights.