表計算I

[0 番][ Go to 0001020304050607080910111213141516 ]

WWW の仕組み(復習)

World-Wide Web (WWW) では、以下のようにして画面が表示されている.
  1. まず,あるコンピュータ(以下、Web クライアントとよぶ) を使っている利用者(ユーザ)が, 別のコンピュータ(以下、Web サーバと呼ぶ)の名前と、 そのコンピュータに蓄えられているデータの名前を指定する. この指定方法が URL(Uniform Resource Locator) と呼ばれる形式である。例えば,
      http://www.nanzan-u.ac.jp/index.html
    も URL の一種である.
  2. Web クライアントは、指定された URL に従い、Web サーバに対して、 そのデータが欲しいという要求をネットワークを介して出す.
  3. 要求を受けた Web サーバは、 指定されたデータを Web クライアントにネットワークを介して送り返す. ()。
  4. Web クライアントは、Webサーバから送られたデータを画面に表示する.

: 一般に,あるコンピュータからの要求に応じて別のコンピュータが 何らかの処理を行い、 元のコンピュータに処理結果を返す形式で作られたシステムを クライアント-サーバシステムとよぶ.


[1 番][ Go to 0001020304050607080910111213141516 ]

HTML ファイル

前節で説明した Web サーバでは、 データはファイルとして蓄えられている.データを蓄えているという点で, Word や Excel で作成したデータを保存するためのファイルと同じであるが, 一つ重要な違いがある.それは、このファイルは Word や Excel といった 特定のアプリケーションソフトウェアに依存しないで読み書きできるよう、 テキストファイルと呼ばれる形式で書かれている ことである. WWW はクライアント-サーバシステムなので、 Web サーバと Web クライアントで同じ Windows が動作しているとは限らない. つまり、同じソフトウェアが使える保証がない. テキストファイルとは、このような場合でも利用できる共通形式だといえる.

WWW の場合、実際に格納されているのはテキストファイルの中でも特に HTML(Hyper-Text Markup Language)ファイルと呼ばれる 形式のファイルである。HTML ファイルには、Web クライアントで 表示される時の形式を指定するためのさまざまな指示が書き込まれている.

従って,WWW を使って情報を発信する場合,Web サーバに HTML ファイルを 保存させなければならないことになる.


[2 番][ Go to 0001020304050607080910111213141516 ]

ホームページの作成

ホームページを作成するためには,以下の方法がある.

実は,Word で書いた文章や,Excel による表なども Web ページとして 保存をすればホームページとなる。しかし,ホームページ(HTML) としては 非常に複雑な構造となるので,この演習ではより簡単な方法,「メモ帳」を 使って書く,Netscape コンポーザを使って作成する,を紹介する.

では,次に これら 2 つの方法について説明する.


[3 番][ Go to 0001020304050607080910111213141516 ]

テキストエディタ「メモ帳」

この講義では、HTML ファイルを直接書く。この際利用するのが, 「メモ帳」と呼ばれるソフトである.

[4 番][ Go to 0001020304050607080910111213141516 ]

HTML ファイルの作成

では、早速メモ帳を使って、HTML ファイルを作成してみよう. 「スタート」→「プログラム」→「アクセサリ」→「メモ帳」と選択し、 メモ帳を起動しよう.

[5 番][ Go to 0001020304050607080910111213141516 ]

次に、メモ帳を使って以下のように入力する. ``<html>''などの部分は、入力モードを直接入力に切り替えてから入力する.

<HTML>
<HEAD>
<TITLE>練習</TITLE>
</HEAD>
<BODY>
2001PP999 南山 花子
</BODY>
</HTML>

[6 番][ Go to 0001020304050607080910111213141516 ]

入力が終わったらファイルを保存します。「ファイル(F)」メニューから 「名前をつけて保存(A)」を選択し、 index.html という名前で保存してしよう.


[7 番][ Go to 0001020304050607080910111213141516 ]

Netscape でファイルを見る

今作ったファイルが、実際に Netscape でどのように表示されるか確認しよう.

以下のように、index.html の内容が表示される.

: このような操作をドラッグ&ドロップとよぶ.


[8 番][ Go to 0001020304050607080910111213141516 ]

HTML ファイルの詳細

HTML ファイルは、表示される文書の形式を指示するための、 タグと呼ばれる特別な文をテキストファイルに 挿入したものである。従って、HTML ファイルを書く際には、 作りたい文書の形式に従って、 テキストファイル中にタグを埋め込んでいく必要がある.

タグは「<タグ名>」というように、タグ名を不等号で囲んだものである. テキストファイルの内容のある一定の範囲を示すようなタグの場合、 その範囲を「<タグ名>」と「</タグ名>」で囲む.

先ほど入力したindex.html の説明をしよう. まず、1行目の「<HTML>」は、HTML ファイルの始まりを示すためのタグ である.この後書かれる指示は全て HTML 形式であるから, ファイルの最後に HTML ファイルの終わりを示すために 「</HTML>」が書かれている.

2行目から4行目の「<HEAD>」と「</HEAD>」で囲まれた部分は、 ヘッダと呼ばれます。画面には直接表示されないが, その HTML ファイルに関しての様々な指示を書込むのがこの部分である. ヘッダに書かれている「<TITLE>練習</TITLE>」は、 文書のタイトルを指定する部分である。Netscape では, ここで指定されたタイトルが、ウィンドウ最上部の枠の部分に表示される.

5~7行目の<BODY>~</BODY>で囲まれた部分が、 実際に画面に表示される文書の形式を指示する部分である. ここに書かれた「2001PP999 南山 花子」が Netscape の画面に表示される.


[9 番][ Go to 0001020304050607080910111213141516 ]

ただ文字を表示するだけではつまらないので、 基本的なタグを何種類か覚えよう.


[10 番][ Go to 0001020304050607080910111213141516 ]

Netscape コンポーザ(Composer)による作成

まず、(ここ) をクリックして以下のように ホームページを表示しよう.


[11 番][ Go to 0001020304050607080910111213141516 ]

コンポーザの起動

次に,コンポーザを起動する.そのためには,「ファイル」-> 「ページを編 集」を選べば よい.

すると以下の画面となる。

まずは,コンポーザ(composer) は,ナビゲータ(navigator) とツールバー が異なっていることに注意しよう.


[12 番][ Go to 0001020304050607080910111213141516 ]

ホームページの編集(1)

コンポーザ(composer) は,Word のようなワープロと同じように編集することが できる。例えば,以下のように書き換えてみよう.「聖霊太郎」には, あなたの名前を書こう.


[13 番][ Go to 0001020304050607080910111213141516 ]

ホームページの編集(2)

さらに,罫線を付け加え,著作権の表示を明記しよう.


[14 番][ Go to 0001020304050607080910111213141516 ]

ホームページの保存

作成したホームページは,一旦,PC に保存しなければならない. 「File」-> 「Save As」を選べばよい.

ファイル名は,index.html としよう.

index.html を入力したら,「保存」ボタンを押せばよい.

次回に説明する「Web ページの公開」では,この HTML ファイルを Web サーバに転送しなければならないので,必ず「保存」しておこう.


[15 番][ Go to 0001020304050607080910111213141516 ]

ホームページの編集(3)

もう,少し頑張って以下のようなホームページにしてみよう.


[16 番][ Go to 0001020304050607080910111213141516 ]

課題

上で説明した,

により,ホームページを作成し,印刷し,提出せよ。ホームページには必ず, 学籍番号,メールアドレス,名前を含めること(デザインは自由)。締切等,詳細については各担当教員の指示に従うこと.