A: Input buttons must have discernible text (WCAG 4.1.2)

• Meaning
• Impact
• Recommendation
• Examples

Ensure that input buttons contain perceivable text.

This means

<input type="button">, type="submit", type="reset" and type="image" require an accessible name. Without value, aria-label or aria-labelledby screen readers only hear "button." For type="image" only alt provides the name. Background images or placeholders are not a name.

Impact

Without a clear name, users do not know what the button triggers. Actions are aborted and a WCAG violation may occur.

Recommendation

• Set a clear value on <input>, e.g. value="Send order".

• Alternatively, use aria-label or aria-labelledby.

• Always provide an alt for type="image".

• Do not rely on title, placeholder, or icons alone.

• Use <button> with visible text where possible.

Example

Problematic

<input type="submit">
<input type="button" value="">
<input type="image" src="search.png" alt="">

Better

<input type="submit" value="Send order">
<input type="button" value="Open dialog">
<input type="image" src="search.png" alt="Start search">
 
<!-- Alternative with button -->
<button type="submit">Send order</button>

Related WCAG criterion:
WCAG 4.1.2 - Name, Role, Value