Skip to content

Quick Tip: Don’t Use <abbr>

The <abbr> element stands for abbreviation. The idea behind this is you provide the abbreviation of the word or phrase, then use the title attribute to display the whole name or phrase.

<p>You need to pay your taxes to the <abbr title="Internal Revenue Service">IRS</abbr> for many years.</p>

The problem with this is that the <abbr> is not an interactive element. You cannot tab to it. It will be read just like any other word in the sentence. If you mouse over the element, you see the title. But if you use keyboard there is no way to expose it.

Then there are screen readers. Most screen readers will not announce this title.

It’s better to fall back to the old newspaper styling where you say the whole phrase the first time followed by the abbreviation in parenthesis. From there forward, you can use the abbreviation.

Take a look at the testing Adrian Roselli has done on this.

Published ina11ya11y 101accessibilityblindcognitiondevelopmentphysical impairmentW3CWCAG

Comments are closed.