Advancement · School Operations

Find every form field
a screen reader cannot name

Paste the HTML of a form from your school or organization’s website. The page reads it right here and sorts every field: a proper label, a title only, a placeholder only or nothing at all. It also finds labels pointing at the wrong id, radio groups with no legend, ids used twice and personal-detail fields missing autocomplete, then prints a fix list for whoever maintains the site.

Add a formWhat you get
$12one-time · every device you sign in on
Buy · $12

Included with Caveat Classroom and Whole-school licenses. Or get it in the School operations toolkit, $49 for 66 items.

Forms

The worked example is made up: a contact form that is nearly right, an enrollment form built on placeholders and a lone search box. The HTML you paste is read on this page only; nothing in it runs, and nothing is sent anywhere.

Loading the form form. If nothing appears, turn on JavaScript.

What you get

Advancement · School Operations$12 · included with Classroom and Whole-school licenses

What you finish with
A record per form: its name, where it lives, who fixes it and its HTML; six checks done by hand and the date the fixes were finished. A count of fields by how they are labelled, each problem field listed by type and name, broken label links, unlabelled groups, missing autocomplete and repeated ids; a printed fix list.
Who it is for
Web coordinators, communications staff, technology teams and anyone at a school or organization who maintains web forms.
Format
Browser tool with a saved record per form. Prints the fix list, the record, every form in a table or a blank form; downloads a spreadsheet (.csv); exports and imports a file.
Access
$12 one-time, yours on every device you sign in on; the tool opens once you are signed in with it. Included with Caveat Classroom and Whole-school licenses. Also in the School operations toolkit ($49) and the Advancement Suite pass ($99), and 1 more bundle. Everything you type stays in this browser; nothing is sent to Caveat.
Where it lives
The School Operations space in Caveat Advancement.
Support
Questions about access, an order or a correction: team@caveatacademic.com.

How to use it

  1. Copy the form’s HTML from your browser’s Inspect panel.
  2. Paste it into a new form record.
  3. Read the fields sorted by how they are labelled.
  4. Do the six checks by hand.
  5. Print the fix list for whoever maintains the site.

Add a form

Why labels matter most

How a field gets its name, best to worstHow the field is namedRead by a screen readerSeen while typing<label for> or wrappedYesYesaria-labelledbyYesIf the text is visiblearia-labelYesNo: add visible texttitle onlyOften, not alwaysOnly on hoverplaceholder onlyUnreliablyNo: it disappearsnothingNoNoHow a field gets its name, best to worst<label for> or wrappedRead by a screen reader: YesSeen while typing: Yesaria-labelledbyRead by a screen reader: YesSeen while typing: If the text is visiblearia-labelRead by a screen reader: YesSeen while typing: No: add visible texttitle onlyRead by a screen reader: Often, not alwaysSeen while typing: Only on hoverplaceholder onlyRead by a screen reader: UnreliablySeen while typing: No: it disappearsnothingRead by a screen reader: NoSeen while typing: No
A visible label element tied to its field works for everyone at once: people who see the screen, people who hear it and people who click the label to reach the field.

What the code check covers

WCAG 2.2 asks that every form field have a name assistive technology can read (4.1.2 Name, Role, Value), labels or instructions people can see (3.3.2) and, for fields that collect personal details, a way to identify their purpose, such as the autocomplete attribute (1.3.5). Related options, like a set of radio buttons, should be grouped so the question is read with each choice (1.3.1), which a fieldset with a legend does.

What it cannot see

The page reads the HTML you paste; it does not run scripts, apply styles or load anything, so labels added later by JavaScript will not show here. It cannot tell whether a label makes sense, whether an error message helps or whether a field is reachable by keyboard. Those are the checks by hand, and a short test with a screen reader is still worth doing.

Sources

  1. World Wide Web Consortium (W3C). Web Content Accessibility Guidelines (WCAG) 2.2: 1.3.1, 1.3.5, 3.3.2 and 4.1.2 (w3.org/TR/WCAG22).
  2. W3C Web Accessibility Initiative. Forms Tutorial: labeling controls, grouping controls and instructions (w3.org/WAI/tutorials/forms).
  3. W3C. Accessible Name and Description Computation 1.2 (w3.org/TR/accname-1.2).
  4. WebAIM. Creating Accessible Forms (webaim.org).

The worked example is made up. This page checks the labelling in pasted HTML; it is not a full accessibility audit or a legal determination of conformance. The HTML is parsed into an inert document on this page, so nothing in it runs or loads, and nothing you paste is sent to Caveat. Support: team@caveatacademic.com.