ブログを書く前に知っておきたい divタグと pタグの違い

最近HTMLの勉強をしていて気づいたんですが、<div>タグと<p>タグが全然ちがうモノだという事がわかったので紹介します。

「そんなの当たり前じゃん」という方にはまったく理解できないと思います。

「p を使うと行間が1行空いちゃうな、、、あれ？divにすると行間が空かない？じゃあdivにするか」という風に使っている人のために書きました。

<p>とは｜Paragraph（段落）

pタグ Paragraph

<p>タグはParagraphの略で段落を表現するためのタグです。

僕がそうだったんですが、行間があいてしまうからという理由で今まであまり使ってませんでした。

反省しています。

行間は使っているテーマによってはCSSで調整していてくれるかもしれませんが。

じゃあ、今までどうやって改行していたの？

ということになるんですが、恥ずかしながら<div>で囲っていました。

<div>が表す意味なんですが、ブロック、一つのカタマリ、範囲、区分を表しているに過ぎないようで、文章の改行に使うのは正しくないようです。

<div>は他に適切なタグがない場合に限り使うタグです。

「ブログを書く前に知っておきたいwordpressのこと」というか、知っておけば良かったなぁと思う事がHTMLの事です。

wordpressはHTMLやCSSといったプログラミングの知識がなくても気軽に始めることができます。

僕もそうです、気軽に始めました。

「じゃあ、HTMLとか、CSSとか勉強しなくていいんだ！」となりそうですが。

うん。

そうだけど、そうでもないです。

HTML（エイチティーエムエル、HyperText Markup Language）の略です。

Languageとあるので言葉ですよね。

誰のための言葉なのかというと、googleなどの検索エンジンのロボット達のための言葉です。

まず、ロボに理解してもらわないと人まで届かないんです。

ロボット達は人間のようにブログの記事を「へー、ふーんこんな事が書いてあるな、面白いなぁ」って感覚や感性で読んでくれてなくて、囲まれたタグによって「この部分はこんな事が書いてる」って機械に理解しています。

テキストタブをポチッと

wordpressの投稿画面のビジュアルエディター状では分からないんですが、テキストタブをポチッとやると、ぶあーーーーータグに囲まれた文章がびっしり！！並んでます。

あれってHTMLですよ。

つまり、勉強しなくてもなんとかなるけど、wordpressを使ってブログを書く以上はHTMLとは無関係ではいられないんです。

pを使うと行間が空いたからdivにするといった使い方は間違いです。

見た目はCSSで調整しましょう。

僕は記事が大事なんだから、HTMLとか、CSSとか勉強しなくていいやと思って、3年くらいブログを書いていたんですけど、今は反省しています。

最近、やっと本格的に勉強を始めました。

HTML はロボット達に文書の構造を理解してもらうために、意味付けするためのもので、見た目を変更するためのものではありません。

えらそうに書いてますが、僕も最近分かったばかりです。

一緒に勉強していていきましょう。