Just ran across a for
parameter in an HTML label tag:
<label for="required-firstname"> First Name </label> <small>*</small> <input name="required-firstname" type="text" tabindex="2" id="required-firstname" size="24" maxlength="40">
I'm converting this form to a PHP processed script, can I get rid of the for= parameters? (And out of curiosity, what does it do?)
The for attribute specifies which form element the label is bound to. The label element allows the user to give focus to a form element by clicking on an associate label. If you do not use the for attribute, this association will not be made.
The for attribute associates the label with a control element, as defined in the description of label in the HTML 4.01 spec. This implies, among other things, that when the label element receives focus (e.g. by being clicked on), it passes the focus on to its associated control.
HTML <label> tag When writing in HTML, the <label> tag is used to create labels for items in a user interface. Used within <input> tags on a form, the <label> tag is additionally useful because it extends the clickable area of control elements, like buttons.
by definition a label still needs to be 'for' something right? Yes, but that doesn't mean the for attribute is required. For example, if the input is nested inside the label, the label is “for” that input implicitly.
From w3schools.org:
The tag defines a label for an input element.
The label element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the label element, it toggles the control.
The for attribute of the tag should be equal to the id attribute of the related element to bind them together.
HTH!
adding my $.02 as an Accessibility SME - as well as usability, the LABEL also associates the input field with the correct label so persons using screen readers will know what the field is for.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With