b 要素

4.5.18 b 要素

カテゴリー:
フロー・コンテント
フレージング・コンテント
パルパブル・コンテント
この要素を使うことができるコンテキスト:
フレージング・コンテントが期待される場所
コンテントモデル:
フレージング・コンテント
コンテント属性:
グローバル属性
text/html におけるタグの省略:
どちらのタグも省略できません。
指定可能な ARIA role 属性 の値:
あらゆるロールの値
指定可能な ARIA ステートとプロパティ属性:
グローバル aria-* 属性
許可ロールに該当する aria-* 属性
DOM インタフェース:
HTMLElement を使う。

b 要素は、特に重要性を伝えることはなく、代替音声や気分という意味合いもなく、実利的な目的で注目を引きたいテキストの範囲を表します。例えば、ドキュメントの概要にあるキーワード、レビュー記事の中の製品名、対話型テキスト駆動ソフトウェアにおけるアクショナブル・ワード、記事リードが相当します。

次の例は、b 要素を使ってキーワードをハイライトしています。重要なものとしてマークアップされているのではありません:

<p><b>フロボニター</b> と <b>バービネーター</b> の部品が壊れてしまいました。</p>

次の例では、アドベンチャー物語のテキストに出てくる物を、b 要素を使って特別なものとしてハイライトしています。

<p>あなたは小さな部屋に入る。あなたの <b>剣</b> は明るく輝く
ようになる。一匹の<b>ネズミ</b> が壁づたいににうろちょろする。</p>

b 要素がふさわしい事例として、リード文や段落をマークアップする場合が挙げられます。次の例は、ウサギに養子として受け入れてもらえた子猫に関する BBC の記事をどのようにマークアップすることができるのかを示しています:

<article>
 <h2>子猫がペットのウサギの '養子' に</h2>
 <p><b class="lede">6匹の捨て猫が、新たに意外な
 お母さんを見つける 写真 — ペットのウサギ。</b></p>
 <p>動物看護士のメラニ・ハンブルは生後三週間の子猫を
アバディーンの自宅に引き取りました。</p>
[...]

i 要素を使うときのように、ウェブ制作者は、なぜこの要素が使われているのかが分かるよう、b 要素に class 属性を使うことができます。こうすることで、後日、特定の用途のスタイルを変更することになっても、ウェブ制作者はそれぞれの用途ごとに注釈しなくても済みます。

b 要素は、それ以上ふさわしい要素がない場合の最後の手段として使うべきです。特に、ヘッダーは h1h6 を使うべきですし、強調は em 要素を使うべきですし、重要性は strong 要素を使って表示されるべきです。そして、マークしたい、またはハイライトしたいテキストは、mark 要素を使うべきです。

次は間違った使い方です:

<p><b>警告!</b> バービネーターに触らないで!</p>

この例では、strong 要素を使うのが正しいのです。b 要素ではありません。

b 要素の書式を整えるためにスタイルシートを使うことができます。他の要素が再スタイルされているのと同じようにです。ゆえに、b 要素のコンテンツが必ずしも太字体になるわけではありません。


※ 原文:http://www.w3.org/TR/2014/REC-html5-20141028/text-level-semantics.html#the-b-element