ホームへ

【html】改行のpタグとbrの違い【どっちを使うべきか、使わないべきか】

「改行する方法って、brとpがあるけど何が違うの?どっちを使えばいいの?」

改行のbrとpの違い、どっちを使うべきか、使わないべきかを解説します。

【結論】pタグは段落、brはそれ以外の改行

pタグは「パラグラフ」の頭文字であり、これを日本語訳すると「段落」となります。

つまりpタグ段落として使います。

brは段落以外の改行、主に段落内で改行するときに使います。

pで改行

<p>テキスト</p>
<p>テキスト</p>

↓ブラウザでの表示

テキスト

テキスト

brで改行

テキスト<br>
テキスト

↓ブラウザでの表示

テキスト
テキスト

段落とは

長い文章を区切った塊を段落と言います。

改行もなく文字が連続していると読みづらいですよね?読みやすくするために改行します。

また、1行空けるとさらに読みやすくすることができ、話の区切りであることを示すことができます。

pタグは上下に空白をつけられる

pタグは段落であり、段落の前後には空白をいれることが多々あります。

pタグにpaddingやmarginを指定することで上下に空白をつけることができます。

brで改行しても行間程度の空白しか付きません。

brを連続することで1行空けることはできますが、paddingやmarginなら細かい数値を指定できます。

【ぶっちゃけ】どっちでもいい

と、ここまでpタグとbrの違い、使うべき箇所を説明してきましたが、ぶっちゃけどっちでもいいです。

ユーザーにとっては、その改行がpなのかbrなのかはまったく関係なく、そんなことよりも内容(文章)がわかりやすく、読みやすいことが重要です。

SEOもユーザーに指示される記事を重視しており、その改行がpかbrかはたいした問題にしていないでしょう。

htmlに慣れてきたらpとbrを使い分けてみましょう。

わかりやすく読みやすくするために

結論を先に

ユーザーは答えを知りたくてネット検索します。

結論を先に言いましょう。

「結論を先に言ったら記事を最後まで見てくれないじゃないか!」

と思うかもしれませんが、結論を先に言い、わかりやすい記事にすると自然とユーザーに支持され、検索順位も上がり、アナタにも恩恵がきます。

3行以内で改行する

文章の最後につける「。」を句点と言います。

3行以内で句点をつけ、文章を終わらせ改行するようにしましょう。

だからといって1行を長くしたり文字を小さくして詰めたりしてはいけません。
それは読みづらくする方法です。

3行以内というのは目安であり、1文章の文字数を少なくすることに意味があります。

1文の文字数が多いと、主語と述語が遠くて意味が分からなくなることがあるためです。

無駄な説明や装飾を削るのも有効です。

3文章以内で1行空けるとさらに読みやすくなります。

改行する箇所は句点「。」だけ

句点以外で改行するのは基本的にやめましょう。

ホームページでは文章が右端まで行くと自動で改行されます。

ブラウザ幅が変わると、1行当たりの文字数が変化します。

パソコンで見たときはいい箇所で改行されていても、スマホで見たときに変な改行になっている場合があります。

ユーザーによって1行当たりの文字数が違うことを意識して、改行しましょう。

【まとめ】改行のpタグとbrの違い

  • pタグ→段落
  • br→段落内の改行

pタグは上下に空白をつけられる

ぶっちゃけどっちでもよく、内容(文章)がわかりやすいことが重要

以上、改行のpタグとbrの違いでした。

マンガで読める関連記事