SEO/SEM

HTMLのstrongタグとは?bタグとの違いや使い方・注意点を解説

HTMLのstrongタグとは?bタグとの違いや使い方・注意点を解説

Webサイトを見ていると、読みやすい記事と読みづらい記事にはっきりと差があることに気づきます。

読みやすい記事の特徴は、本文の中で何を一番伝えたいのかが明確になっているということです。

この記事では、伝えたい文言が読者の目につくように、指定した文字を強調する働きのある「strongタグ」を紹介します。

複雑なことはありませんが、使用するのとしないのでは、コンテンツの質を大きく左右するものとなりますので、ぜひマスターしてサイト制作に活かしてみてください。

SEOに悩むサイト担当者必見!世界最高水準のテクニカルSEOツール「Lumar」
Lumar

URLを入れるだけでサイト内部の問題を一括検出。
Googleと同じ視点でサイトクロール
大規模サイトでも手軽に高度なSEO分析ができます!

まずは無料デモクロールを試して、あなたのサイトの問題点を一括検出!

strongタグとは?

strongタグは、指定したテキストの内容が重要である旨を、ユーザーに対してや、GoogleやYahoo等の検索エンジンに対して明示するために使用します。

一昔前のホームページ作成言語であるHTML4.01では「より強い強調」という定義でしたが、最新のHTML5では「重要性のあるもの」という定義付けに変わりました。

strongタグを適切に使用することで、読者にとって読みやすい(ユーザビリティが高い)記事を制作することができます。

【例:strongタグがある場合】

大晦日のテレビ番組で最も歴史があるのは紅白歌合戦です。

【例:strongタグがない場合】

大晦日のテレビ番組で最も歴史があるのは紅白歌合戦です。

上記のように、特定のキーワードだけを目立たせることで、ユーザーは記事を流し読みしながらでも要点を掴めるようになります。

検索エンジンに対しても「強調したいキーワード」を伝えることができますが、SEO対策としての直接的な効果は明言されていません。

strongタグはSEO対策というよりも、ユーザーにとって閲覧しやすいページを作るために用いられることを覚えておきましょう。

strongタグとbタグの違い

strongタグとbタグは、強調したい文字を太字にして表示させるという点では共通しています。

この二つの決定的な違いは、以下の通りです。

  • strongタグ:検索エンジンに対して記事内にある特定のキーワードの重要性を伝えることができる
  • bタグ:検索エンジンに対してはキーワードの重要性を伝えることができない

strongタグは、検索エンジンに対しても、強調した単語がそのページ内で重要であると伝えることができます。

一方、bタグは、画面上は太字で強調できても検索エンジンに対してはその重要性を伝えることができません。

ただし、SEOの観点からは、strongタグもbタグも同様に扱われるという旨のことをGoogleが明言しています。

Back then,whenever we checked,strong and b were treated the exact same in terms of ranking and scoring(strongタグとbタグはランキングとスコアリングでは同じ扱い) and how they’re indexed and all that sort of stuff.

(参考:動画0:46より)

So the short answer is don’t worry about it.

As far as I know,Google will treat the strong and the bold the same(Googleではstrongタグとbタグは同等に扱うつもり) and the em and the italics the same.

(参考:動画1:31より)

引用:Is there a difference between the “strong” and “b” tags in terms of SEO?(Google Search Central公式チャンネル)

strongタグとbタグは、検索エンジンへの働きかけの有無に違いはありますが、基本的にほとんど差はないとお考えください。

strongタグの使い方

strongタグで記事の一部を強調したい場合には、HTML上で以下のように記載します。

<strong>○○</strong>

もし、「大晦日のテレビ番組で最も歴史があるのは紅白歌合戦です。」のうち、「紅白歌合戦」を強調する場合には、以下のような使い方となります。

大晦日のテレビ番組で最も歴史があるのは<strong>紅白歌合戦</strong>です。

上記のように、HTML上では強調したい単語をstrongタグとstrongタグで挟むのみです。

ただし、よくある人為的なミスとして、締めの/(スラッシュ)を忘れたり、strongのスペルを間違えたり、<>(記号の一方)を誤って消してしまったりなどには注意しましょう。

