emタグとは？strong・b・iタグとの違い・SEO効果を解説

「記事のこの部分を目立たせたいけれど、<em> と <strong> はどう使い分けるのだろう」「<em> タグにSEO効果はあるのだろうか」——HTMLで文章をマークアップしていると、こうした強調タグの違いで迷う場面が必ず出てきます。

emタグ（<em>）は、文章の一部を「意味的に強調する」ためのHTMLタグです。見た目としては斜体（イタリック体）で表示されますが、その本質は「見た目を斜体にすること」ではなく「その語句に強調のニュアンスを持たせること」にあります。ここを取り違えると、SEOの観点でもアクセシビリティの観点でも、もったいない使い方になってしまいます。

この記事では、emタグの正しい意味と使い方を軸に、次のことがわかるように解説します。

• emタグと strong・b・i タグの違い（1枚の早見表つき）
• HTMLでの具体的な書き方と、入れ子（ネスト）の仕様
• SEO効果の本当のところ（Googleの公式見解ベース）
• スクリーンリーダーがemタグをどう読み上げるか（アクセシビリティ）
• CSSのサイズ単位「em」との混同を避けるポイント

HTMLを書き始めた方や、記事を更新するWeb担当者が「このケースはどのタグを使うべきか」を自分で判断できるようになることをゴールに、初心者にもわかりやすく整理していきます。

emタグとは？意味的な強調を表すHTMLタグ

👉 このパートをまとめると！

• emタグは「emphasis（強調）」の略で、語句を意味的に強調するHTMLタグ
• デフォルトでは斜体（イタリック体）で表示されるが、目的は装飾ではなく意味づけ
• HTML Living Standardでも廃止されておらず、現在も有効なタグ

emタグの em は、英語の「emphasis（エンファシス＝強調）」の略です。HTMLの公式仕様であるHTML Living Standardでは、em要素は「その内容の強調（stress emphasis）を表す」と定義されています。

つまりemタグは、文章の中で「ここは語調を強めて読んでほしい」という部分を示すためのタグです。ブラウザで表示すると、囲んだ部分はデフォルトで斜体（イタリック体）になります。

基本的な書き方は次のとおりです。

<p>この機能は<em>一度だけ</em>実行してください。</p>

上のコードをブラウザで表示すると、「一度だけ」の部分が斜体で表示されます。読み手には「一度だけ、が特に大事なんだな」という強調のニュアンスが伝わります。

ここで最初に押さえておきたいのが、emタグの目的は「斜体にすること」ではなく「意味的に強調すること」という点です。見た目を斜体にしたいだけであればCSS（後述）でも実現できますし、逆に強調の意味を持たせずに斜体にしたい場面もあります。emタグは「その語句に強調という意味を与える」ために使う、と理解しておきましょう。

emタグは廃止されていない有効なタグ

「emタグは古いタグで、いまは使わないほうがよいのでは」と誤解されることがありますが、これは正しくありません。HTMLの現行仕様であるHTML Living Standardにおいて、em要素は現在も有効な要素として定義されています。廃止（非推奨）にはなっていません。

古いHTML（HTML4時代）では、emタグは単に「強調＝斜体」という表示上の意味合いで語られることもありました。しかし現行仕様では「意味的な強調（stress emphasis）」という役割がより明確に定義されており、SEOやアクセシビリティの観点からも意味を持つタグとして位置づけられています。安心して使って問題ありません。

emタグと似た強調タグの違い【早見表】

👉 このパートをまとめると！

• 「意味の強調」はem・strong、「見た目の装飾」はb・iが担当する
• em＝強調、strong＝重要性という役割の違いが使い分けの軸
• HTMLの <em> とCSSのサイズ単位「em」はまったくの別物

emタグを正しく使いこなすうえで避けて通れないのが、似た働きをする strong・b・i タグとの違いです。まずは全体像を1枚の早見表で確認しましょう。

ポイントは、縦に見ると「意味の強調（em・strong）」と「見た目の装飾（b・i）」の2グループに分かれることです。emとstrongは語句に意味を与えるタグ、bとiは見た目を変えるだけのタグ、という区別を頭に入れておくと、以降の使い分けがスムーズになります。

strongタグとの違い（強調と重要性）

