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.

STEP 1

Paste or try a form sample

Try an example

Paste a form fragment or a complete HTML document. Scripts in pasted code are parsed as inactive text and are not executed.

STEP 2

Review every control

Overall resultReady to check
Controls0
Named0
Errors0
Warnings0

Detected controls

  1. Run the checker to list form controls.

Findings and fixes

  • No analysis yetINFO

    Paste HTML or load an example, then select Check form labels.

How to read the result

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

<label for=”account-email”>Email address</label> <input id=”account-email” type=”email” autocomplete=”email”>

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.