先日HTML5で使う機会が案外ありそうな要素など色々という記事を書いたんですが、他にも少し見つかったのでメモしときます。ちょっと要素の意味が似ているというか、混乱しそうな感じなので整理という意味でまとめてみます。要素はem、strong、i/bのそれぞれの違いについてです。
[ads_center]
emとstrongとi/bの要素の違い
どうやらHTML5以前の意味とは少し変わってるところもあるみたいですね。まずはemから見てみます。
em要素
em要素は強調強勢を表す要素です。文章の中でどこの部分を強調させるかによってその文の意味やニュアンスの違いがわかります。わかりやすくいうと、声のトーンを変えて伝えたいことです。具体的な例としては以下の解説がわかりやすかったので引用させていただきます。
最初の単語を強調すると、この議論では動物の種類が問題になっているというニュアンスになります（誰かが、犬がキュートなんだ、と言い張っているのかもしれません。）：
<p><em>Cats</em> are cute animals.</p>強調を動詞に移すと、文章全体の真実性が問題になっているという点が際立つことになります（誰かが、猫はキュートでない、と言っているのかもしれません。）：
<p>Cats <em>are</em> cute animals.</p>強調を形容詞に移すと、猫の本当の性質が再強調されます（誰かが、猫はみずぼらしい動物だ、と言っているのかもしれません。）：
<p>Cats are <em>cute</em> animals.</p>
引用元: em 要素 – テキストレベルの意味づけ – HTML要素 – HTML5 タグリファレンス – HTML5.JP
注意したいのはem要素には重要性を示すための要素ではないということです。あくまでも強調させるという意味で使います。
strong要素
上記のemはコンテンツを強調させるために用いられる要素でしたが、strong要素は、 重要性を表すために使用します。strongはネスト化させることもできます。emより少しはわかりやすい感じがします。
i要素・b要素
i要素、b要素は以前はフォントを装飾するたけの要素でした。ちなみにi要素がイタリック、b要素がボールドでした。i要素はHTML5からは気分やムードの代替音声を表すために使われるようになります。b要素は重要ではないけど他と区別したい場合に使用します。たとえばドキュメントのキーワードやレビュー記事の製品名などです。
まとめ
i要素とb要素を使う場合はまずそれ以外にふさわしい要素がないかどうか検討することが推奨されいるみたいですね。強調させる場合はem、重要性を持たせたい場合にはstrongといったその要素における優先順位をしっかりと把握しておいた方がいいかもしれません。