emタグと最も混同されやすいのがstrongタグです。Googleサーチコンソールでもemタグとstrongタグの違いを調べる検索が多く、実務でつまずきやすいポイントといえます。

両者の違いは、担っている「役割」にあります。

• emタグ＝その語句を「意味的に強調する（emphasis）」。語調を強めるニュアンス。
• strongタグ＝その語句が「周囲より高い重要性を持つ（strong importance）」ことを示す。

MDN（Mozillaが提供するWeb技術の公式ドキュメント）でも、「周辺のテキストよりも高い重要性を持つテキストを示すためには、strong要素を使用してください」と明記されています。

具体例で考えてみましょう。

<!-- 語調を強める（強調） -->
<p>この操作は<em>絶対に</em>取り消せません。</p>

<!-- 重要性を示す（警告・要点） -->
<p><strong>データは事前にバックアップしてください。</strong></p>

前者は「絶対に、という部分を強めて読んでほしい」という強調です。後者は「この一文全体が重要な注意事項だ」という重要性の提示です。見た目はemが斜体、strongが太字と異なりますが、本質的な違いは「強調のニュアンス」か「重要性の提示」かという役割にあります。

使い分けの目安としては、注意喚起や要点など「重要だから見落とさないでほしい」箇所にはstrong、文章のリズムの中で「この語を強めて読んでほしい」箇所にはem、と考えるとよいでしょう。より詳しいstrongタグの使い方は、関連記事「HTMLのstrongタグとは？bタグとの違いや使い方・注意点を解説」もあわせてご覧ください。

bタグとの違い（意味の強調か、見た目の太字か）

bタグ（<b>）は、文字を太字にするためのタグです。見た目はstrongと同じ太字ですが、決定的に違うのはbタグには「意味づけ」がない点です。

• emタグ＝意味的に強調する（斜体＋強調の意味）
• bタグ＝見た目を太字にするだけ（意味は持たせない）

HTMLの仕様上、bタグは「特別な重要性や強調の意味を持たせずに、視覚的に他と区別したい語句」に使うものと位置づけられています。たとえば製品名やキーワードを、意味的な重みは加えずに単に目立たせたい、というケースです。

一方でemタグは「強調」という意味を語句に与えます。したがって、「この語句に強調のニュアンスを持たせたい」ならem、「意味は変えずに見た目だけ目立たせたい」ならb（あるいは後述するCSS）、という判断になります。

iタグとの違い（強調か、単なる区別か）

iタグ（<i>）は、emタグと同じく見た目が斜体になるため、特に混同されやすいタグです。しかし意味づけはまったく異なります。

MDNでは両者の違いが次のように説明されています。「デフォルトでは、視覚的な結果は同じです。しかし、意味論的な意味合いは異なります。em要素はその内容を強調することを表しますが、一方でi要素は、外来語、架空の登場人物の考え、用語の定義を表す文字列など、通常の文章から外れた文字列を表します」。

整理すると次のようになります。

• emタグ＝意味的に「強調」する斜体
• iタグ＝強調ではなく、「本文とは性質が異なる語句（外来語・専門用語・書名・心の声など）」を区別するための斜体

<!-- 強調したい（em） -->
<p>締め切りは<em>今日</em>です。</p>

<!-- 外来語・専門用語を区別したい（i） -->
<p>この現象を<i>ハレーション</i>と呼びます。</p>

見た目が同じでも、「強めて読んでほしい」のか「性質の違う語句として区別したい」のかで使うタグが変わります。強調の意味があるならem、単なる区別ならi、と覚えておきましょう。

CSSのサイズ単位「em」との違い（混同しやすいポイント）

初心者が最も混乱しやすいのが、HTMLの <em> タグと、CSSで使う長さの単位「em」の混同です。名前が同じ「em」ですが、この2つはまったくの別物です。

• HTMLの <em>＝文章を意味的に強調するタグ
• CSSの em＝フォントサイズなどを指定する相対的な長さの単位

CSSの em は、親要素のフォントサイズを基準にした相対単位です。たとえば font-size: 1.5em; は「親要素のフォントサイズの1.5倍」という意味になります。文字を強調することとは一切関係がありません。

/* CSSのem単位＝長さの指定。強調とは無関係 */
.lead { font-size: 1.2em; }  /* 親の1.2倍のサイズ */

