Skip to Main Content

Accessibility Best Practices for LibGuide Content Creators

Strong and Emphasis Elements

Strong vs Bold | Emphasis vs Italics | LibGuide Text Editor | Deprecated Presentation Tags | Resources

The questions are:

  • Do I use Strong <strong> or Bold <b>?
  • Do I use Emphasis <em> or Italic <i>?

These questions may or may not immediately seem useful to you depending on whether or not you use HTML or a basic Text Editor to create your LibGuides. However, a basic knowledge of the differences between these elements will help you understand how screen readers process the information you include. So, what's the difference?

Excerpt from Siteimprove: Accessibility: Bold vs. Strong and Italic vs. Emphasis

To be sure to provide the same experience to all users, the strong and emphasis tags need to be used instead of the bold and italic tags. This is a big shift, especially for content contributors, but necessary to provide an equal experience for all users.

The Strong tag, <strong>, and the Emphasis tag, <em>, are considered Semantic Markup that allows for added meaning to your content. It serves as an indication to a screen reader of how something should be understood. [1]

Best Practice:

While Bold and Italic may look identical to their Strong and Emphasis counterparts, using bold and italic are actually accessibility errors because most screen readers will not announce these tags as items of semantic importance. It is best practice to use Strong and Emphasis so that all users get the same experience.

Strong vs Bold

Strong vs Bold Elements

Visually, there is no difference between bold and strong tags, but semantically there is a difference. The bold tag <b> is purely a visual element and conveys the text without "any extra emphasis or importance." Whereas the strong tag <strong> "represents a span of text with strong importance." [2]

In other words, the <strong> element provides more than just visually darkening and thickening the font. It also tells screen readers to place extra emphasis on the word or phrase.

Tip:

Don't use <strong> (or <b>) to delineate headings. Use a Header tag <h#>.

More information about using Header tags can be found in the tab titled Headers.

Emphasis vs Italics

Emphasis vs Italic Elements

Similarly, the italics tag <i> and the emphasis tag <em> are visually identical. The italic tag is a visual element for "text conventionally styled in italics." The emphasis tag "represents a span of text with emphatic stress." [2]

Again, the <em> element provides semantic content for screen readers, and is therefore the preferred element.

LibGuide Text Editor

To make things even more confusing, you may notice that the LibGuide text editor includes the Bold and Italic options in their interface; however, if you switch to the "Source" view, you'll see that bolding your text actually adds a strong tag <strong> while italicizing adds an emphasis tag <em>.

LibGuide Text Editor with Bold and Italic Icons highlighted. Example text using the two icons is also highlighted.

LibGuide Text Editor with Source Icon highlighted. In the code, the example text is highlighting that strong and emphasis are being used.

Deprecated Presentation Tags

Deprecated tags are HTML elements that (mostly) still work, but are no longer considered the most useful. Typically, these are old features that still work for backwards compatibility, but a newer option (often with semantic value) is now available and its use is recommended. While Bold <b> and Italic <i> tags are not technically consider deprecated elements, they do fall into a murky area.

In general, the rule is that <b> and <i> are to be used only as a last resort if you can’t find anything more appropriate for your needs. [3]

There are other presentational deprecated tags, such as the <font> tag, but there is always a CSS equivalent available. See the W3C site Obsolete Features for a full list of deprecated elements.

Best Practice:

"...the Bold tag <b> and the italic tag <i> are listed as a WCAG compliance Level A error because most screen readers will NOT announce these changes to the screen reader user. <b> and <i> should not be used to style text when the author wants to emphasize a word or passage of text." [1]

Tip:

If you need assistance finding a replacement for deprecated tags on your guide, contact a member of the LibGuide Working Group at ut_libguides@live.utk.edu.