【HTML】SEO的にNG?やってはいけない「改行」を”2つ”紹介するよ!

【HTML】SEO的にNG?やってはいけない「改行」を”2つ”紹介するよ!
スポンサーリンク

ウォークマンのスポーツタイプが欲しい!四条せつなです。

ブログ更新やWeb制作で、必ず使うのが「改行」ですよね?brタグや、pタグを使用して、上手く文章の体裁を整えたりすると思います。…ですが!あなたの使っている改行方法が間違っているかもですよ?もし、間違った改行をしていると、SEO的に不利になったりします。

四条ねこ
ええーー!?ってなるよね!
だから、正しい「改行」方法を教えるよっ!!!

この記事では、間違った改行方法を2つ紹介しますそして、最後に正しい改行の方法を紹介しますので、良かったら最後まで見ていってくださいね!

正しい改行をしないとSEO的に不利なる?

正しい改行をしないとSEO的に不利なる?

Web制作の初心者や、HTML・CSSについて詳しく知らないブロガーさんが陥りやすいのが、「改行」の誤った使用方法だと思います。

四条ねこ
え?改行に正しいとか、間違ってるとかあるんだ!

HTMLで書かれたものも、ある種「文章」なんですよ。だから、正しい文法に則って、改行をしていかなければならないっていうことになるんです。

四条ねこ
ふむふむ…
だから文法がおかしいサイトに関しては、Googleの評価が下がるんだね!

正しいHTMLの文法について書き出すと、1記事で収まらないんです。だから、今回はタイトルの通り、「改行」について書いていくことにします。「改行」でよく誤って使われる”2つの方法”をこれから紹介していきますね!

間違い1:brタグを”連続”で使ってはいけない

brタグを"連続"で使ってはいけない

1つ目は、brタグの連続使用です。

四条ねこ
例えば、
<br>
<br>
<br>
な感じだね!

よく、文字の間隔を空けたり、言葉に余韻を持たせたいときに使用されている気がします。だけど、これはHTMLの文法的に誤った使い方です!

連続brを日本語的にすると…?

連続brを日本語的にすると…?

無理やりではあるけど、この“連続br”での改行を視覚的に理解しやすいように、「原稿用紙」で同じ文法を書いてみました。

四条ねこ
んん!?
めっちゃ違和感!!

連続改行を実際に原稿用紙に書いた風にすると、凄く違和感があることに気づくと思います。こんな日本語を書く人はいないハズ!

四条ねこ
こんな風に作文書いたら、先生にめっちゃ怒られそう(笑)

連続brは使わないこと!

つまり、連続でbrタグを使用するのは、おかしいことが分かりますよね。正しい文法を書いてあげないと、Googleは評価を下げるので、この連続brは使わないようにしましょう。

四条ねこ

だって、地球上に男は何人いると思っているの?<br>
…35億<br>

こういう改行は、連続brにならないよ!

間違い2:空のpタグ(<p>&nbsp;</p>)を使ってはいけない

空のpタグ(<p> </p>)を使ってはいけない

2つ目は、空のpタグ(<p>&nbsp;</p>)の使用です。

四条ねこ
例えば、
<p>ほげほげ</p>
<p>&nbsp;</p>
<p>ふがふが</p>
な感じだね!

連続brがダメって、理解している人が陥りやすいパターンです。確かに連続改行はしていないけど、これもHTMLの文法的に誤った使い方です!

四条ねこ
ちなみに、「&nbsp;」は「区切りなしスペース」を意味するよっ!

空pタグを日本語的にすると…?

空pタグを日本語的にすると…?

またまた、この“空のpタグ(<p>&nbsp;</p>)”での改行を視覚的に理解しやすいように、「原稿用紙」で同じ文法を書いてみました。

四条ねこ
パッと見いけそうだけどなぁ…

この改行方法の問題は、pタグの意味を無視してることです。pタグは「パラグラフ」という意味なので、単に改行する意味で使用するものではありません。ですので、中には文章が入っていることが、当たり前なんですね。そう考えると、文字の入っていない(「&nbsp;」は入っているけど)パラグラフは、日本語的におかしいということが分かってくれると思います。

四条ねこ
しかも、パラグラフだから最初の1マス空けるって…なんだそりゃ(笑)

空pタグは使わないこと!

つまり、空のpタグ(<p>&nbsp;</p>)を使用するのは、おかしいことが分かりますよね。コレに関してのSEO的な影響は、もしかすると連続brよりはマシかもしれません。だけど、使用を避けたほうが”無難”ですよ!

四条ねこ

<p>&nbsp;</p>

<p></p>
もダメだからね!

<p>&nbsp;</p>よりも、<p></p>はもっとダメですよ!注意!

正しい改行の例

正しい改行の方法を、下に例文に書いてみたので参考にしてみてくださいね!

基本はpタグとbrタグで対応する

基本は、<p>〜</p>タグの中に、<br>タグを用いて「改行」をしていくのがセオリーになります。

四条ねこ
例文は上の“普通に文章を書く場合”のところに書いてあるよー!

どうしてもな場合はCSSで対応する

どうしても、何行も改行をしたい場合もあると思います。そういうときは、CSSで対応するようにしましょう。marginで改行(っぽく)見せることができますよ!

四条ねこ
これは上の“どうしても改行を大きくしたい場合”を参考にしてねー!

せつなのまとめ

連続改行をしたくなる場合はあります。だけど、brのタグの連続使用や、空のpタグは使ってはいけないってことですね。HTMLで考えると難しいかもですが、日本語の文法で考えると、分かりやすいかもしれません。SEOの観点からも、正しい文法で改行をするようにしたいですね。

四条ねこ

つまりは…

  • 連続brタグはNG!
  • 空pタグもNG!
  • 正しい文法で書かないとSEO的に不利!
  • どうしてなときは、marginで対応。

って、ことだねっ!

ということで、“【HTML】SEO的にNG?やってはいけない「改行」を”2つ”紹介するよ!”でした!でわでわっ!

スポンサーリンク

1 個のコメント

  • コメントを残す

    メールアドレスが公開されることはありません。 * が付いている欄は必須項目です