WebAIR

Do you use the appropriate markup to present any variations in presentation of text (e.g. bold, italics, subscript and superscript) ? (TXT02)

Why is this important?

In addition to the different ways of presenting blocks of text, there are also different ways of presenting the individual words. For example, you might want to highlight certain words by making them bold, or italicising them. When letters are smaller and appear above the line (e.g. 26th January), this is called superscript. When letters are smaller and appear below the line (e.g. H2O), this is called subscript. HTML provides a range of semantic elements to support these variations in presentation. Using the appropriate markup will allow people with disabilities, particularly those using a screen reader, to interpret the meaning of the variation in presentation.

How to fix the problem

Using the appropriate markup to present variations in the presentation of text will make it easier for people with disabilities to interpret the data. Text that is to be highlighted should be marked up using the <strong> element (not the now-deprecated <b> element). Text that is to be emphasised should be marked up using the <em> element (not the now-deprecated <i> element). Superscript should marked up using the <sup> element. Subscript should be marked up using the <sub> element.

Example

//An example of bold text
<p>This is a paragraph containing a <strong>highlighted word</strong>.</p>
//An example of emphasised text
<p>This is a paragraph containing an <em>emphasised word</em>.</p>
//An example of superscript
<p>The wedding is on March 2<sup>nd</sup>.</p>
//An example of subscript
<p>The chemical notation for water is H<sub>2</sub>O.</p>

Further Information

  1. http://www.w3.org/community/webed/wiki/Marking_up_textual_content_in_HTML
  2. http://www.w3.org/html/wg/drafts/html/master/text-level-semantics.html#the-sub-and-sup-elements