The <label> element

Hello Michael and hello everyone,

I haven’t been there for a while, now I’m reading the How to structure a web form article, and in The <label> element part is a paragraph telling that

There is another way to associate a form control with a label — nest the form control within the <label> , implicitly associating it.

And below is a screenshot, where seems to me is a mistake? When we wrap up the input in such a way, we should omit the for attribute?


Kind regards,
Denis

A have already understood what is the point, when we wrap up in a such a way, this attribute is strongly recommended for being used but not obliged because of accessibility reason

Hi @DenisM

Yes you are right.

In the great article HTML Inputs and Labels: A Love Story Amber Wilson even generally recommends explicit labels (not nested) over implicit labels (nested):

Unfortunately, an implicit label is not handled correctly by all assistive technologies, even if for and id attributes are used. Therefore, it is always the best idea to use an explicit label instead of an implicit label.

Have a nice day!
Michael

2 Likes