Webページ作成の基本

ホームページ表示の仕組み:

閲覧者がWeb Browser (ウェブ・ブラウザーと言ってIEやNetscape 等)を開き、そのアドレス窓にURL(http://www.xyz.co.jpのようなホームページのアドレス)を指定して実行すると、指定されたサーバーに保存されているHTMLファイルが閲覧者のパソコンにダウンロードされる。Web Browserは送られて来たファイルがHTMLファイルであることを認識すると、ホームページの国際標準化機構のW3Cで決められた文法に従って閲覧者のモニター画面にそのHTMLファイルに含まれている内容を表示する。

HTMLファイル、Webページ、Webサイト、及びホームページ:

WebページとはBrowserに表示されるひとつひとつのページのことで、各ページはHTML形式のファイルです。

Webサイトとはあるまとまった内容を伝えるために構築されたWebページの集合体で、Browserは常にダウンロードされたWebサイトのTopページを先ず最初に表示します。

Topページは通常「index.html」か「index.htm」と言うファイル名を付けなければいけないことになっています。

ホームページは時と場合によってTopページを指すことも、Webページ、やWebサイトを指すこともあります。

ホームページを作成すること:

ホームページを作成することは、HTML形式でホームページの構成要素であるWebページを作成し、それらの構成Webページをお互いにリンク(連繋)させることによって一つの纏まったホームページを構築することです。

HTML形式のファイルは基本的には次のようなHTMLタグによって規定されたテキスト・ファイルで、これは「メモ帳」のようなText・Editorによって書くことができます。ファイルを保存する折には必ずファイル拡張子が「html」となるよう保存する。

<html> ・・・ HTMLファイルの初めを示すタグ
<head>

この間にWebページのタイトルなどの見出し情報を書き入れる

</head>
<body>

この間にWebページの内容の本体情報を書き入れる

</body>
</html> ・・・ HTMLファイルの終わりを示すタグ

HTMLタグの基本的なもの:

HTML言語の基本要素をタグと言い、閲覧者のパソコンの中にあるIEなどのブラウザーがHTMLファイルの中に記述されているタグを認識して、その命令に従ってモニター上に文書や映像を表示します。

タグの最も基本的なものは、上に示されているような:
 ☆ <html></html>: HTMLファイルの大枠或いは骨組みを示す
 ☆ <head></head>: その頁に関する情報を示し、及び 
 ☆ <body> </body>: その頁の本体を示します。

それ以外で重要なタグには次のようなものがあります。

 ☆ 段落を示すもの:
   <p align="center">中央揃えの段落を入れる</p>
   <p align="leftr">左揃えの段落を入れる</p>
   <p align="right">右揃えの段落を入れる</p>

 ☆ テーブルを示すもの:(横幅600ピクセルの三行X二列の例)
   <table width="600" border="1" cellspacing="2" cellpadding="0">
     <tr>
       <td>第一行第一列目</td>
       <td>第一行第二列目</td>
     </tr>

    <tr>
       <td>第二行第一列目</td>
       <td>第二行第二列目</td>
     </tr>
    
     <tr>
       <td>第三行第一列目</td>
       <td>第三行第二列目</td>
     </tr>
   </table>

 ☆ テーブルで頁枠を表示させるもの:(枠幅を600ピクセル、枠線幅を1ピクセル)
   <table width="600" border="1">
     <tr>
       <td>この中に頁の文書をずらずらと書くと文書の左右がきちんと揃う</td>
     </tr>
   </table>

 ☆ ハイパーリンクを示すもの:(下の「コノペイジヘリンクする」の部分に下線が引かれる)
   <a href="page_02.html">この頁へリンクする</a>

 ☆ 画像を表示するもの:(src="〜"で画像を指定し、その大きさは300X225ピクセル)
   <img src="image/ph_asumi01.jpg" alt="" width="300" height="225" border="0">

 ☆ 部分の位置を揃えるもの:
   <div align="center">
    この中に揃えたい部分を書くと頁の中央に配置される
   </div>
   <div align="left">
    この中に揃えたい部分を書くと頁の左端に配置される
   </div>

   <b> それまで書かれてきた行が改行される(この改行はペアーの無いタグです)

 ☆ コメントを表示するもの:
   (これは開発者の為のもので、ブラウザーによってこの部分は表示されない)
   <!-- この中にコメントを入れる  -->

ホームページの開発のアプローチ:

(1) 自らHTMLタグを使ってプログラムを書いていく方法
    利用するソフトは「ワードパット」か、出来れば「ez-HTML」のようなテキスト・エディター

(2) プロバイダー等がその契約者のために簡便にHTMLプログラムを書けるような手段を提
    供しているので、それを利用する方法。 
    テンプレートを利用する方法とウィザードを利用する方法などがある。

(3) ホームページ作成専用のソフトウェア・パッケージを利用する方法
    IBMのHomepage Builder や AdobeのGolive等がある

以上の何れのかの方法を使って開発者のパソコンの中で書かれたWebサイトは、FTPというファイル転送プログラムを使って、契約するサーバーのコンピュータの中に転送されて始めてそのサイトは世間の閲覧者に公開されるのです。  FTPに就いては改めて後日レッスンを設けろ予定です。