Question

I noticed that within the Bootstrap documentation, in the inline forms part it states ( http://getbootstrap.com/css/#forms-inline ):

Screen readers will have trouble with your forms if you don't include a label for every input.

However, I noticed that there is a aria-label attribute: http://www.w3.org/TR/wai-aria/states_and_properties#aria-label which does the same.

Does this mean I can use that directly on the input instead of having to add an extra element to each input?

I am wondering if there is something specific and special about adding the labels explicitly.

Was it helpful?

Solution

No, the aria- attributes in general have limited support: they are supported by assistive software and specialized browsers, whereas all mainstream browsers support the label element. If you only use the aria-label attribute and no normally visible label, then the vast majority of users see no label.

The aria-label attribute is intended for very special cases, typically cases where users can normally understand the meaning of a control from the page context so that a visible label is not needed, and perhaps not even desired, but people using e.g. speech browsers need an “accessible label”.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top