SEO対策を行う上で、HTMLの記述にも気を配らなければいけないのではもうご存じですよね。
今回は、SEO対策を行う上で<span>タグはどういった効果をもたらすのか、どのように使うべきなのかを解説します。<span>タグについても説明するので、HTMLを書く時に参考にしてみてください。
<span>タグとは
<span>タグ自体に意味はありません。
しかし、<span>タグで要素を囲むことによって、グルーピングできるタグになります。
また、<span>タグはインライン要素になります。インライン要素とは、大きさや幅が囲まれている要素以上になることはありません。
<div>タグなどのブロック要素と違って、指定されている横幅いっぱいに広がっている要素ではないので、テキストだと改行がおこらず見た目の変化がないのです。
例えば、「<span>タグ」というテキストだけ赤字にしたいとき
1 2 3 4 5 6 |
<p> <span style=”color: red;”> <span>タグ </span> はSEO対策に効果をもたらすのか </p> |
と記載することで、「<span>タグ」というテキストだけ赤字にすることができるのです。
結論、関係ない
では、SEO対策を行うときはどうなのでしょうか。
先ほどいったように、<span>タグ自体に何も意味がないので、クローラーの評価には何も関係ありません。
ただ、だからといって<span>タグで装飾やテキストを構成するのは良くありません。ユーザーには、サイトのデザインで見てほしい場所がわかっても、クローラーにはその意図が伝わらないからです。
太字で強調したいとき <strong>タグ・<em>タグ
<strong>タグや<em>タグを使えば、太字になり、ユーザーにもクローラーにも強調したいところを理解してもらえます。
ただし、何でもかんでも強調するのはよくありません。1ページに5個以下にすると良いでしょう。
ちなみに、<em>タグは、ブラウザによっては斜体になってしまうので気を付けて下さい。
テキストを入力したいとき <p>タグ
<p>タグの中に<span>タグがあっても、それは<p>タグとしてサイト内のテキストだと、クローラーに認識してもらえます。
しかし、<span>タグだけに囲まれたテキストは、クローラーがちゃんと認識してくれない可能性があります。
サイト内テキストはSEO評価にかかわってくるので、クローラーに誤解されないように、<span>タグだけに囲まれたテキストはあまり作らないようにしましょう。
<span>タグ使用はクローラーのことを考えて!
<span>タグは、要素を装飾する上でとても便利なタグですが、それはユーザー目線のデザイン面を考えたときだけです。
もちろん、SEO対策をする上でユーザーの見やすいよう・わかりやすいようにすることはとても大切ですが、クローラーもサイトを解析するので、無視できません。
<span>タグで全て済ませるのではなく、強調してみてもらいたいところや、ちゃんとテキストとして認識してほしいところは、しっかりと適切なタグを使用しましょう。そうすれば、クローラーにもサイトの良さを理解してもらえるので、おのずと評価も上がるでしょう。