The input-button-name rule flags <input type="submit">, type="reset" and type="button" elements that have no accessible name, so a screen reader announces just "button". For these elements the name comes from the value attribute. The fix is a value that says what the button does – "Search", "Send message", "Reset filters".
What the rule means
An <input> button cannot hold content: its text is its value. The rule passes an input button that gets its name from:
- a
valuewith text in it, aria-labeloraria-labelledby,- a
titleattribute or a connected<label>, - or – for
submitandresetonly – novalueattribute at all, because the browser then shows its own default text, such as "Submit" or "Reset".
It fails type="button" without a value, which is always blank, and any input button whose value is empty or only spaces. value="" on a submit button is the trap: it switches off the browser's default text and leaves nothing in its place. Image buttons (type="image") are checked by undefined.
A submit button with no value passes, but the default text is the browser's – often in the browser's language rather than the page's – and "Submit" says little on a form that does something specific. Whether a name says what the button does is a judgement, which is why the fact box above says "partly".
Who is affected
Blind people using a screen reader hear "button" at the end of a form and have to guess whether it sends, searches or resets – and resetting a long form by mistake loses everything typed. Voice-control users cannot say "click Search" when the button has no name. People using a braille display see only the role.
Why the check fails
- Search forms with an icon drawn as a CSS background on
<input type="submit" value="">, so the box looks labelled and is not. type="button"inputs used for JavaScript actions – "load more", "apply filter" – with the label added by script, or never.- Empty
valuefrom a template variable that the CMS or theme left unset for one language. - Older form plugins and shop systems that still output input buttons with a style class and no value.
- Reset buttons added by a form builder with its default settings.
How to fix it
- Give every input button a
valuethat names the action. - For an icon-only submit button, keep a real
valueand let CSS draw the icon – or switch to a<button>, which can hold an SVG and visually hidden text. - Think twice about reset buttons: they are easy to press by mistake and are rarely needed.
- Fix it in the form template, so every form that uses it is fixed at once.
<!-- Before: an empty value and a button input without one -->
<form class="site-search" action="/search/">
<label for="q">Search the shop</label>
<input id="q" type="search" name="q">
<input class="site-search__submit" type="submit" value="">
</form>
<input class="filters__reset" type="button"><!-- After: each value says what the button does -->
<form class="site-search" action="/search/">
<label for="q">Search the shop</label>
<input id="q" type="search" name="q">
<input class="site-search__submit" type="submit" value="Search">
</form>
<input class="filters__reset" type="button" value="Reset filters">If the design needs an icon with no visible text, a <button> is the easier element:
<button class="site-search__submit" type="submit">
<svg aria-hidden="true" width="20" height="20" viewBox="0 0 20 20"><circle cx="8" cy="8" r="6"/></svg>
<span class="visually-hidden">Search</span>
</button>How to test it manually
- Search the page source for
type="submit",type="reset"andtype="button"and check each one'svalue. - Select each button in your browser's accessibility inspector (Chrome, Edge, Firefox): the "Name" must not be empty.
- With a screen reader (NVDA on Windows, VoiceOver on macOS), Tab to the end of each form and listen: does the button say what will happen?
- Switch the browser to another language: a submit button without
valuenow shows its default text in that language, while the page stays in its own.
Related WCAG criterion
4.1.2 Name, Role, Value, Level A: every user interface component needs a name that assistive technology can read. Related: 2.5.3 Label in Name – an aria-label must contain the visible value text – and 2.4.6 Headings and Labels, Level AA – where there is a label, it should describe the purpose, and "Submit" rarely does.
How Reviseberg reports it
Reviseberg runs input-button-name on every crawled page at 1280px. The issue list shows the rule with its severity, WCAG criterion and level, the number of buttons and pages affected, and the points you get back by fixing it. The detail view gives the CSS selector, the HTML snippet and every page affected – a search form in the header shows up once per page, and one template fix clears all of them.
You can mark findings as "ignore", "can't fix" or "false positive" with a reason; every decision is logged. A clean result here never marks 4.1.2 as passed: whether each name says what the button does is a person's check.