「強調のタグ（HTMLの <em>）」と「サイズの単位（CSSの em）」は、名前が同じだけの別概念です。コードを読むときは、それがHTMLタグなのかCSSの数値の単位なのかで区別しましょう。

emタグのHTMLでの使い方・コード例

👉 このパートをまとめると！

• 基本は <em>強調したい語句</em> で囲むだけ、開始タグと終了タグの両方が必要
• emタグは入れ子（ネスト）にでき、重ねた段階に応じて強調度が段階的に強まる
• 斜体の解除や色付けなど、見た目はCSSで自由に変更できる

ここからは、emタグの具体的な書き方を見ていきます。基本形から、入れ子（ネスト）、CSSによる見た目の調整まで順に解説します。

基本の書き方

emタグは、強調したい語句を <em> と </em> で囲むだけで使えます。開始タグ（<em>）と終了タグ（</em>）の両方が必要で、どちらも省略できません。

<p>お申し込みは<em>本日中</em>にお願いします。</p>

長い一文をまるごとemで囲むこともできますが、強調の効果は「一部を絞って使う」ほうが際立ちます。文章全体を強調するとどこが要点かわからなくなるため、強調したい語句だけをピンポイントで囲むのが基本です。

入れ子（ネスト）で強調度を段階的に強める

emタグには、他のタグにはない特徴的な仕様があります。それは入れ子（ネスト）にすると、重ねた段階に応じて強調の度合いが強まるというものです。

HTML Living Standardでは「ある内容が持つ強調のレベルは、その祖先にあるem要素の数によって決まる」と定義されています。MDNでも「em要素は入れ子にすることができ、入れ子の段階に応じてより強い程度の強調を表すことができます」と明記されています。

<p><em>この設定は<em>絶対に</em>変更しないでください</em>。</p>

この例では、外側のemで一文全体を強調しつつ、内側のemで「絶対に」をさらに強く強調しています。文章の中で「強調の中でも、特にここ」という段階的なニュアンスを表現したいときに使えます。

ただし、入れ子は多用すると構造が読みにくくなります。実務では2段階程度までにとどめ、必要な箇所に限って使うのがおすすめです。

CSSでemタグの見た目を変える方法（斜体の解除など）

emタグはデフォルトで斜体になりますが、この見た目はCSSで自由に変更できます。「強調の意味は持たせたいが、デザイン上は斜体にしたくない」という場合は、CSSで斜体を解除できます。

/* emの斜体を解除し、太字＋色で強調する例 */
em {
  font-style: normal;   /* 斜体を解除 */
  font-weight: bold;    /* 太字にする */
  color: #c00;          /* 文字色を変える */
}

このように、font-style: normal; を指定すれば斜体が解除され、代わりに太字や色でデザインを整えられます。ここで大切なのは、「意味づけはHTMLのemタグが担い、見た目はCSSで整える」という役割分担です。見た目を変えたいからといって、意味のないところにemタグを使うのは避けましょう。装飾だけが目的なら、後述のとおりbタグやiタグ、あるいはCSSのクラスで対応するのが適切です。

emタグとSEOの関係｜SEO効果の結論

👉 このパートをまとめると！

• emタグ単体に「順位が上がる」ような直接的なSEO効果は確認されていない
• Googleはstrongとb、emとiをそれぞれ同等に扱うとされ、タグの種類で優劣はつかない
• 過剰使用はスパムと見なされるリスクがあり、見出し（hタグ）内での強調タグ併用も避ける

「emタグを使うとSEOで有利になるのか」は、多くの方が気になるところです。結論から言うと、emタグ単体に「検索順位が上がる」といった直接的なSEO効果は確認されていません。過度な期待は禁物ですが、正しく使うこと自体には意味があります。順を追って説明します。

em・iとstrong・bはGoogleに「同等」に扱われる

Googleは、これらの強調タグの扱いについて過去に見解を示しています。GoogleのMatt Cutts氏は2013年の公式動画で、ランキングの観点では「strongタグとbタグは同じように扱われる」「emタグとiタグも同じように扱われる」という趣旨を述べています。

つまり、「strongを使うかbを使うか」「emを使うかiを使うか」で検索順位に差が出るわけではない、というのがGoogle側の説明です。強調タグの種類そのものが順位を左右するわけではない、と理解しておきましょう。

