重要度 [文書構造]

見た目で重要度の高さ(重要性、深刻さ、緊急性)を示しているテキストは、<strong>要素を用いてマークアップする。

解説

太字にしたり、文字色を変えたりするなどして、見た目で重要度が高いことを示しているテキストは、<strong>要素を用いてマークアップします。そうすることによって、重要度が高いテキストであることがマシンリーダブルになり、ユーザーエージェントがそのことを解釈できるようになります。

HTML5では、<em>要素と<strong>要素の意味合いが若干変更になっています。

  • <em>要素:コンテンツの強調や強勢をあらわす。
  • <strong>要素:コンテンツの重要性、深刻さ、緊急性をあらわす。従来の「より強い強調」という意味ではなくなった。
    • 重要性:他の部分と比べて大きな違いがあり、本当に重要な部分を示す。
    • 深刻さ:警告や注意を示す。
    • 緊急性:ユーザーが他の部分よりも先に見る必要があるコンテンツを示す。

もしコンテンツの一部分を強調したいという場合には、<em>要素を用いてください。

<strong>要素は、多くのブラウザのデフォルトでは太字で表示されますが、文字の見た目を太字にするための要素ではありません。文中にあるテキストを太字にして、その他の部分から際立たせようとすることがありますが、強調や重要性を示す意図がない場合は<b>要素を用いるほうが適切だとされています。

事例 1. 重要性のマークアップ

悪い例


<p><b>注意</b>:「レベル AA 準拠」は、レベル Aおよびレベル AAの達成基準を満たしていることを指します。</p>

文中で重要性が高い部分を太字にしようとして<b>要素を用いている。しかし、<b>要素には重要性や注意という意味はないため、ユーザーエージェントにはその部分の重要度が高いことが分からない。

良い例


<p><strong>注意</strong>:「レベル AA 準拠」は、レベル Aおよびレベル AAの達成基準を満たしていることを指します。</p>

<strong>要素を用いて、コンテンツの重要性をマークアップしている。多くのブラウザでは太字で表示されるが、見た目のスタイルはCSSを用いて変更することができる。

『JIS X 8341-3:2016 / WCAG 2.0』の達成基準

1.3.1 情報及び関係性(レベル A)
何らかの形で提示されている情報、構造、及び関係性は、プログラムによる解釈が可能である、又はテキストで提供されている。

JIS X 8341-3:2016 / WCAG 2.0「1.3 適応可能のガイドライン」