Blogger ブログ

Bloggerではpタグが使えない！？brタグは自動でつく？？

Bloggerでブログを書くことにした理由で、デメリットとして紹介したタグの自動消滅＆自動挿入について、詳しく記載します。

pタグやbrタグの使い方は、SEO的にも大事らしいです。それよりもボク的にブログを書くルールがあるなら守ろうくらいに考えて、タグの使い方をしっかりしようと思い、使い始めたのですが……詳しくは流れで書きたいと思います。

pタグ？brタグ？

まず、pタグとbrタグについて軽く説明します。
（自分もそんなに詳しくないですが←）

pタグ

p要素は文書の段落を表します。
引用：できるネット　pタグの意味と使い方

実際にボクたちがブログを書くときにも、文章の段落はあるかと思います。"話は変わって"とかあれば、どう考えても段落が変わりますよね。

そういった段落を変えるためタグが、pタグになります。感覚的には"ここから～ここまで"みたいな感じで使います。

<p>実際にボクたちがブログを書くときにも、文章の段落はあるかと思います。"話は変わって"とかあれば、どう考えても段落が変わりますよね。</p>
<p>そういった段落を変えるためタグが、pタグになります。感覚的には"ここから～ここまで"みたいな感じで使います。</p>

こんな感じにpタグで、文章を囲うことで段落とします。

一般的にブログで段落って言うと、brタグを使って改行による段落でやってる人が多いです。昔の自分のブログはそうでした。（br連打）
FC2もBloggerもそうですが、基本的にエンターキーで改行＝brタグなので知らない人はそうなる以外にないですからね。

実際にボクたちがブログを書くときにも、文章の段落はあるかと思います。"話は変わって"とかあれば、どう考えても段落が変わりますよね。<br />
<br />
<br />
<br />
そういった段落を変えるためタグが、pタグになります。感覚的には"ここから～ここまで"みたいな感じで使います。<br />

こんな感じにpタグで囲わず、brタグで段落や空白を作るパターンがほとんどです。

正直、pタグで囲ったから偉いとか、brタグを連打してるから悪いって話はないと考えています。ソースさえ見なければ見た目上、わからないですからね。読みやすいようにbrで空白を作っているのは、読み手にとっては読みやすく、いいことだと思います。

ただ検索エンジンなどが読むときは、pタグで囲っていないと段落として判断しません。

実際にボクたちがブログを書くときにも、文章の段落はあるかと思います。"話は変わって"とかあれば、どう考えても段落が変わりますよね。<br /><br /><br /><br />そういった段落を変えるためタグが、pタグになります。感覚的には"ここから～ここまで"みたいな感じで使います。

どういうことかと言うと"br"で段落、空白を作った場合、上記のように検索エンジンから見ると段落も空白もないように見えます。結果、検索エンジンに内容を正確に伝えることができず、SEOに影響するらしいです。

実際のところ、検索結果に影響しているのかわかりません。しかし、文法上pタグで囲うことが正しいのであれば、それに越したことはないということで、ボクもしっかりと使っているという現状です。

文法も大事ですが、中身が面白いことが最優先だとは思うので絶対pタグを使うべき。とは言いませんが、CSSなどを用いてブログをデザインする際は、pタグを利用したほうが楽と言えば楽かもしれません。

brタグ

brタグ（br要素）は、段落分けを伴わない改行を表します。
引用：できるネット　brタグの意味と使い方

brタグは、pタグと違い単純な改行の意味になります。
例えば以下のように使うのが一般的です。

<p><b>brタグ</b>は、pタグと違い単純な改行の意味になります。<br />
例えば以下のように使うのが一般的です。</p>

pタグの中の文中にて強制的に改行したい場合、brタグを入れて改行しています。
よく自分は"←"とかを最後に使うとき、読みやすく改行するようにしています。

<p><b>brタグ</b>は、pタグと違い単純な改行の意味になります。<br />
<br />
<br />
<br />
例えば以下のように使うのが一般的です。</p>

pタグ内に入っているからと言って、この使い方がいいのか調べてみましたが、基本的にbrタグは連続して使用しないことになっているようなので、文法的にはNGだと思います。

ちなみに改行タグには<br(半角スペース)/>と<br>がありますが、Bloggerは<br(半角スペース)/>を使っているため、そちらで合わせることにしました。

Bloggerでタグを使ってみた

タグを使って書いてみたが

そんなこんなで、Bloggerのサービスでブログを書くときにタグを使ってみることにしました。タグを使って書くにはまず、"HTML"入力にします。そしてタグを書き込み、その中に文を書いていきます。

