内職！節約副収入生活　>　 「アフィリエイト」編　>　 htmlの全体構造

htmlの全体構造

大雑把に、htmlの全体構造について解説。

＊：このページで解説していることはあまり理解しなくても大丈夫です。

htmlの全体構造の把握

ホームページビルダー等のホームページ作成ソフトを使えば、ページ構造については考えなくてもホームページは作れますが、知っておくと、全てをわかった感じがして気持ちいいです。（笑）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> （↑DOCTYPE宣言・HTMLのバージョンを宣言）
<HTML>（HTML要素・DOCTYPE宣言後、残りを囲みます。ここから）
　<HEAD>
　　（HEAD要素・ここに書いたものは表示されません。）
　</HEAD>
　<BODY>
　　（BODY要素・ここにページの内容を書きます。）
　</BODY>
</HTML>（HTML要素・DOCTYPE宣言後、残りを囲みます。ここまで）

実はページの構造はたったこれだけです。

DOCTYPE宣言

はじめにDOCTYPE宣言と呼ばれるものを置きます↓

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

これ↑はHTMLのバージョンと種類を表すものです。
フレームを使う人や、xhtmlを使う人や、「表示を指定するタグ」を使わない人はちょっとだけ違った文書宣言をします。

「Transitional」というタイプは「表示を指定するタグ」を使う場合（何でもありな場合）です。ホームページビルダーを使うと、自動的にこのタイプのDOCTYPE宣言が挿入されます。

実際は、DOCTYPE宣言については何も考えないで大丈夫です！たぶん。

HTML要素

DOCTYPE宣言の下にはHTML要素が続きます。
つまり、残り全体を、<HTML>から</HTML>で囲みます。

全ての要素はこの中に書き込まれます。

HEAD要素

HTML要素の中にまず、HEAD要素を入れます。
つまり、<HEAD>から</HEAD>で囲まれた部分です。

この<HEAD>から</HEAD>の部分には「そのHTML文書に関する情報」を入れます。 ここに入れた情報はブラウザ（画面）には表示されません。

必ず「title要素」を入れます。まあ、ホームページビルダーでは自動的に
<TITLE></TITLE>
というように挿入されているので安心です。
<TITLE>から</TITLE>の間に、何も入れないと、「タイトルなし」になります。

ちなみに、このページは
<TITLE>htmlの全体構造</TITLE>となっています。

その他に、HEAD要素では、文字コードの指定や、その文書に関する説明やキーワード、スタイルシートに関する指定、著作者の表示などができます。

BODY要素

HTML要素の中には、HEAD要素の次にBODY要素を入れます。
つまり、<BODY>から</BODY>で囲まれた部分です。

この<BODY>から</BODY>の部分には「ブラウザに表示させたい内容」を入れていきます。つまり、画面に表示されているものは全て<BODY>から</BODY>に書かれています。

このページの一番上に戻る

アフィリエイト　（目次）

アフィリエイトの基礎知識をあなたに。

アフィリエイト　（基礎編）

  1. アフィリエイトの流れ
  2. ホームページビルダーの準備　（初めは、あると重宝します。）
  3. サーバー選びと独自ドメインの取得
  4. テーマの決定　（最重要かつ、最難関。）
  5. 広告会社と契約
  6. アクセスアップ

アフィリエイト　（参考コラム）

  1. ウィルス対策
  2. 費用対効果　（初期投資の判断材料に！）
  3. インターネットのマナー
  4. ホームページビルダー入門　（ビルダーを使うならどうぞ。）
  5. 表示速度
  6. 外見 vs 中身

アフィリエイト　（Webデザイン）

  1. htmlの全体構造
  2. 構造的なタグ付け（h1～h6やｐの使い方）
  3. ページデザインの基本
  4. 文字サイズと文字数の指定
  5. 行間の指定　（だいぶ見やすくなります。）
  6. IE6のwidth解釈のバグ対策　（2カラムや3カラムの崩れ防止。）

このページの一番上に戻る