1

ｗｅｂページの作成

１． ｗｅｂページの記述

ｗｅｂページは，ＨＴＭＬ（Hyper Text Markup Language）を使って記述します．ＨＴＭＬ

は，テキストファイルです．したがって，メモ帳などを使って入力することができます．Ｈ

ＴＭＬは，タグをテキストの中に埋め込んでいくことによって，ｗｅｂページを記述します．

しかし，このタグは，非常に多くの種類とオプションがあり，初心者にとって決してわか

りやすいとは言えません．ｗｅｂページを記述する方法は，大きく２つあります．一つは，

メモ帳などのテキストエディタを使ってタグを入力する方法です．もう一つは，ｗｅｂペ

ージを記述するための専用のエディタを使う方法です．

教育システムのＭＳ－WORD には，文章をＨＴＭＬ形式に変換できる機能がありま

す．これを使えば，MS-WORDで作成した文章は自動的にHTML形式に変換できます．

ただし，ＭＳ－ＷＯＲＤのすべての機能が HTML に変換できるわけではありません．

授業では，ＭＳ－ＷＯＲＤを使ってｗｅｂページを作成し，ＷＷＷサーバへ登録する

までの手段を学びます．

（注意）

ＭＳ－ＷＯＲＤで作成したｗｅｂページは，インターネットエクスプローラで表示する

場合，ほぼ忠実に再現できます．しかし，他のブラウザで表示する場合は，忠実に表

示されないことがあります．

ＨＴＭＬの機能

ＨＴＭＬへ自動

的に変換

（一部の機能）

ＭＳ－ＷＯＲＤの機能

2

２． ＭＳ－ＷＯＲＤを使ったｗｅｂページの作成手順

（注意）

ＷＷＷサーバへｗｅｂページを登録することは，テレビの世界に例えると，放送局を所

有し運営することに相当します．他人にとって有益な情報を提供できるよう，注意する

ようにしましょう．

教育システムのＷＷＷサーバ

web.term.usmc.dendai.ac.jp

②ＷＷＷサーバへ登録

フォルダ名 public_html

ファイル名 index.htm

① ｗｅｂページの作成

ＭＳ－ＷＯＲＤを使って各

自のｗｅｂページを以下のフ

ォルダに作成する．

フォルダ名 public_html

ファイル名 index.htm パソコン

パソコン

パソコン

③ブラウザによる閲覧

他の人がブラウザを使って表示できるようになる．

パソコン

3

３． パソコン側のフォルダの作成

教育システムにｗｅｂページを登録するためのフォルダの名前は，ｐｕｂｌｉｃ＿ｈｔｍｌに

なります．さらに，トップページを示すファイル名は，ｉｎｄｅｘ．ｈｔｍです．これらの名前

は，ｗｅｂページを登録するサーバによって異なります．

ｗｅｂページの作成はパソコン上で行い，できあがったものをＷＷＷサーバへ登録

します．ＷＷＷへの登録作業が容易になるように，あらかじめＨドライブにフォルダを

作成しておきます．

（１） 「スタート」「コンピュータ」の順にクリックします．

4

（２） 「H:」を右クリックし，「新規作成」「フォルダ」の順にクリックします．

（３） フォルダの名前は，ｐｕｂｌｉｃ＿ｈｔｍｌです．キーボードの入力モードを半角英数に切

り替えた後，入力してください．

5

４． ｗｅｂページの作成

（１） ［スタート］，［すべてのプログラム］，［Microsoft Office 2013］，［Word 2013］の順

にクリックし，[白紙の文書]をクリックします．

（２） 文字を使った，短い文章のｗｅｂページを作成してみましょう．

6

５． ｗｅｂページの保存

（１） ［ファイル］［名前を付けて保存]［コンピュータ]［H:]の順にクリックします．

（２） Ｈドライブをダブルクリックした後，［public_html］をクリックし，ファイルの種類は

［Web ページ］を選択します．

7

（３） ファイル名は，半角英数字で［index］と入力し，［保存］をクリックします．

8

６． ＷＷＷサーバへの登録

