Forms and validation
Labels, inputs, validation hints, form states, and confirmation messages.
What you will practice
Form structure; Explicit labels; Email input types; Required fields.
Use the worked examples when needed, then test your understanding without them.
- 01Forms and validation: Form structureA form groups related input controls. This lab practices structure without submitting any data.Practice
- 02Forms and validation: Explicit labelsThe for attribute on a label connects it to the input with the matching id.Practice
- 03Forms and validation: Email input typestype="email" provides browser-level format validation. It does not prove that the mailbox exists.Practice
- 04Forms and validation: Required fieldsrequired participates in native constraint validation; identify the requirement in visible copy too.Practice
- 05Forms and validation: Help text relationshipsaria-describedby associates a control with help text identified by an existing element id.Practice
- 06Forms and validation: Error messagesAn error needs both a specific explanation and a programmatic relationship to the invalid control.Practice
- 07Forms and validation: Input descriptionsA placeholder is not a replacement for a visible label or persistent help text.Practice
- 08Forms and validation: Grouped choicesfieldset and legend give a related set of form controls a shared accessible name.Practice
- 09Forms and validation: Confirmation statesA status region can announce a completed action while leaving focus on the current control.Practice
- 10Forms and validation: Validation checkpointAn accessible input combines a label, the appropriate type, a visible requirement, and connected help.Practice