HTML

The <em> element in HTML is a semantic tag that indicates special contextual emphasis within a text, signaling to browsers and screen readers that this part should be read with particular importance.

em要素

 em要素は、文章中の「強調すべき内容」を示すために使われる要素です。単純に文字を斜体にするだけでなく、「ここに特別な意味合いやニュアンスが込められている」ということを示すための「文書構造上の意味(セマンティクス)」を持っています。

em要素の主な役割

文意における強調(emphasis)を示す
実際のブラウザ上ではデフォルトのスタイルとしてイタリック(斜体)で表示されることが多いですが、あくまでも視覚的な効果というより、「文脈上の強調」であることが重要です。
テキストの強調度を段階的に表現可能
em要素は入れ子(ネスト)にすることができ、ネストの回数によって強調度合いをより高める使い方があります。ただし、現実的にはネストに対してのスタイリングが標準でそれほど明確に変化しないことが多いため、多用は控えられることが多いです。
スクリーンリーダーなどの支援技術で読み上げられる際に強調される
em要素を使っている部分は、支援技術によって「強調されている箇所」として扱われるケースがあります。たとえば、音声のトーンを変えて読み上げるなど、利用者に文脈的な強調を伝えられます。

em要素と似た要素との違い

strong要素との違い

i要素との違い

em要素を使うときの注意点

過度な入れ子は避ける
多層的に強調すべき文章構造は少ないため、入れ子を多用するのは可読性を損ねる可能性があります。本当に複数段階の強調が必要かどうか、文脈を再確認しましょう。
スタイルより文脈の意味を重視する
“文字を斜体にしたい”という目的だけで em要素を使うのは好ましくありません。視覚表現が目的の場合は CSSで font-style: italic; などを指定する方法を検討し、HTML要素にはあくまで「セマンティクス(文脈的意味)」を持たせるようにします。
strong要素との住み分け
強調したい内容が「重要度の高さを伝えるものか」「感情表現や抑揚を意図したものか」を考え、目的に応じて使い分けるのが望ましいです。

Sample

彼はWorld Championship初めて優勝を果たしました。

HTML

<p>
	彼は<span lang="en">World Championship</span>で
	<em>初めて</em>優勝を果たしました。
</p>

CSS

em {
	text-decoration: dotted underline;
	text-underline-offset: 4px;
}

 この例では「初めて」の部分が強調されるべき内容とみなし、em要素を使っています。スクリーンリーダーでは適切に強調が伝えられるため、見た目だけでなく文脈的にも「重要な初の優勝である」ことを知らせる効果があります。

Sample 2

 以下の例文では、同じ文章でも em要素を挿入する位置によって、読み手が感じ取るニュアンスが微妙に変化する様子を示しています。

パターン1

HTML

<p>私は<em>本当に</em>あなたを愛しています。</p>
強調点
「本当に」
ニュアンス
「心から真剣に」愛しているという気持ちを強く表現しており、誠実さや真剣さにフォーカスが当たります。

パターン2

HTML

<p>私は本当に<em>あなたを</em>愛しています。</p>
強調点
「あなたを」
ニュアンス
「あなた」という存在そのものに焦点が置かれており、「愛しているのは他の誰でもなく“あなただ”」という点を強調しています。

パターン3

HTML

<p>私は本当にあなたを<em>愛しています</em>。</p>
強調点
「愛しています」
ニュアンス
「愛する」という行為や気持ちそのものを強くアピールしており、「愛するという感情が非常に深い」という点に重きが置かれます。

解説

位置による強調の対象の違い
em要素をどこに置くかによって、文章全体が伝えようとするポイントが微妙に変わります。パターン1では「本当に」という副詞を強調して誠意を示し、パターン2では「あなた」という対象に強調が移り、パターン3では「愛しています」の行為が強調されます。
セマンティクスの重要性
em要素は単なる文字装飾ではなく、「文脈上の強調」を意味づけするための要素です。視覚的には斜体表示になりがちですが、本来は支援技術(スクリーンリーダーなど)に「ここを重要に読んでほしい」という情報を伝える役割を担っています。
使い分けのポイント
強調すべき要素が「言葉の定義」なのか、「対象」なのか、「感情」なのかを考えて最適な位置に em要素を使うと、読み手により正確なニュアンスを届けられます。文脈によっては strong要素を使った方が「重要度の高さ」を伝えやすい場合もあるため、目的に合わせて使い分けることが大切です。

 このように、同じフレーズでもどこを強調するかによって意味合いや伝わり方が変わるため、em要素の使い所を吟味することで文章の意図をより正確に読み手に伝えることができます。