HTML Child / The Page as a Contract
Forms and labels are the most commonly broken thing on the web
Every field needs a name that is attached to it, not merely sitting nearby.
A form is a conversation. The page asks questions and the reader answers them. For that to work, every question must have a name and every name must be genuinely connected to its answer box, not simply placed above it where it looks connected. That connection is what allows a person listening to hear the question when they arrive at the box, and it is also what makes the words themselves activate the field when tapped, which is a substantial help for anybody using a small screen or a shaky hand. Proximity looks the same and does none of that.
The most frequent shortcut is putting the question inside the box as faint grey text and calling that the label. It looks tidy, and it fails in several ways at once. The words vanish the moment the person starts typing, so they cannot check what they were asked while answering. The faint styling is often hard to read. And in many situations the software will not treat that hint as the name of the field at all, so a person listening is told simply that there is a box. A hint inside a field is a useful extra. It is not a label.
Two more things belong to the same contract. Grouping matters: a set of related choices, such as the parts of an address or a single question with several options, should be presented as a group with a name, so the reader understands what the individual options are choices about. And errors matter enormously. When something is wrong, say what is wrong in words, next to the field it concerns, connected to that field, and make sure the message is announced rather than merely appearing. Colour alone is not a message, and a red outline tells a listener nothing.