なお、太字などの強調が検索エンジンの理解を助ける可能性については、GoogleのJohn Mueller氏が2021年に「段落内の重要な箇所を太字にすることはSEOに役立つか」という問いに対し、「役立つ」と肯定的に回答しています。ただし同氏は、ページ全体を太字にすると意味がなくなり、あくまで一部を絞って強調することでGoogleがページの要点を理解しやすくなる、という相対的な効果である点も補足しています。emタグを含む強調は「順位を押し上げる魔法」ではなく、「ページの内容を正しく伝えるための一手段」と捉えるのが実態に即しています。

（※Matt Cutts氏の発言は2013年時点のものであり、あくまで参考情報です。現在のGoogleの評価ロジックが完全に同一である保証はありませんが、「タグの種類で優劣をつけない」という基本的な考え方は現在の各種発信とも整合しています。）

過剰使用・乱用の注意点（スパム認定・見出し内併用NG）

SEO効果を狙って強調タグを乱用するのは逆効果です。実務上、次の2点には特に注意してください。

1. 強調タグの過剰使用はスパムと見なされるリスクがある

キーワードを目立たせようとして、ページ内の多くの語句をemやstrongで囲むと、かえって不自然なページになります。強調が多すぎると「どこが本当に大事なのかわからない」状態になり、ユーザー体験を損ねるだけでなく、検索エンジンからも不自然なマークアップ（スパム的な手法）と受け取られる可能性があります。強調は「本当に強調すべき箇所だけ」に絞るのが鉄則です。

2. 見出し（hタグ）の中で強調タグを併用しない

<h1> 〜 <h6> の見出しタグは、それ自体がすでに「見出し」という重要な意味を持っています。その中でさらにemやstrongを使うのは、意味の重複になり適切ではありません。見出しの中の一部を強調しようとしてstrongやemを入れ子にするのは避け、見出しは見出しタグだけで完結させましょう。見出しの書き方そのものについては、関連記事「SEOに強い見出し（hタグ）の書き方・例文・順番・文字数などの使い方を紹介」も参考にしてください。

アクセシビリティ視点でのemタグ

👉 このパートをまとめると！

• emタグには暗黙のARIAロール「emphasis」があり、意味的な強調として認識される
• スクリーンリーダーはemで囲まれた語句を語調を強めて読み上げる
• 「意味の強調」はem・strong、「見た目だけの装飾」はb・iやCSSと使い分けるのが適切

emタグの価値は、見た目やSEOだけではありません。アクセシビリティ（誰もが情報にアクセスできること）の観点でも意味を持つのが、装飾用のbタグ・iタグとの大きな違いです。ここは多くの解説記事で触れられていない重要なポイントなので、少し詳しく見ていきましょう。

スクリーンリーダーはemをどう読み上げるか（ARIAロール＝emphasis）

視覚に障害のある方などは、画面の文字を音声で読み上げる「スクリーンリーダー」を使ってWebページを閲覧することがあります。このとき、emタグは音声読み上げに影響を与えます。

MDNによると、emタグには暗黙のARIAロールとして「emphasis（強調）」が割り当てられています。ARIAロールとは、要素がどんな役割を持つかを支援技術（スクリーンリーダーなど）に伝えるための仕組みです。emタグを使うと、明示的に指定しなくても「ここは強調である」という情報が支援技術に伝わります。

その結果どうなるか。MDNは「このテキストを読む人やソフトウェアは、イタリック体の単語を、語調を強調して発音するでしょう」と説明しています。つまり、スクリーンリーダーはemで囲まれた語句を、周囲より語調を強めて読み上げるのです。

一方、見た目だけを斜体にするiタグや、CSSで斜体にしただけの文字には、この「強調」という意味づけがありません。そのため、目で見ている人には同じ斜体に見えても、音声で聞いている人にはニュアンスが伝わらない、という差が生まれます。「強調の意味を、目で見る人にも耳で聞く人にも等しく届けられる」のがemタグの強みです。

「見た目の強調」と「意味の強調」の使い分け判断表

ここまでの内容を踏まえ、「このケースはどのタグを使うべきか」を判断できる早見表にまとめます。マークアップに迷ったときの指針として活用してください。

