Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Error Message: <span> vs <label>

Tags:

html

css

When you display an error message in HTML, which element do you use, <span> or <label>?

Can you list some pros and cons for each of them, assuming that some styling, such as color and margin will be applied through their class?

like image 923
Tom Tucker Avatar asked Jan 16 '11 20:01

Tom Tucker


2 Answers

Assuming you mean an error message associated with a specific form control, use a <label>.

The semantic arguments are subject to debate, as they aren't clear cut in this case, but the practical arguments win quite nicely. If a screen reader is in forms mode, it may skip over non-label text thus hiding the error messages from the user.

like image 178
Quentin Avatar answered Sep 28 '22 09:09

Quentin


Either can be used and both can be styled. I think the discussion will be about symantically which is more clear. I think of label elements as being associated with describing what a particular input element's intent. I don't feel displaying error info fits this and prefer the span.

like image 39
rcravens Avatar answered Sep 28 '22 09:09

rcravens