bタグstrongタグ違い使い分けについて

3 min read
hiroweb developer

はじめに

HTML では、テキストを強調表示するために、<b>タグや<strong>タグを使用する。これらのタグは似たような見た目の表示をするが、それぞれ異なる目的と意味を持っている。

<b>タグとは

<b>タグは、テキストを太字にするため使用される。ただし、このタグは単に視覚的な装飾を提供するだけで、特別な意味や重要性は持たない。そのため、SEO やアクセシビリティの観点からはあまり推奨されない。

<p>これは<b>太字</b>のテキストです。</p>

<strong>タグとは

<strong>タグは、テキストを強調表示するために使用される。このタグは、テキストの意味を重要なものとして強調することを示している。そのため、SEO やアクセシビリティには影響がある。

<p>これは<strong>重要な</strong>テキストです。</p>

b タグと strong タグの違いや使い分け

<b>タグと<strong>タグの使い分けには、以下のような基準がある。

視覚的な装飾のみを提供したい場合は、<b>タグを使用します。
テキストの重要性や意味を強調したい場合は、<strong>タグを使用します。

  • <b>:視覚的な装飾のみ(太字)
  • <strong>:テキストの重要性や意味を強調
    読み上げなどに利用が期待される

strong タグ

入れ子にして重要性を変えることができる。

<p><strong>Warning.</strong> This dungeon is dangerous.
<strong>Avoid the ducks.</strong> Take any gold you find.
<strong><strong>Do not take any of the diamonds</strong>,
they are explosive and <strong>will destroy anything within
ten meters.</strong></strong> You have been warned.</p>

以下のような場合、<strong>タグを使用して「期間限定」を強調し、<b>タグを使用して「特別価格」を太字にしている。これにより、テキストの意味と視覚的な装飾が適切に表現される。

<p>こちらの商品は、<strong>期間限定</strong><b>特別価格</b>でご提供いたします。</p>

まとめ

テキストを単に太字にする場合は<b>、テキストを強調する場合は<strong>を使うことが望ましい。

余談

同じような立ち位置に<em>タグがある。<em>も強調を表すタグであるが、<em>タグは弱い強調を、<strong>タグは強い強調を表現するために使用される。

参考