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文書でも、基本はこれなんで。
では次に、いよいよ本文を書くのに必要な知識について解説しましょう。
前へ 次へ