htmlで文字をふと文字にする方法｜bとstrongの違いを解説

htmlで文字をふと文字にする3つの方法を解説

HTMLで文字をふと文字に装飾する方法は、3つあります。

• strongタグ
• bタグ
• CSSのfont-weightプロパティ

どれもHTMLタグで文字を囲うことでふと文字にできます。

strongタグとbタグの違いとSEOへの影響

HTMLでマークアップする方法であるstrongタグとbタグは、それぞれのタグに与えられた意味合いが異なります。

strongタグは囲った部分を「重要性が高い部分」とGoogleに伝えるのに対し、bタグは囲った部分を「太字にする」という意味しかなく、単純に他のテキストと区別し読み手の注意を引くための装飾タグになります。2013年時点でGoogleはどちらを使用してもSEOに影響はないと回答しています。

とはいえ、キーワードに対して重要な意味を担う言葉を太字にする場合はstrongタグ、読み手に注目させたりテキストを区別したりする場合はbタグと覚えておきましょう。

引用元：MDN

参照：Google Webmasters YouTube（Is there a difference between the “strong” and “b” tags in terms of SEO?）

htmlで文字をふと文字にする時の最善策はCSS

strongタグとbタグによるSEOへの影響に違いはありませんが、ふと文字にする際は、CSSのfont-weightプロパティを使ったHTMLタグが最善策となります。なぜなら、検索エンジン上ではHTMLは文章構造を記述するための言語、CSSは文字を装飾するための言語として扱われているからです。

Googleは、ふと文字を使用することはSEOに役立つと言及しているため、検索エンジン上でコンテンツの良し悪しの判断材料としている可能性があります。つまり、文字を装飾する言語であるCSSを使うことが、テキスト上の重要部分を読者に注目させながら検索エンジンにも理解させる最善の方法なのです。

参照：English Google SEO office-hours from November 12, 2021

まとめ

文字をふと文字に装飾する方法は3つありますが、そのなかでもHTMLを対象の文字の前後に設置するだけのstrongタグやbタグは簡単に使用できます。

しかし、検索エンジンに「重要性を伝えている」と自然に理解される最善の方法は、CSSのfont-weightを使ったものです。HTML使用前にCSSのスタイルシートを設定する必要があるため、面倒に感じる方もいるかもしれません。ふと文字装飾を行う際はCSSを使ったタグを使用し、SEOへの影響を考慮しましょう。