Make sure that all input elements are connected to corresponding labels

Steps to reproduce

In general, most input fields lack label-texts. Placeholders are used instead, but since that text disappears as soon as the user starts to type in the field this is not enough to comply with this success criterion.

1. Choose any of input element on the page.
2. Check, if input has a connected label.
3. If not - add a right label. If this label should be hidden - there are some techniques to do it:

Implementation suggestion: https://www.w3.org/WAI/tutorials/forms/labels/
https://austingil.com/how-to-build-html-forms-right-accessibility/#Labels

Expected behavior

Every input have to have connected label.

A label and the form-element it identifies must be connected in the code. That way users with assistive technology such as screen readers can easily understand the purpose of the form-element.

Unfortunately, we saw several places where labels and their form-elements aren’t connected, making them challenging to use for screen reader users.

Actual behavior

Not every input has a label

Mail app version

1.13

Mailserver or service

No response

Operating system

No response

PHP engine version

No response

Web server

No response

Database

No response

Additional info

No response

Start by searching the frontend for every input element and checking whether each has a connected label, using the linked WAI forms-label guidance as reference. Done means all inputs have accessible, programmatically connected labels, including cases where the label is visually hidden.