SEO対策の東京SEOメーカー

strongタグとは? 意味や使い方、bタグとの違いを解説

strongタグとは? 意味や使い方、bタグとの違いを解説strongタグとは、ページ内のテキストのなかで重要性が高い箇所を指定するHTMLタグのことです。そして、指定されたテキストは太字で描画されます。その一方で、bタグやemタグ、iタグといった類似タグが存在します。

 

Mozilla公式サイトのMDN Web Docsでも指摘されていますが、strongタグと類似タグの混同のほか、デザインを司るCSSの代用としてstrongタグが使われるトラブルが多々あります。WEBページを作成する際は、各種タグの機能性、さらにHTMLとCSSの役割をしっかりと理解することが大切です。

 

SEOコンサルタント今回は、strongタグについて解説します。HTMLの初心者に向けて、SEO専門メディアの東京SEOメーカーがわかりやすく説明します。本記事を最後まで読んで、strongタグとbタグの違いを理解して、strongタグの正しい記述方法を身につけてください。

 

コンテンツ悩み解消

strong(ストロング)タグとは

strong(ストロング)タグとは、一部のテキストを強調するためのHTMLタグのことです。strongタグで指定したテキストは、ブラウザ上で太字で表示されます。

 

WEB標準で、Mozilla公式サイトのMDN Web Docsでは、strongタグについて次のように説明されています。

 

 

<strong>はHTMLの要素で、内容の重要性、重大性、または緊急性が高いテキストを表します。ブラウザーは一般的に太字で描画します。

 

引用:<strong>: 強い重要性要素 – HTML: ハイパーテキストマークアップ言語 | MDN

 

strongタグで囲ったテキストの意味が強調される

strongタグは、デザイン上の都合で目立たせたいテキストに利用されるケースが間々あります。しかし、strongタグは、テキスト内容が重要であることを伝える役割を担います。本来は、テキストが有する意味の重要性を訴えたい際に使用するべきタグです。

 

そもそもHTMLとは

HTMLとは、ハイパーテキスト マークアップ ランゲージ(Hyper Text Markup Language)の略で、WEBページを作成するためのマークアップ言語を指します。

 

このHTMLとCSS(カスケーディング スタイル シート / Cascading Style Sheet)の2つでWEBサイトがコーディングされて、ブラウザ上で視覚化されるようになります。つまり、HTMLとCSSは、サイト訪問者が直接触れる、フロントサイドの部分を司る役割の言語ということです。

 

関連記事:HTMLとは

 

関連記事:CSSとは

 

storngタグに類似するHTMLタグとCSSの値

strongタグと類似するタグが存在します。HTMLタグのbタグやemタグ、iタグのほか、CSSの値であるboldが挙げられます。

 

 

タグと値 言語 機能性
 strong HTML 太字表記して、意味を強調する
 b HTML 太字表記するが、意味を強調しない
 em HTML 斜体表記して、意味を強調する
 i HTML 斜体表記するが、意味を強調しない
 bold CSS フォントデザインを太字に変更する

 

bタグとの違い

bタグとstrongタグの違いは、テキスト内容が重要であることを検索エンジンに伝えるか否かという点です。bタグは、テキストを太字表示する機能を持ちますが、テキストの意味を強調することはありません。

 

emタグとの違い

emタグとstrongタグの違いは、テキストの表記方法が異なる点です。具体的には、前者ではテキストが斜体表記で強調されますが、後者では太字表記で強調されます。なお、emタグは、strongタグと同様に、テキストの意味を強調する機能を有します。

 

関連記事:emタグとは

 

iタグとの違い

iタグとstrongタグの違いは、テキストの強調方法に加えて、テキストの意味を強調するか否かという2点です。emタグでは、指定したテキストを斜体表記しますが、テキストの意味を強調しません。

 

CSSの太字(bold)との違い

CSSによるboldとstrongタグは、そもそも利用する言語が異なります。そのため、言語としての根本的な役割が違います。

 

まず、HTMLは、WEBページの構成を指示する言語です。対して、CSSでは、WEBページを装飾するデザインを指定します。サイト訪問者に対して、特定のテキストを目立たせたいのであれば、strongタグではなく、CSSでboldの値を利用する方法が適切ということです。

 

strongタグのSEO効果

strongタグは、検索エンジンに「このテキストは重要な意味を持つ」ことを知らせる機能を有します。ただし、現実的には、strongタグを利用することで検索順位が高まることはありません。

 

実際に、GoogleがWEBマスター向けに配信する、Youtubeの公式チャンネルGoogle Search Centralの動画にて、「Googleはstrongタグとbタグを同じように扱っている」と言及しています。

 

 

strongタグの注意点

strongタグを使ううえで、次の点に注意してください。

 

  • strongタグをデザイン目的で使用しない
  • strongタグを多用しない
  • strongタグを見出しタグに使用しない

 

strongタグをデザイン目的で使用しない

strongタグは、強調タグですのでデザイン目的で使用しないでください。現実的には、CSSの代用としてstrongタグで文字を強調したとしても、トラブルに発展することは極めてまれです。

 

ただし、HTMLの文法として誤っています。問題点は、strongタグと装飾を混同して使っているケースです。まずは、HTMLとCSSにおける、それぞれの役割を正しく認識することが大切です。

 