ちなみに、以下の例のように、strongタグを2重に使用することで内容の重要度を高めることも可能です。

チケットの有効期限は<strong><strong>2021年12月31日</strong></strong>となります。その期限をすぎると一切使えなくなるため注意が必要です。

strongタグのSEOの観点での注意点

strongタグの使い方で注意すべきポイントは、以下の2点です。

【注意点】

  • strongタグを必要以上に使わない
  • strongタグを見出しタグ内に入れない

strongタグを必要以上に使わない

strongタグの多用は、ブログやサイト初心者に多い傾向があります。

strongタグを使いすぎてはいけない理由としては、ユーザーが読みづらくなったり、どの情報が大切なのかわからなくなったりしてしまうためです。

【strongタグを使いすぎた場合の例】

大晦日のテレビ番組最も歴史があるのは紅白歌合戦です。

上記のように、1フレーズ内にstrongタグを使いすぎるとどの部分が重要なのかが伝わらず、ユーザビリティも低くなってしまいます。

strongタグを使用する目安としては、1記事内に1個~3個程度がおすすめです。

さらに、文章の中で結論にあたる単語や状況を表すフレーズに限定して使用すると、格段に見やすくなります。

もし、文中で単語の意味を強調したいわけではなく、単に商品名や固有名詞を記載する際に太字にしたいのであれば、strongタグではなくbタグを使用するようにしましょう。

ちなみに、WordPressのビジュアルエディターやテキストエディターにある「b」ボタンは、bタグではなくstrongタグにあたります。WordPressでbタグを使用する場合は、プラグイン「AddQuicktag」で設置してください。

strongタグを見出しタグ内に入れない

h1やh2などの見出しタグでは、既に文字が強調された状態です。見出しタグ内でstrongタグを使用すると、過度な強調とみなされるうえに、HTML上でも正しく表示されない恐れがあります。

見出しタグにstrongタグを用いるメリットは何もないので、わざわざリスクを冒してまで使用する人はいないと思いますが、念のため注意するようにしてください。

まとめ

当記事では、strongタグがコンテンツ内で強調したい単語や文章を、ユーザーや検索エンジンに対して伝える役割があることを説明しました。

ユーザーに「何を伝えたいのか」を明確にすることは、良質なコンテンツを作るうえで欠かせないポイントです。

その意味で、strongタグはコンテンツ作りにおいて非常に使い勝手のいいテクニックの一つと言えます。

もちろん、必要以上に使いすぎたり記述を間違えたりすれば、逆効果にもなりかねません。

strongタグの正しい使い方をマスターして、ユーザビリティの高いコンテンツ作りに活かしていきましょう。

SEO対策でビジネスを加速させる
seo-dash!bygmo

SEO対策でこんな思い込みしていませんか?

  • 大きいキーワードボリュームが取れないと売上が上がらない・・
  • コンサルに頼んでもなかなか改善しない
  • SEOはコンテンツさえ良ければ上がる

大事なのは自社にあったビジネス設計です。
御社の課題解決に直結するSEO施策をご提案します

無料資料請求はこちら

プロフィール
大澤 健人(おおさわ けんと)
GMO TECH株式会社 大澤 健人(おおさわ けんと)大澤 健人(おおさわ けんと)のFacebook
2012年より一貫して検索エンジン領域のコンサルティング業務に従事。 2017年にGMO TECH社に参画。営業組織の構築、新商材開発、マーケティング部門立ち上げをおこなう。 現在、MEOコンサルティング、SEOコンサルティング、運用型広告などSEM領域全体を統括し、 お客様の期待を超える価値提供を行うため日々、組織運営・グロースに奔走している。

Service Siteサービスサイト

CONTACT US

デジタルマーケティングに関することならお気軽にご相談ください

メルマガ登録

メールマガジンはこちらからご登録ください。

デジタルマーケティングに関するホットな情報をお届けいたします。

フォームからのお問い合わせ

GMO TECHへの業務依頼、発注を希望される方はこちらよりご連絡ください。

Please click to see profile.
dark_typeA_115x57.png