【HTML】pとbr改行に使うのは?タグの意味を理解しよう

html

こんにちは。菜笑[なえ] (@nae310_)です。

今回はHTMLタグについて以下2点解説していきます。

  • <p>は段落
  • <br>は改行
  • <p><br>の具体的な使用例

<p>は段落

pタグはParagraphの略称で、段落を表すという意味があります。

そしてブラウザのデフォルトCSSでもpタグにはmarginが付与されています。

なので改行する際に使いたくなるかもしれませんが、ひと段落の文章を改行のために複数のpタグで囲むのは本来の使い方ではないと言えます。

<br>は改行

brタグはBreakの略称で、改行を表すという意味があります。
なので文章の最中で改行したい場合はbrタグを使いましょう。

よく段落と段落の間に余白を入れるために、brタグを使用している例を見かけます。
ですがタグの意味を考えるとbrタグはただ改行を入れるだけなので、いい使い方とは言えないですね。

具体例

以下の文章があったとします。

ブログを始めることにしました。
これから毎日更新していきたいと思います。

みなさん是非見にきてください。

タグの意味を考えてこちらをマークアップすると以下のようになります。

<p>
 ブログを始めることにしました。<br>
 これから毎日更新していきたいと思います。
</p>
<p>
 みなさん是非見にきてください。
</p>

おわりに

HTMLタグの本来の意味まで考えながらマークアップするのは大変かと思います。
それに意味を理解していなくても、CSSでデザイン通りに書くことはできますからね。

ですががコーダーとしてSEOを意識するためにも、タグの意味を理解することは大切になるので、1つずつでも意味を理解しながらタグを使い分けていけるようになっていきたいですね。

SNS

Twitter:@nae310_
Instagram:310nae