I aim to creator.

っと勘違いしている方が多いと思います。

そして特に必要の無いタグを使って見ててイライラする様なサイトを作成する始末。

なので今回は基本的に使うHTMLタグを初心者の方向けに紹介したいと思います。

これで無駄に覚える必要のないタグを覚えなくて学習が進むと思います。

初心者であれば必ずと言っていい程、流れる文字とかのHTMLタグを使うと思います。

厳密に言うとプロパティでやるのですが、こういった効果は全く必要ありません。

そもそもHTMLタグと言う物は基礎を作り上げる物で、その基礎を元にCSSやJavaScriptなどで効果を与えるのです。今の時代基本jQueryと言うライブラリを使ってカッコイイサイトなどを作成しますね。

ここで間違っていけないのはHTMLはデザインを定義する物でもなく、効果を出す物でもなく、構造を組み上げる物です。身近で言えば型枠大工みたいな感じですね。もっと身近に言えば絵の下書きの様な物です。

これだけは絶対に間違えないで下さい。

では基本的に使う文字系HTMLタグを紹介します。

ソースの下にHTMLの説明を書きますのでよく読んで理解して下さい。

<p>〜</p>

これは段落タグです。
文字などを段落で区切る事が出来る物です。基本的に文書はこの中に書きます。

<span>〜</span>

このタグは特に意味を持ちませんが、主に囲んだ範囲にスタイルを適用させて使います。
一部分だけの文字列の色を変えたりなどCSSを適応させて使います。

<br />

改行タグです。文字列と文字列の間に入れるとその部分から改行されます。
但し、位置とか調整する為に使う物ではありませんので、ご注意下さい。

<hr>

境界線を引きます。

<table>
 <tr>
  <td></td>
  <td></td>
 </tr>
</table>

テーブルタグです。表などを作る事が出来ます。
これはただレイアウトを作る為の物ではないのでご注意下さい。


文章系HTMLタグはこれだけでも覚えていれば十分です。

構造系HTMLタグ

レイアウトなど構造を作り出すHTMLタグです。

<div>〜</div>

こちらのタグは特に意味を持ちませんが、ホームページのレイアウトなどの構造を作る時に作ります。基本と言うか、ほとんどこれだけでレイアウトを作るので、ここではクラスなどについて説明しましょう。

特に意味を持たないタグが何故構造として使うのか?
っと思うかもしれませんが、特に意味を持たない綺麗なタグをCSSで飾ってあげると、綺麗なサイトが作成出来るのです。

何らかの意味を持って効果を出してしまうのであれば、逆に難しい事をしなくてはいけなくなります。

ではまず初めにidとclassの違いを説明しましょう。
このidとかはCSSで指定する時にセレクターとして使います。

idは1のみに適応される物です。複数あっても全てにCSSは適応されませんのでご注意下さい。
classは複数CSSを適応されます。

単純にidは1だけに適応される特別な物classは複数あっても全てに適応される。
っと考えたらいいでしょう。

たったこれだけHTMLを覚えれば大体のサイトは作成出来ます。

無駄なタグを覚えずにスッキリとしたサイトを作成しましょう。