判断のコツはシンプルです。「その語句に意味的な強調・重要性を持たせたいか」を先に考えること。意味を持たせたいならem（強調）かstrong（重要）、見た目を整えたいだけならbやi、CSSを使う——この順で考えれば、多くのケースで迷わず選べます。

emタグに関するよくある質問（FAQ）

👉 このパートをまとめると！

• emタグ単体でSEO順位が上がるわけではないが、正しく使う意味はある
• 強調のニュアンスを与えたい語句に、絞って使うのが適切
• 入れ子は可能だが多用は避け、斜体解除など見た目はCSSで調整する

最後に、emタグについてよく寄せられる質問をまとめます。

Q. emタグにSEO効果はありますか？

emタグ単体で検索順位が上がるといった直接的なSEO効果は確認されていません。Googleはemとi、strongとbをそれぞれ同等に扱うとしており、タグの種類で優劣はつかないとされています。ただし、強調を適切に使うことで文章が読みやすくなり、ユーザー体験の向上につながる点には意味があります。SEOのためというより、読み手のためのマークアップと捉えるのが適切です。

Q. emタグはどこに使うのが適切ですか？

文章の中で「語調を強めて読んでほしい」語句に使うのが適切です。逆に、注意喚起や要点など「重要だから見落とさないでほしい」箇所にはstrongタグが向いています。どちらも「本当に強調すべき箇所」に絞って使い、ページ全体で乱用しないことが大切です。

Q. emタグは入れ子（ネスト）にして使っても大丈夫ですか？

問題ありません。HTMLの仕様上、emタグは入れ子にでき、重ねた段階に応じて強調度が段階的に強まります。ただし、入れ子を多用すると構造が読みにくくなるため、実務では2段階程度にとどめ、必要な箇所に限って使うのがおすすめです。

Q. emタグの斜体を解除するにはどうすればよいですか？

CSSで font-style: normal; を指定すれば斜体を解除できます。emタグは「強調」という意味づけを担い、見た目はCSSで整えるという役割分担が基本です。斜体を解除したうえで、太字や色で強調を表現することもできます。

Q. HTMLの <em> とCSSの「em」は同じものですか？

まったくの別物です。HTMLの <em> は文章を強調するタグ、CSSの em はフォントサイズなどを指定する相対的な長さの単位です。名前が同じ「em」ですが、役割に関連はありません。

まとめ｜emタグは「意味の強調」を担うタグ

👉 このパートをまとめると！

• emタグは語句を意味的に強調するタグで、見た目の斜体は結果にすぎない
• 意味の強調はem・strong、見た目の装飾はb・iやCSSと役割分担する
• アクセシビリティ上も価値があり、乱用を避けて必要な箇所に絞って使う

emタグについて、要点を振り返ります。

• emタグは「意味的な強調（emphasis）」を表すタグ。デフォルトで斜体になるが、目的は装飾ではなく意味づけ。HTML Living Standardでも有効なタグ。
• 使い分けの軸は「意味か見た目か」。意味を持たせたいならem（強調）・strong（重要性）、見た目だけ整えたいならb・iやCSS。
• 入れ子で強調度を段階的に強められるが、多用は避ける。見た目はCSSで自由に調整できる。
• SEO効果は直接的なものは確認されていない。emとi、strongとbは同等に扱われる。過剰使用と見出し内併用は避ける。
• アクセシビリティ上も価値がある。スクリーンリーダーはemを語調を強めて読み上げるため、強調の意味を耳で聞く人にも届けられる。

強調タグは、種類ごとの役割を理解して使い分けることで、読み手にもクローラーにも支援技術にも、正しく意図を伝えられるようになります。まずは「意味の強調（em・strong）」と「見た目の装飾（b・i・CSS）」の線引きから意識してみてください。HTMLタグ全般の基本を確認したい方は、関連記事「HTMLの書き方の基本とよく使うタグの使い方を解説｜初心者向け」もあわせてご覧ください。

なお、こうしたHTMLの正しいマークアップは、内部SEOの土台となる要素の一つです。「タグの使い方も含めて、自社サイトの内部SEOを一度きちんと見直したい」という場合は、GMO TECHのSEO対策サービスでもご相談を承っています。正しいマークアップの整備から検索評価の改善まで、専門家の視点でサポートします。