Many websites use online forms. In order for screen readers, talking browsers and Braille devices to work efficiently, the devices need to able to associate a form label with the correct form control such as a text field or text control.
Form fields should always have a text-based label indicating what information should be entered in that field for greater accessibility. The following are the advantages:

• Screen readers are able to inform users what each field represents for those wishing to use them to fill out forms
• When the user clicks on the label, the associated form field receives the focus. Thus providing a larger “target” area for clicking.

Guidelines:

• All form fields must be associated with their labels using the < label> html tag
• If a form cannot be labeled, it must include the title attribute to give a brief about what the form field is
• Associate a label with a form element for list boxes, combo boxes, radio buttons, and check boxes
• Reading bold labels is a little bit more difficult for users, so it’s preferable to use plain text labels.
• Input field size should be kept relevant to the expected user input

Example:

If a screen reader accesses a form element e.g. First Name that has a < label> element associated with it, it will be read as 'First Name' and indicate the type of form item as "First Name. Text Box".

Validation Technique:

• Use the screen reader software while filling out the form and observe whether it reads out what the field represents
• Validate this function using the WAVE Tool bar
• Or Google Lighthouse