Using the Abbreviation Tag in Your Content

August 17, 2017 By everybody , aka mind

Dozens of HTML tags are out there. Some are obsolete, and others are freshly added with the increasingly standard support of HTML5. As developers or content creators however, sometimes we forget about the tags we don’t use very often. This week, I’d like to shine the spotlight on the abbreviation tag; and how it can help with your web development and marketing strategies.

What Is The Abbreviation Tag?

The abbreviation tag is used to represent abbreviations and acronyms within website content. Prior to HTML5, acronyms had their own separate tag (coded as <acronym>), but since then they have been consolidated. Abbreviation tags are supported in most major web browsers: including Google Chrome, Firefox, Internet Explorer, Microsoft Edge, Safari, and Opera.

The tag looks like this:

<abbr title="Search Engine Optimization">SEO</abbr>

The tag comes in three main parts:

The Tag Itself

This bit is fairly self explanatory for developers. For the rest of us, the tag is represented by and works similarly to other HTML tags by encapsulating the elements that it further defines.

The Abbreviation

This is the text that falls between the tags, in our case, the acronym “SEO”. We are using the tag to tell browsers “Hey, the text in between here actually stands for something else”.

The Extended Definition

Represented by the section ‘title=”Search Engine Optimization”’ in our example, this is the full definition of the abbreviated text. In most modern browsers, the text placed here will be shown to users when they hover their mouse over the abbreviated text.

Why Should I Use the Abbreviation tag?

Abbreviation is more than just a cool tag – it has several practical uses. Content readability, site accessibility, and search optimization can all benefit from the use of tags.

Readability

Standard writing practice is to only define an abbreviation the first time it appears in a piece. Opting to show the shortened version of the text in the remainder should increase readability and comprehension in your audience.

Accessibility

Being able to quickly see the meaning of a shortened phrase can increase your content’s accessibility drastically – especially for people with limited internet connections. In addition, some screen readers use this information to better relay your content to individuals with disabilities. (Worried about your site’s accessibility? Maybe its time for a redesign)

Search Engine Optimization

A huge benefit of the tag is that it includes topic-specific keywords while still allowing your audience to benefit from increased readability of using acronyms. For lesser known abbreviations, it can also help search engines to determine your content’s topic by linking to its expanded definition. Be careful using the tag in this way though! Abusing the tag, or having too high of a concentration of the same abbreviation, can be detrimental to your page’s credibility.

Add the Tag to Your Toolkit!

Besides these benefits, abbreviation tags also solve the issue of having to type out all of those pesky acronyms! Make sure to implement this tag in your own content to reap all of the benefits. Have any questions? Leave us a comment below!