strongタグを多用しない

strongタグを多用することは避けてください。strongタグを多用すると、WEBページのなかで、どこを強調したいのかがわかりにくくなります。結果として、検索エンジンと検索ユーザーともに、理解しにくいページ構成と捉えられてしまいます。

 

そもそも、strongタグは、ページ中において、相対的に重要なテキストを強調するタグです。そのため、strongタグを多用することに意味がありません。むしろ、検索エンジンにスパム行為と判断されて、ペナルティを与えられる原因になりえますので注意してください。

 

strongタグを見出しタグに使用しない

h1、h2、h3といった見出しタグには、strongタグを使わないでください。見出しタグは、ページ構成の骨子となる部分です。HTML上で、もっとも強調するテキストとして扱われます。そのため、strongタグを反映すると、過剰にテキストを強調することになります。見出しタグにstrongタグを使用する行為は、利点がないだけでなく、リスクになりえます。

 

関連記事:見出しとは

 

strongタグの使い方

テキスト内容が重要であることを伝えたい場合は、strongタグを利用してください。strongタグの使い方と書き方は、下記のとおりです。

 

たとえば、次のようなテキストがあったとします。

 

 

20代はポテンシャルを買われることが多いため、転職活動を有利に進められます

 

 

このテキストのなかで、「ポテンシャルを買われる」部分にページ構成上の重要性があれば、ここをstrongタグで囲います。具体的には、<strong> 〜 </strong>で文字を太くしたい文章を囲みます。

 

 

<p>20代は<strong>ポテンシャルを買われる</strong>ことが多いため、転職活動を有利に進められます。</p>

 

CSSでテキストを装飾したいときの書き方

デザイン上の都合でテキストを目立たせたいときは、CSSを利用してください。CSSで文字を強調する書き方は、次のとおりです。

 

CSSファイルに下記のコードを追加します。

 

 

span.bold-txt {font-weight: bold;}

 

 

HTMLファイルのテキストに、下記のspanタグとクラス指定を記述します。

 

 

<p>20代は<span class="bold-txt">ポテンシャルを買われる</span>ことが多いため、転職活動を有利に進められます。</p>

 

 

さらに、クラス指定を使わず、HTMLのstyle属性を用いて直接的にテキストを装飾することもできます。

 

 

<p>20代は<span style="font-weight: bold;">ポテンシャルを買われる</span>ことが多いため、転職活動を有利に進められます。</p>

 

 

また、テキストを目立たせる方法として、colorプロパティを用いて文字の色を変える手法も効果的です。

 

 

<p>20代は<span style="color: red;">ポテンシャルを買われる</span>ことが多いため、転職活動を有利に進められます。</p>

 

strongタグのよくある質問

strongタグに関する、よくある質問をまとめています。
 

Q:strongタグを多用すると、テキストの価値が高まりますか?

Answer)strongタグをたくさん使用したからといって、テキスト全体の価値が高まるわけではありません。strongタグは、ページ内のテキストを相対的に強調する役割のタグです。そのため、多用すると、テキスト中のどこが重要な部分かがわからなくなります。

 

Q:strongタグは廃止されたのですか?

Answer)strongタグは、廃止されていません。2023年12月現在でもHTMLタグとして利用できます。

 

Q:strongタグを使うとペナルティを受けますか?

Answer)原則として、strongタグを使うことでペナルティを受けることはありません。

 

これはstrongタグに限った話ではありませんが、strongタグを乱用するとスパム判定の対象となりえますので注意してください。

 

 

まとめ

SEOコンサルタントstrongタグは、ページ内のテキストを強調するHTMLタグです。類似タグとしてbタグやemタグ、iタグが存在しますが、それぞれ機能性が異なりますので注意してください。また、テキスト内容を強調するのではなく、デザインで装飾することが目的であればCSSを利用してください。さらに、CSSを利用することで、テキストの太字表示だけでなく、フォントカラーを変更して文字の色を変えることもできます。目的に応じて、それぞれのタグや言語を使い分けるように努めてください。

 

 

この記事の監修者

SEOコンサルタント

アドマノ株式会社 代表取締役 天野 剛志

日本大学法学部卒業、広告代理店で12年間働いている間、SEOと出会い、SEO草創期からSEO研究を始める。SEOを独学で研究し100以上のサイトで実験と検証を繰り返しました。そのノウハウを元に起業し現在、11期目。営業、SEOコンサル、WEB解析(Googleアナリティクス個人認定資格GAIQ保持)コーディング、サイト制作となんでもこなす。会社としては今まで2000以上のサイトのSEO対策を手掛けてきました。

監修者:アドマノ株式会社 代表取締役 天野剛志
マーケティングのエキスパート。Googleアナリティクス個人認定資格GAIQ保持。大学では経営法学を専攻。オーストラリア・イタリア・フランス・タイ・カンボジアなど世界各国を旅した後、イギリスで1年半生活し語学力と国際的視野を磨く。日本帰国後は広告代理店で営業を12年経験。SEOは草創期から独学で研究し、100以上のサイトで検証しつつノウハウを蓄積。2012年にSEO専門会社のアドマノを設立。
facebookで共有 Xで共有 LINEで共有

新着記事

人気記事

WEBマーケティング

SEO対策