HTML5 abbr attribute

This article on HTML5 abbr attribute is part of the series of articles we want to post on HTML5 attributes and elements that impact accessibility. If you have not read have a look at our accesskey article.

HTML5 abbr is an attribute, do not get confused with the abbr element. The abbr element used to expand the abbreviations is different from the abbr attribute. The HTML5 abbr attribute is used within the header cell of a table i.e. <th> element.

The value of HTML5 abbr attribute is text or otherwise called as alternative label. The text is not visible on the screen but read by the screen reader. This text is read only when user navigates the table by referring with other cells of the table. Content authors can provide either abbreviation or expansion or a different text all together.

As on today the latest version of NVDA i.e. NVDA 2017.3 does not support HTML5 abbr attribute. JAWS seems to have support with this attribute on all three major browsers.

Using HTML5 abbr attribute

The abbr attribute is used within the <th> element. Example code below.

</p> <th abbr="Make">Toy manufacturer</th> <th abbr="Model">Vehicle model</th> <p>
Also have a look at the live HTML5 abbr attribute example.

Related Links

None available

Leave a Reply