Basic HTML and HTML5, input elements - incomplete description of the "for" attribute

Challenge Name

Basic HTML and HTML5: Create a Text Field Basic HTML and HTML5: Create a Set of Radio Buttons Basic HTML and HTML5: Create a Set of Checkboxes

Issue Description

This is a follow up to issue #15946 where it was suggested that the lesson Basic HTML and HTML5: Create a Set of Radio Buttons should reflect the best practice guidelines from the Mozilla documentation.

The issue was closed and now the lesson includes the following:

It is considered best practice to set the for attribute for assistive technologies to be able to link the relationship between the label and the child elements such as an input in this case.

Yet:

1. If the goal is teaching best practice, the lesson should explain that the label element’s for value has to match the input element’s id value as explained in the linked Mozilla documentation page.
2. The same issue applies to the next lesson: Basic HTML and HTML5: Create a Set of Checkboxes.
3. This advice applies not only to clickable input elements, the Mozilla page actually discusses input type="text" which is covered in a previous lesson: Basic HTML and HTML5: Create a Text Field.
4. However, keep in mind that this topic is actually covered in its own lesson under: Applied Accessibility: Improve Form Field Accessibility with the label Element

[QuincyLarson]

@davinderpalrehal Awesome! It’s all you then. Please let me know if I can do anything to help. Looking forward to seeing your updated challenge(s).

[davinderpalrehal]

I would love to work on this.