Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Label Tag semantics

I've read this and I GENERALLY use spans or strongs to describe "text-labels". Is this true for best practices? It seems is also a semantic way but why is it limited to just form elements?

What if I wanted to display information as this:

Name: FOo Bar
Age: 27
Weight: 151 kg

etc?

name, age, and weight can all be described as labels, but since the items they're describing aren't input tags, it isn't semantically correct(for html and w3c at least). I usually use

<span class="label"> or <span class="description"> or <span class="person-detail"> etc

but generally there should also be a tag for labels that don't pertain to input fields. As this might be a bit subjective I don't mind this turning into a community wiki or something

like image 534
corroded Avatar asked Mar 24 '11 05:03

corroded


People also ask

What is semantic label?

Semantic labeling, or semantic segmentation, involves assigning class labels to pixels. In broad terms, the task involves assigning at each pixel a label that is most consistent with local features at that pixel and with labels estimated at pixels in its context, based on consistency models learned from training data.

What is the use of label tag?

The <label> tag is used to specify a label for an <input> element of a form. It adds a label to a form control such as text, email, password, textarea etc. It toggles the control when a user clicks on a text within the <label> element.

What is the syntax of label?

The <label> tag defines the label for <button>, <input>, <meter>, <output>, <progress>, <select>, or <textarea> element. The <label> tag can be used in two ways: Firstly, use <label> tag by providing the <input> and id attribute. The <label> tag needs a for attribute whose value is the same as input id.

What is label for attribute?

The HTML <label> for Attribute is used to specify the type of form element a label is bound to. Syntax: <label for="element_id"> Attribute Values: It contains the value i.e element_id which specify the id of the element that the label is bound to.


1 Answers

You should use a definition list (dl with dt and dd):

<dl>

 <dt>Name</dt>
 <dd>FOo Bar</dd>

 <dt>Age</dt>
 <dd>27</dd>

 <dt>Weight</dt>
 <dd>151 kg</dd>

</dl>

The spec states that it could be used for

terms and definitions, metadata topics and values, questions and answers, or any other groups of name-value data.


I think a table (with th) could be used, too. But I would only use it when I want to compare several people, not just listing the data of one person.

like image 190
unor Avatar answered Sep 16 '22 12:09

unor