Forms
Accessible numeric inputs: Examples and Testing
Published by whatisADA / Grow Wild Agency · Updated
What to build
Use numeric controls when the value is a quantity, and explain units, bounds and valid increments. Keep identifiers such as postal codes or account numbers in text inputs when arithmetic does not describe their purpose.
A practical example
A budget worksheet asks for the number of templates. Label the field with that unit, reject negative or nonfinite values and update the total from the validated quantity.
Try the example
Use Tab and your keyboard controls, then compare the behavior with the checks below. This is an isolated learning example; test the complete pattern in your own product and assistive technology setup.
Enter a whole number from 1 to 12.
How to check it
- Enter boundary values, a decimal where disallowed, a negative value and an empty value.
- Check that the control exposes its name and any valid range while errors explain how to correct the input.
- Verify that totals do not silently use a stale value behind invalid visible text.
What can be missed
type="number" alone does not validate your calculation or server input. Decide deliberately whether zero, blank and unknown represent different states.
Markup and state contract
This concise markup illustrates names, relationships or state. Custom controls also need the keyboard interaction and state updates described in the checks and primary source; this snippet is not a complete component.
<label for="templates">Number of shared templates</label>
<input id="templates" name="templates" type="number" min="0" max="500" step="1" value="5">Record your test
Use this worksheet to record what you actually checked. Notes stay on this device when you choose Save; they are not sent to us. Avoid personal or confidential information on shared devices.
These are your observations, not automated results or a conformance certificate. A complete evaluation needs appropriate scope, supported technologies, all applicable criteria and relevant page states.
Primary sources and scope
This is independent implementation guidance with original examples. The linked standard contains the full definitions, exceptions and conformance requirements. A criterion or checklist alone does not establish legal applicability or whole-site conformance.