DOFIW HTML ACCESSIBILITY TOOLS
Form Label Checker
Paste form HTML to find controls without meaningful names, placeholder-only fields, broken label references, duplicate IDs, and groups that need clearer instructions.
Paste or try a form sample
Paste a form fragment or a complete HTML document. Scripts in pasted code are parsed as inactive text and are not executed.
Review every control
Detected controls
- Run the checker to list form controls.
Findings and fixes
- No analysis yetINFO
Paste HTML or load an example, then select Check form labels.
Errors indicate controls that lack a usable accessible name or references that cannot work. Warnings identify patterns such as title-only names or missing group legends that need contextual review.
INPUTS AND OUTPUTS
What the tool checks
Input
HTML containing inputs, selects, textareas, buttons, labels, fieldsets, and common ARIA form roles.
Output
A control inventory, detected naming method, source lines, errors, review warnings, and a copyable text report.
The tool looks for explicit labels using for and id, wrapping labels, aria-labelledby, aria-label, and the native text or value used by buttons. It explains which method supplied each accessible name.
RECOMMENDED PATTERN
Use a persistent visible label
A placeholder can provide an example, but it disappears as the user types and must not replace the field label. When visible text labels a control, keep that wording in its accessible name.
RESULT EXPLANATIONS
Why each finding matters
No accessible name
A screen reader may announce only the control type, leaving the user unable to identify the expected input.
Placeholder only
Placeholder text is not a persistent label and often has weaker contrast. Add a real visible label while keeping the placeholder optional.
Broken reference
A for or aria-labelledby value points to an element that does not exist, so the intended relationship is not available.
Missing legend
Related radio buttons or checkboxes may need a fieldset and legend so users hear the question before the individual options.
USE CASES
Useful before a form goes live
- Review contact, sign-up, login, search, and checkout form markup.
- Check HTML exported by a form builder or WordPress plugin.
- Verify a design-system field component after refactoring.
- Find duplicate IDs introduced by repeating form sections.
- Create a clear issue report for developers and content editors.
LIMITATIONS
What pasted markup cannot prove
- External CSS is not applied, so the checker cannot reliably determine whether a label is visually hidden.
- JavaScript-generated controls and labels are not present unless you paste their final rendered HTML.
- The accessible-name calculation is a focused practical approximation, not a complete browser accessibility-tree implementation.
- The tool cannot judge whether a label is accurate, sufficiently specific, or translated correctly.
- Passing these checks does not establish complete WCAG or legal compliance.
PRIVACY
Your form code stays in your browser
All parsing and analysis happen locally in your browser. The pasted HTML and report are not uploaded, stored, or sent to an API. Clipboard access occurs only when you choose to copy the report.
FREQUENTLY ASKED QUESTIONS
Questions about accessible form names
Is a placeholder an acceptable label?
No. Use a persistent visible label for the field. A placeholder may supplement that label with a short example or formatting hint.
Can I use aria-label instead of a visible label?
It can provide an accessible name when visible text is impractical, but visible labels usually help more people. Prefer native label elements for standard form controls.
What is the difference between aria-label and aria-labelledby?
aria-label supplies a text string directly. aria-labelledby points to existing text elsewhere in the document and can combine multiple referenced elements.
Why are duplicate IDs a problem?
Labels and ARIA references use IDs to identify targets. Reusing an ID makes those relationships ambiguous and can cause assistive technologies or scripts to use the wrong element.
Do radio buttons need individual labels and a legend?
Each option needs its own name, and the group normally needs a shared question. A fieldset with a legend provides that group context using native HTML.
Does the tool check error messages and instructions?
It checks naming relationships only. Instructions, validation messages, required-state communication, focus movement, and keyboard behavior need separate testing.
This tool is an educational testing aid and does not guarantee WCAG conformance or legal compliance. Learn more from the W3C form labels tutorial.
