Make sure that all input elements are connected to corresponding labels

Describe the bug

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.

Steps to reproduce

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

Contact version

4.4.1

Operating system

No response

PHP engine version

No response

Web server

No response

Database

No response

Operating system

No response

List of activated Apps

Conacts

Nextcloud Signing status

No response

Configuration report

No response

Additional info

No response

No files, tests, or entry points are named; start by locating the Contacts app's input elements and auditing their label associations against the linked WAI forms guidance. Done means every input has a connected label, including cases where the label is visually hidden, and the relevant accessibility checks pass.