完成したｗｅｂページは，ＷＷＷサーバへ登録することによって，他の人から見える

ようになります．ｗｅｂページの登録は，ＦＦＦＴＰを使います．

（１） ［スタート］［すべてのプログラム］［ＦＦＦＴＰ］［ＦＦＦＴＰ］の順にクリックします．

（２） ホスト一覧で［ｗｅｂ］をクリックし，［接続］をクリックします．

9

（３） 総合メディアセンターの共通パスワードを入力し，「ＯＫ」をクリックします．

（４） しばらくすると，ＦＦＦＴＰのウインドウが表示されます．左側がパソコン側，右側が

ＷＷＷサーバ側になります．左側のＨドライブをクリックします．

10

（５） ｗｅｂページを格納してある，ｐｕｂｌｉｃ＿ｈｔｍｌをドラッグ＆ドロップし，ＷＷＷサーバ

へ登録します．

（６） 転送が完了すると，右側のウインドウにフォルダｐｕｂｌｉｃ＿ｈｔｍｌが表示されます．

以上で，転送が完了です．ＦＦＦＴＰを終了します．

11

（注意）

ＷＷＷサーバへの転送は，パソコン上のｗｅｂページの更新毎に行う必要がありま

す．２回目以降の転送では，ＷＷＷサーバ上にフォルダが存在するため，以下の表

示が出ます．「以降全て」をクリックしてください．

７． ｗｅｂページの閲覧

登録したｗｅｂページは，ブラウザ（インターネットエクスプローラ）で閲覧できます．

ブラウザのアドレス欄に http://web.term.usmc.dendai.ac.jp/~13ne999/のように入力し，

Ｅｎｔｅｒキーを押します．先ほど登録したｗｅｂページが表示されます．学籍番号

（13ne999）の部分を変更すれば，他の人のｗｅｂページを閲覧できます．

12

以後，ＷＷＷサーバへ転送した後は，ブラウザの「 新の情報に更新」ボタンを押

してください．

８． 補足

（１） リンクの設定

東京電機大学へリンクを設定してみましょう．ｗｅｂページの適当な場所に，「東京

電機大学」の文字を入力します．この文字をマウスでドラッグした後，［ハイパーリンク］

をクリックします．

13

ハイパーリンクの挿入が表示されたら，アドレスの欄にｈｔｔｐ：／／ｗｗｗ．ｄｅｎｄａｉ．

ａｃ．ｊｐ／と半角で入力します． 後に「ＯＫ」をクリックすると，リンクが設定できます．

文字が青くなり下線がつきます．この文字にマウスが移動すると，指の形に変わり

ます．リンクは文字だけでなく，画像などにも設定できます．

14

（２） 画像の表示

ｗｅｂページで使用する画像は，あらかじめ，Ｈドライブに作成したｐｕｂｌｉｃ＿ｈｔｍｌに

入れておく必要があります．ｗｅｂページで表示可能な画像は，ｊｐｇ（ジェイペグ），ｇｉｆ

（ジフ），png（ピング）の形式になります．「挿入」「画像」の順にクリックします．

Ｈドライブのｐｕｂｌｉｃ＿ｈｔｍｌのフォルダの中から，組み込みたい図を選び，「挿入」を

クリックします．

15

図が組み込まれます．

（３） 背景の表示

［デザイン］［ページの色］［塗りつぶし効果］の順にクリックします．好みの組み合わ

せを選びます．

16

（４） 連絡先の表示

後に，ホームページに関する問い合わせを行えるようにしておく必要があります．

一般的には，ホームページ作成者のメールのアドレスを記述します．リンクの設定と

同様に，メールのアドレスの文字列を選択し，［挿入］，［ハイパーリンク］の順にクリッ

クします．

ハイパーリンクの挿入が表示されたら，［電子メールアドレス］をクリックし，アドレス

の欄に 13ne999@ms.dendai.ac.jp と半角で入力します． 後に「ＯＫ」をクリックすると，

リンクが設定できます．

17

WWW サーバへ転送し，ブラウザで仕上がりを確認します．