HTML講座
タグは意味をもつ
全てのタグはそれぞれ意味を持ちます。タグは、見栄えをコントロールするためだけのものだと思っているのならば、それは間違っています。
タグが持つ意味を考えてマークアップすることが、良いHTMLを書くには必要不可欠です。これを頭の片隅に、とどめておいてください。
よく使うタグ、使わないタグ
実際に、ホームページを作成してみれば気が付くことだと思います。頻繁に使うタグもあれば、絶対に使うことが無いようなタグも存在します。
使わないタグを教えても仕方がありませんから、実際に私が使うものだけを紹介しようと思います。
頻繁に使うタグ
- <html>
- 文章がHTMLによって書かれていることを示すのに使います。
- <head>
- HTMLのヘッダー部を記述するときに使います。
- <body>
- HTMLのボディー部を記述するときに使います。
- <title>
- HTML文章のタイトルを記述するときに使います。
- <h1>～<h6>
- 見出しを作成するときに使います。
- <p>
- 段落（小段落）を作成するときに使います。
- <img />
- 画像を挿入するときに使います。
- <a>
- ハイパーリンクを作成するときに使います。
- <em>
- 文字列を強調するときに使います。
- <strong>
- さらに強い強調をするときに使います。
比較的良く使うタグ
- <div>
- 汎用ブロック要素です。このタグ自体は意味を持ちません。
- 主に、CSSを適用するときに使います。
- <span>
- 汎用インライン要素です。このタグ自体は意味を持ちません。
- 主に、CSSを適用するときに使います。
- <br />
- 強制改行を行うときに使います。
- <ul>,<li>
- リスト（番号無し）を作成するときに使います。
- <li>はリストの項目を作成するときに使います。
- <ol>,<li>
- リスト（番号付き）を作成するときに使います。
- <li>はリストの項目を作成するときに使います。
- <dl>, <dt>, <dd>
- 定義型リストを作成するときに使います。
- <dt>はリストの項目（見出し）に使います。
- <dd>はリストの項目（データ）に使います。
- <table>, <tr>, <th>, <td>, <caption>, <col />, <colgroup>
- <table>は表を作成するときに使います。
- <tr>は表の行を作成するときに使います。
- <th>は表の見出しとなるセルを作成するときに使います。
- <td>は表のデータを入力するためのセルを作るときに使います。
- <caption>は、表のタイトルを作成するときに使います。
- <col>はカラムにまとめて属性を指定するときなどに使います。
- <colgroup>はカラム（列）をグループ化させるときに使います。
- <blockquote>
- 引用文であることを示すときに使います。（ブロック要素）
- <q>
- 引用文であることを示すときに使います。（インライン要素）
- <cite>
- 参照や参考文献などを示します。
あまり使うことの無いタグ
- <hr />
- 水平線を挿入するときに使います。
- <address>
- ページ製作者の情報を記入するときに使います。
- <object>
- オブジェクトを挿入するときに使います。
- <link />
- headタグ内に記述して、外部CSSファイルなどを指定するときに使います。
- <meta />
- headタグ内に記述して、さまざまなメタ情報を記述するときに使います。
- <abbr>
- 囲まれた語が省略形であることを示すときに使います。
- <del>
- 削除文であることを示すときに使います。
- <ins>
- 挿入文であることを示すときに使います。
以上が、私がホームページを作成するときに実際に使うタグです。多いと感じますか？少ないと感じますか？これらの４０個余りのタグを使い分けるだけで、ほとんどのHTML文章は書けてしまうはずです。このほかに、フォーム関連のタグを使うこともあるのですが、それらは滅多に使わないので省略しました。
一応・・・紹介しているタグや属性はXHTML 1.1に準じているもののみで、これ以外にも廃止となったタグやブラウザ固有のタグ、非推薦の属性などが数多く存在しています。でも、わざわざ使うことは無いでしょう。
タグは２種類ある
基本的に、タグは<xx>で始まり、</xx>で終わります。この、始まりを表すタグのことを、開始タグ、終わりを表すタグのことを、終了タグといいます。
リストを見てもらえれば分かるとおり、<xx />と記述されているものがいくつかあります。実は、これらのタグには終了タグがありません。それらのタグは、終了タグが無い代わりに、<xx （半角スペース）/>と記述することになっているのです。（XHTMLでは）
これらの終了タグが無いタグのことを空要素といいます。
例えば、画像の挿入に用いられるimgタグは、
<img src="sample.png" />
のように記述されることになります。こういうタグもあるんだな・・・と覚えておいてください。
