文章の中で「強調したい部分」を表すときに使うのが strongタグ と emタグ です。
どちらも文字を強調する役割を持ちますが、意味や使い方が異なります。
この記事では、strong と em の違い、SEO的な解釈、正しい使い分け を初心者向けに解説します。
strongタグとは？
strongタグは「特に重要な部分」を強調する意味を持つタグです。
<strong>これは重要な情報です。</strong>
ブラウザ上では太字になりますが、
実際の意味は「見た目」ではなく 意味の強調（強い重要性の示唆） です。
✔ SEO的にも “重要語” として評価されることがあります。
emタグとは？
emタグは「文章中の強調したい箇所」を表すタグです。
<em>特にここを強調したい</em>
ブラウザでは斜体になるのが一般的ですが、
これも「見た目」ではなく、文脈的な強調を示します。
✔ strong より弱い強調
✔ 文脈上の重要度を表す
strong と em の違い
| タグ | 意味 | 見た目（デフォルト） | SEOへの影響 |
|---|---|---|---|
| strong | 重要性の強い強調 | 太字 | やや強い（強調語と判断される） |
| em | 文脈上の強調 | 斜体 | 弱い（強調表現として扱われる） |
✔ strong：内容自体が重要
✔ em：文章の調子として強調したい
strong・em の使い分け（実例）
strong → 読者に特に理解させたい内容
<strong>パスワードは他人に教えないでください。</strong>
em → 感情・語気・文脈の強調
今日は <em>本当に</em> 暑いですね。
文章内での自然な使い分け例
<strong>重要：</strong> この設定を変更すると影響が出る可能性があります。
strong と em の入れ子（ネスト）について
HTMLでは、
em の中に strong を入れることは可能 です。
<em>とても <strong>重要</strong> なことです。</em>
意味づけとしては：
- em → 文脈上の強調
- strong → その中でさらに重要
という2段階の強調を表現できます。
CSS での強調との違い
強調は CSS の font-weight や color でも可能です。
.strong {
font-weight: bold;
}
.highlight {
color: #E64A19;
}
しかし CSS の強調はあくまで 見た目だけ。
意味としての強調は strong/em で行うのが正しい という点を理解することが大切です。
よくある間違い
見た目を太字にしたいから strong を使う
→ 本来の意味とは違う
斜体にしたいから em を使う
→ CSS でやるべき
見出しやタイトルに strong を使う
→ hタグに意味があるので不要
まとめ
- strong → 内容として重要な部分
- em → 文脈的な強調（語気の強調）
- 見た目の太字・斜体ではなく「意味づけ」が本質
- SEOでも僅かながら意味の強調と認識される
- デザイン目的なら CSS を使う
著者からのひと言
strong と em は、最初は「太字」「斜体」と見た目で理解しがちですが、本質は “文章の意味づけ” にあります。
タグの意味を知ることで、HTMLの書き方が格段に綺麗になります。少しずつ“意味で書くHTML”を意識していきましょう。
次回の記事は「HTML5セマンティックタグとは？意味と使い方」です。
おすすめ関連記事
各講座のトップページはこちら
この記事が役に立ったら、いいね！お願いします！