保存してソースを確認してみます。すると、しっかりpタグで囲われた文が確認できます。

いわゆる人間が見える状態で確認しても、しっかりと段落に分かれて表示されているのでpタグが効いていることがわかります。デフォルトでpタグ間に空白ができるようにしてあるので、見え方もバッチシです。

ボクはブログに画像を挿入するとき、画像自体をドラッグ＆ドロップします。この挿入方法がBloggerのいいところでもありますし、何より見た目でブログを作ることができるのでとても楽です。

ドラッグ＆ドロップするためには"作成"入力にしなければいけません。なので、作成をクリック……ん？なんか、HTML入力時と表示が違うような……

一度、そのまま保存してソースを確認すると、勝手にbrタグで整えられている状況……。そして何より、pタグどこいった。

もちろん、見え方もbrタグにより"改行"扱いになり、pタグは消えているので空白もなくなる。

"HTML"入力に戻しても、brタグで整えられ、pタグが消えた状態で保存されています。

Bloggerの仕様

Bloggerでブログを書くことにした理由でも少し触れましたが、入力切替を行うと、pタグが消えたり、brタグが生成されたりという仕様らしいのです。HTML入力でタグを入力できるようになっているのに、Googleは何をやっているんだ。

記事を書くところのオプションでbrタグを使用にチェックを入れることによって、エンターキーで改行になることを防ぐことができます。しかし、"作成"入力ではエンターキーで強制的に改行になります。つまり、オプションのここについては反映されるのは"HTML"入力のみで、結局、画像を挿入するために"作成"入力に切り替えると、pタグは消え、brタグが乱立し、エンターキーでbrタグが生成される状態になります。

対応策

入力方式	投稿内設定（brタグを使用） エンター入力時	pタグの使用	画像ドラッグ＆ドロップ
作成	無条件でbrタグが挿入	不可	可能
HTML	エンターキーによるbrタグ挿入なし	可能	不可

現状だと、上記表のようになっています。

画像はドラッグ＆ドロップで挿入したい。
pタグも使いたいし、brタグが無駄に入るのも防ぎたい。
この二つを対処する方法は2つあります。

1. “作成”と“HTML”入力を切り替えないで書く
2. テキストエディターなどで書いてから、HTML表示の状態でコピペする

“作成”と“HTML”入力を切り替えないで書く

ひとつは、ドラッグ＆ドロップでの画像挿入を諦める方法です。常にHTML入力にしておくことで、pタグが消えたり、brタグがついたりするのを防ぎます。

デメリットとしては、画像挿入のやりづらさ、すべての操作をhtmlで入力しなければいけないので感覚的にブログが書けないなどがあります。

HTML入力の状態で、画像マークをクリックします。

"画像の追加"が表示されるので、ファイルを選択から画像を選んでアップします。その後、"選択した画像を追加"で、記事内に画像がアップされます。

上記方法を用いれば、HTML入力の状態で画像を挿入することができます。

実はこの方法、作成入力でも使える挿入方法になります。ドラッグ＆ドロップでの挿入と違うところは、違う機会に説明したいと思います。

テキストエディターなどで書いてから、HTML表示の状態でコピペする

ボクがオススメする執筆方法はこちらになります。

基本的には、タグとかを入れつつ、テキストエディターで記事を書きます。画像を挿入したくなったら、Bloggerの投稿で"作成"入力で画像をドラッグ＆ドロップ、その後、"HTML"入力に変更し挿入した画像を文字として表示、それをコピーしてテキストエディターに貼り付けていき、記事が完成したら改めて"HTML"入力ですべてをコピペする方法です。

メリットはテキストエディターを使うのでオフラインで書けること、使いやすいソフトを自分で選べることがあります。デメリットは、"作成"入力と"HTML"入力を切り替える回数が多いため、レビューで確認したい場合、少し書いてはテキストエディターで書いていた文を、"HTML"入力で貼り付けて確認するという工程が多いことです。

その工程が多いことでさえ考え方によっては、テキストエディターで書いたものはそちらで保存、Bloggerの方でも文を保存できるので、どちらかを間違えて消してしまっても、バックアップがある状態が維持されるのでこの方法をオススメしています。

一応、pタグもbrタグも使える

Bloggerでもpタグ、brタグの使い分けはできると言えます。
しかし、結構面倒なところも多いのは間違いありません。ブログを書く上で、かなり大事なところではあるかと思いますので、少し面倒でもやってみては如何でしょうか？

スポンサーリンク

スポンサーリンク