pタグとは？意味や改行について解説 - 段落要素：HTML5リファレンス

pタグはparagraph（パラグラフ）の事で、段落を意味します。ウェブサイトやブログなど、一番よく使うHTMLタグの一つです。

ブログのエディタを使っている等で、実は詳細を知らないまま文章を書いている方も多いと思います。

この記事では、pタグの使い方やよくある間違いを解説します。

この記事の目次

pタグとは

pタグとは、いわゆる本文に対して使われるタグで「テキストの段落」を表します。

段落とは、文章において見やすくまとめられた文の塊。通常は段落1つに対して、言いたい事も1つに絞ってまとめます。

<p>ここに書いている文章の様にpタグで囲まれた文章が段落になります。</p>
<p>言いたい事が変わる時はpタグで囲みなおし、段落を分けます。</p>

pタグの中に別のpタグを入れる事は出来ません。

HTML5になった今では複雑になりましたが、いわゆる昔の「ブロックレベル」要素です。ブロックレベル要素は、テキスト量に関わらず「画面幅いっぱいまで目に見えない仮想領域」が広がります。

pタグを使うたび、ボックスを積み重ねる様にその仮想領域が配置されます。ちなみに、pタグ前後の部分に余白が空く理由はCSSで余白設定されているからです。

空白を開ける為など、レイアウトの為に中身の無いpタグ（段落）を使うのは止めましょう。

PCで見た時、多くのブラウザ本文の文字サイズは初期設定で16px程度。ウェブサイトやブログによってはCSSでこれより小さくしている事も有りますが、15pxか16pxくらいが多いです。

スマホでは14px～16pxにCSSで変更しているサイトが多いです。

文字サイズは小さいとなんだかオシャレに見えますがとても読みづらいです。

ターゲットにするユーザーに合わせて読み易い文字サイズにする事を一番に考えましょう。

pタグというより段落分けの方法ですが、上手に段落分けするタイミングは以下の様な時です。

この様に、「文章の内容毎にまとまりを持たせる為に分ける方法」と「読み易さを目的として段落分けする方法」があります。

とくにウェブサイトやブログでは、読み易さを出す為に段落分けする事が多いです。

ブログだと読み易さの為にわざとpタグで分ける事もあります。
ですが、文章の内容によっては同じ段落内で改行させたい事もありますよね。

段落内での改行は、pタグの中でbrタグを使うのが本来の正しい使い方です。

PCとスマホでは画面幅が違うため、意図しない所で文章が折り返されることが殆どです。

日本語本来の改行の使い方が正しくても、brタグを入れる事で結果的に読みにくい文章になる事も。

brタグを使わずあえて改行しない、言い回しを変えて端的な文章に変更するのも1つの方法です。

特にスマホでの表示確認は必ずしておきましょう。