３、ＨＴＭＬファイルの基本構造（一番簡単なホームページの作成） さて、今回からワープロソフトやエディターなどを使って、実際にホームページ用の ＨＴＭＬファイルを作ってみましょう。 まず、ＨＴＭＬファイルは基本的に３つの部分で構成されています。（構造タグ） ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ <HTML> ・・・・・・・・・・・・・・（１） ﾌｧｲﾙのはじめ<HTML> <HEAD> ・・・・・・・・・・・・・・（２） ﾍｯﾀﾞ<HEAD> ヘッダ情報 </HEAD> ・・・・・・・・・・・・・・（２）’ <BODY> ・・・・・・・・・・・・・・（３） 本文の始まり<BODY> 本文 </BODY> ・・・・・・・・・・・・・・（３）’ 本文の終わり</BODY> </HTML> ・・・・・・・・・・・・・・（１）’ ﾌｧｲﾙの終わり</HTML> ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ （１）と（１）’つまり<HTML> と </HTML>がＨＴＭＬファイルである事を示す<HTML>タグ といい、ＨＴＭＬファイルの最初と最後に必ずつけます。 また （２）と（２）’つまり<HEAD>と </HEAD>がタイトルや特徴などのヘッダ情報を入力 する <HEAD>タグです。 そして（３）と（３）’つまり<BODY>と</BODY>がページの本文を入力する<BODY>タグと呼 ばれています。ブラウザが表示するのは、このボディタグで囲まれた部分です。 これら３つのタグは構造タグと呼ばれています。 また、それぞれのタグの終わりには必ず/を付けます。（</HTML></HEAD></BODY>） 例題として、以下に一番簡単なホームページを作ってみます。 ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ <HTML> <HEAD></HEAD> <BODY> これは、一番簡単なホームページです。 </BODY> </HTML> ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ この例では、「これは、一番簡単なホームページです。」という文字が表示されます。 それでは、実際に試して見ましょう。 （上の例をコピーしてエディタに張り付け、ファイル名をhazime.htmlとして保存し、 ネットスケープナビゲータなどで読み込んでみる）（b:\kmham211/hazime.html）@ 如何でしょうか？ それでは、ここで第２回で学んだディレクトリ構造について見てみましょう。 画像データーは、\kmham211/datagazou/ に画像ファイルが転送されていました。 himawari3.jpgがこのディレクトリにあるので、それを呼び出してみます。 呼び出し方は、ファイルの格納場所までのパスを指定して（下記の仕方です）データの ファイル名を書くだけでｏｋです。 B:\kmham211/datagazou/himawari3.jpg （←ここをクリックしてください。） どうですか？「ひまわり」の画像がみえましたね。 こんどは、先の（@）hazime.htmlファイルにこの画像を張り付けてみましょう。 A（b:\kmham211/hazimeni.htm） このファイルはdatagazouにあるhimawari3.jpgを 読み込んでいます。一度ご覧ください。 こうしてホームページ作りの第一歩が踏み出された次第です。 「千里の行も一歩より始まる」といいます。 あとは、タグの基本や、画像、音声の入力の仕方及び表組やリンクの仕方、フレーム 及びフォームなどの作成方法について学ぶだけです。 （ＪａｖａＳｃｒｉｐｔや、ＪＡＶＡなどの技法もありますが、ここでは省きます。）
トップへ戻る
ホーム 
タグ一覧表