1−1・HTMLを書く〜基本構造〜


さて、ではHTML文書を書いてみましょう。HTMLの構造は、おおむね以下のようになっています。

<HTML>
<HEAD> <TITLE> (ページのタイトル) </TITLE> </HEAD>
<BODY>           (本文)          </BODY>
</HTML>


ここで、『タイトル』とはウィンドウの上のバーに表示されるファイル名のことです。コーナータイトルなど、ウィンドウの中に表示されるものは全て『本文』なのです。






さて、では具体的な記述に入りましょう。……実は私が一番わかってないところなんですが(^^;。
上の構造図では、<HEAD>節の中にはタイトルしかないように見えますが、他にも色々な要素が入っていることがあります。例えば、ソースを見ていただければわかりますが、このページのヘッダ節の中は以下のようになっています。

<HEAD><TITLE>HTML講座第1回</TITLE>
<META HTTP-EQUIV=Content-Type CONTENT="text/html; charset=EUC-JP">
</HEAD>

で、これらがどんな意味を持ってるか、となると……実は全然知らないんですね、私は(爆)
このMETAタグの存在価値はイマイチよくわかりません。特に無くても表示そのものは変わらないんで、まあ無くても良いんではないかと思いますが……
不安ならこのまま丸写ししておけば良いでしょう、かく言う私もそうだし(核爆)
おそらく「charset=」の部分は文字コードを指定しているのですが、ここで"EUC-JP"と打ち込んだからと言って文字コードも変わるわけではない(パソコンなら普通はSHIFT-JIS)のでアップロード時は注意。詳しくは後述。






というわけで次はボディ節を解説します。
まず冒頭のボディタグで背景や字の色などを指定します。これは以下のように表記します。

<BODY TEXT="#FFFFFF" BGCOLOR="#000000" LINK="#0000FF" ALINK="#FF00FF" VLINK="#FF0000">

一見すれば大方わかってもらえるのではないでしょうか。
念のために説明しますと

TEXT・・・・・文字の色を指定します。
BGCOLOR ・・・背景色を指定します。
LINK・・・・・リンクを張った文字の色を指定します。
ALINK ・・・・リンクをクリックしたときの文字色を指定します。
VLINK ・・・・以前行ったリンクの文字色を指定します。

ただ、ブラウザの設定次第(なのかな?)ではかなり記憶能力があやしいのでVLINKなどが当てにならないことはあります。
なお、色の指定はRGBフルカラー、16進数6桁で指定します。よって例の場合、文字は白、背景は黒、LINKは、ALINKは明るい紫、VLINKはになります。とは言っても、数字をにらんで色を思い浮かべるのは結構きついですよね。ここでPIGYEDITのカラーアレンジ機能が役に立つんですよね……。
なお、背景をベタ塗りでなく絵を張る場合、

<BODY BACKGROUND="(画像ファイルのリンク先)">

となります。もちろんこの場合、背景画像を作るなり手に入れるなりしておく必要がありますが。

これくらい覚えれば、HTMLの基本構造はばっちりだと思います。どんな複雑なHTML文書でも、基本はこれなんで。
では次に、いよいよ本文を書くのに必要な知識について解説しましょう。


前へ   次へ
『HTMLの書き方』へ