〔まずはじめに〕

　この文章は、初心者向けのＨＴＭＬ講座となっております。
特にこれから、ホームページを自力で開設なされる方には少しは ためになるかも知れません。
　もし、どこかおかしな所があったら、お手数ですが連絡して いただけると有難いです。

〔ホームページ（Ｗｅｂページ）とは〕

　インターネットっという一般サービスを使って、自分の家を 作ってしまおう！ってものです。
　まぁ、他人に自分の趣味をみせる世界ですかね？
　そこは他人向けになると思うので、便利なものとか、他人が見て 飽きないものがある方が良いと思います。
　自分の趣味だから、なんでもいいって考えもありますが、家族の写真を見ても 少なくとも私は楽しくありませんし、なんか時間を無駄にした気分になります。
　それでも、自分が納得いけば、良いと思いますけどね…（苦笑）

　そんなわけで、ある意味、公共の場 であることを考えなくてはいけません。

　以後、ホームページをＨＰと略します。

〔プロバイダって？〕

　必ず、インターネットをはじめようとすると聞く言葉です。
　これはあなたの下僕です…（嘘）
　いきなり昔話ですが、インターネットの始まりとうのは、アメリカの大学間での データのやり取りから始まったそうです。
　当時、パソコン通信のようなデータのやり取りには、それぞれの大学でアクセス（接続） の許可をして、パスワードを貰ってからしか、やり取りができませんでした。
　つまり、一般人には絶対にアクセスができなく、公共の場ではなかったのですが、 それでは、あまりネット（網）としての機能を有意義に使っていないことが提示され、 もっとスムーズにもっと多彩にならないかってことで、 偉い人が考え出したものらしいのです。
　一個人でアクセスするためには、上のような手続きを踏まなくてはならないのですが、 プロバイダという接続仲介業者を通せば、その手続きをなしたものとして 個人では何もしなくて良いものとなったのです。
　うぅ〜ん、便利便利…
　そんなわけで、プロバイダってものは言わば、バスの運転手 ってところでしょうか？
　決して、下僕ではありません。
　プロバイダの調子が悪いだけで、プロバイダを通す 私達は常に痛い目にあうからです…
　だから、プロバイダは良く選びましょう！（苦笑）

〔ＨＰ容量とFTPについて〕

　そんなＨＰですか、作るとなるとディスク容量を考えなくてはなりません。
　しかも、その容量は自分のパソコンの容量ではなく、 基本的にプロバイダが用意するものです。
　つまり、プロバイダが一般公開しているマシン（サーバー）の ＨＤＤ（ハードディスク）上に、その容量を貰って使うわけです。
　だから、私達はそこにデータを置く（アップロード）する必要があるわけです。
　この作業を行うプログラムをＦＴＰと言います。
　何の略だか、良く知りませんけど、それでも使えます。（笑）
　ＦＴＰを使うにはＷｉｎｄｏｗｓ上では、ＤＯＳ窓というＤＯＳモードを使います。
　ＵＮＩＸ環境では、まぁ大差ないのですが、コマンドプロンプト（手打ち実行ライン） から打ちこむわけです。

　まず、Ｗｉｎの方では、
　　［スタート］→［プログラム］→［ＭＳ−ＤＯＳプロンプト］
を行います。

　そして、プロバイダから与えられた、ＦＴＰサーバーにアクセスして行きます。
　私はイルカさんがプロバイダなので、それを例にとって書きます。

　　c:\Windows>
　　c:\WIndows>ftp ftp.din.or.jp
　　User : msy
　　Password : ********
　　logged in

　　ftp>ls
　　./　../　〜　WWW/
　　ftp>cd WWW

とかやって行きます。
　一般的に、自分のＷＷＷ（ワールドワイドウェブ）への公開領域は そのプロバイダによって異なります。
　私のプロバイダでは、　WWW　というディレクトリーです。
　基本的には、　public_html　というディレクトリーであることが多いです。

　　ftp>ls
　　./　../　〜　public_html/
　　ftp>cd public_html
　　ftp>ls
　　./　../　〜　index.html
　　ftp>lcd
　　c:\Windows
　　ftp>lcd c:\html\
　　c:\html\
　　ftp>put index.html

　上の　index.html　っていうのは以下で説明しますが、このようなコマンド操作によって ファイルを送信したり、受信したりします。
　注意しなくてはいけないことは、大文字小文字の区別があることです。

　でも、これは初級編なので、この辺はこんなやり方もあるんだなって感じに 思っててください。
　そんなわけで、ＦＴＰツールという便利なものが落ちていますので、 インターネットに慣れるためにもそれを拾ってきてください。（笑）
　ＵＮＩＸ環境の人は基本的にＵＮＩＸコマンドが使えますので、 ＵＮＩＸに慣れてからやってみてね☆
そこで、重要なコマンドだけ紹介…

　　ftp>put Filename　：ファイルを送信
　　ftp>get Filename　：ファイルを受信

　これだけです。（笑）
　便利なツールにはＦＦＦＴＰとかＮＥＸＴＦＴＰなんてものがあります。
　　http://www.yahoo.co.jp/
　　http://www.goo.ne.jp/
などの検索エンジンで調べれば、きっと見つかります。
　なんでも、経験です。（笑）
　まぁ、上のソフトの使い方は習うよりは慣れろってやつです…（汗）

〔index.htmlって何？〕

　あなたがＩＥやネスケなどのブラウザを使って、インターネットを利用するとき ＵＲＬというものを知らなくてはなりません。
　ＵＲＬというものはそのＨＰの番地です。
　人が家を探すときには、住所を調べるのが一番早いですから、そのＵＲＬを打ちこむ ことで直接そのＨＰを見に行けるわけですね。
　もっとも、ＷＷＷの特徴はＨＰを繋いでしまうってことで、ＵＲＬを打ちこむことを 少なくすることに良さがあるのですけど…
　それで、ＵＲＬを打ちこむときには以下のようにします。

　　http://www.din.or.jp/~msy/

　こうして、打ちこんだＵＲＬですが、いったいどのファイルを 読みこむのでしょうか？
　先ほどＦＴＰで送りこんだファイルが１０個あるとして、番地だけでは どのファイルがトップの読まれたいのかはわかりませんね。
　だから、何も無いときは優先的に　index.html　を読みこむようになっています。

　　http://www.din.or.jp/~msy/index.html

とやるのと同じってことです。
　ですが、諸事情により
　index.htm　index.cgi　index.shtml　index.shtm
のファイルが読まれる必要がある場合があります。
　この場合はプロバイダの設定によって読まれるか読まれないかや優先順位が 変わったりします。
　その辺はいろいろと試してみて、公約と違う場合には怒りのメールを 投げつけてやってください！（笑）

　つまり、index.html　というのは門なわけですね。
　まぁ、ＵＲＬを簡単するために優先順位を作ったのでしょうけどね…
　というわけで、これだけは少し特別なものだと思っておいてください。

〔ＨＴＭＬの役割〕

　それでは、ＨＴＭＬとはいったい何なのでしょうか？
　別にＨＰやネットを使う上では直接関係ありません。
　但し、その表記方法がとても単純で簡単なので、ネットで開発されたのでしょう。
　だから、初心者にも簡単に作成ができるのです。
　それで、ＨＴＭＬはどんなものかと言いますと、

　　わいは<FONT SIZE=5>猿</FONT>や！！！！

のように、基本はテキストを拡張するものです。
　それによって、見栄えのするＨＰができるわけです。
上の普通表示されない部分　<FONT>　の　 <〜>　までがタグと呼ばれるもので、 特別な役割として、文字を拡張したりします。
　そして、その中の文字によってその効果が違います。
　他にはブラウザのソースを見るって機能を使ってみてください。
　よって、そのタグを知ることでＨＴＭＬ形式のテキストを作ることができ、 それで、ネットでＨＰを自由に自作できるわけです。

〔リンクとページの関係…〕

　そんなＨＰのＨＴＭＬテキストにおいて、忘れては行けないのが、 リンクです。
　リンクとは、どっかのゲームキャラではなく、日本語訳で「関連付ける」という
ものなのです。
　そして、そのスペルはＲＩＮＫＬＩＮＫなのです！（笑）

　実のところ、リンクは別に細かいことは考えないで、扉だとおもってください。
　他のＨＰに飛ぶときは、

　　<A HREF="http://〜/">ここに飛ぶ</A>

というようにＵＲＬをしてやることで、実現できます。
　ところで、ＨＰを見ていくとページというものがありますよね？
　その人の家が複数に重なっている感じに進んでいく感じです。
　これは、一枚の紙が何重にも重なっているのと同じで、ページと言われているのだと 思いますが、そのページを開くにはどういうことをしているのでしょうか？ 　マウスで、その指定されたところをクリック（ボタン押し）をすると中に入って 行きますね。
　これと、他の人のＨＰに飛ぶためにするマウスクリックの作業とは同じです。
　つまり、言い方が違うだけで、やっていることは同じなので、タグの指定の仕方 も同じなのです。

　　<A HREF="http://〜/HTML.html">ここのページ</A>

　まぁ、そんなわけでＵＲＬに　html　まで、指定するとそのページに 行くわけですね。
　ただ、ＵＲＬの指定の仕方をかなり省略できることがページの特徴です。

　　<A HREF="./HTM/HTML.html">ここのページ</A>

　このように、．（ピリオド）を今いるＵＲＬとして後は付属部分の指定だけで 良いのです。
　これを、絶対パスと相対パスと言いますが、そんなことは忘れても かまいません。
　ようは、どれだけ自分が苦労しないかです！！！（笑）
　とまぁ、「関連付ける」意味ではページもへったくりもなく、 何でも指定しろってことなんですよ。

〔タグの意味と種類〕

　さてさて、ここまで、やってきて今までのは前菜です。
　ここからがメインってこと。
　気分も新たに逝きましょう！（笑）

　　<HTML>
　　<HEAD>
　　<TITLE>This is a PEN!</TITLE>
　　</HEAD>

　　<BODY BGCOLOR="#ffffff" TEXT="#000000">
　　わいが<FONT SIZE=5>猿</FONT>や！！！！
　　<BR>
　　<A HREF="http://www.din.or.jp/~msy/">ここがＨＰなの…</A>

　　</BODY>

　　</HTML>

　こんなのが１つのファイルのベースです。
　エディターと呼ばれるものＷＺ、秀丸、メモ帳なので、index.html　として上を保存して アップして見てください。
　おそらく、他人が来たらふざけてると思うようなページができてるはずです。（笑）
　アップが面倒な人は自分ハードディスクの中身をブラウザで指定させて見てみて ください。
　Ｗｉｎの人はファイルをクリックするだけで見れると思います。
　上のが一番単純にまともなベースです。
　このベースをもとに違う名前で同じように作ることで、それをリンクしたときに ページが作成されるわけです。
　結構面倒ですよね。
　まぁ、それでも自作したいんだ！！！って人や、自作しかできない環境なんだ！！ って人だけ、これから先は読んでください。
　面倒なのは嫌いって人は、ホームページビルダーっていう、マッチョそうな名前の 便利シェア（販売）ソフトがあるので、それ買って作るのも良いでしょう。
　その方がかなり良いページも作れるっていう人も多いですからね。
　もっとも、今の段階ではまだ無駄があったりして、たまに嫌なＨＰも できいることもありますけどね…

　本題に戻りましょう。

<HTML>〜</HTML>	…ＨＴＭＬテキストであることを示す。
<HEAD>〜</HEAD>	…前程部分であることを示す。ようは頭。
<BODY>〜</BODY>	…表示部分であることを示す。ようは体。つまり、中身。
<TITLE>〜</TITLE>	…タイトルバーのタイトル。できれば、半角文字が良い。
<FONT>〜</FONT>	…フォント等の指定。
<A>〜</A>	…リンク等の指定。
<BR>	…改行。

　こんなようになってます。
　上を見てみてば、分かるように基本的に３種類に分類できます。
　定義タグ、特殊タグ、基本タクってところでしょうか？
　定義タグと特殊タグについては、上のやつだけでも初心者には十分なので 割愛します。
　それで基本タグですが、先ほど書いたようにタグと言うものは基本的に文章を 拡張するもので、お約束が２、３つあります。

　　<タグ命令　オプション>〜</タグ命令>

　タグ命令とはそのタグの行う行為です。
　たとえば、ＦＯＮＴなら文字操作、Ａならリンク操作です。
　そして、<タグ命令>から</タグ命令>までで、文章等を囲みます。
　/タグ命令はそのタグの終了位置を示しているわけですね。
　それでは、上の基本タグの改行命令の<BR>はどうでしょうか？
　改行を囲む範囲を考えてもらえばわかると思いますが、そのような範囲は ありませんよね？
　つまり、その場所に命令を置くことで終了してしまう命令は終わりの範囲を 書かなくても良いのです。
　他に例をあげると、

　　<IMG SRC="絵のＵＲＬ" ALT="これが勝利の鍵だ！">

のように、絵を貼り付けるタグなんかもそうです。
　探せはたくさん出てきますが、基本はあくまでも文章の拡張なので、 タグというものは囲んでなんぼのものだと思ってください。
　次に、オプションについてです。
　オプションと言えば、グラディウスなんかに３個くらいつけましたよね？
　そうすることで、機体がパワーアップしてどんどん強くなりましたなぁ〜…
　まぁ、オプションとはそういうものです。（笑）
　とどのつまり、付属品なわけなのですが、その付属品によっていろいろと多機能に してくれるものなのです。
　ＦＯＮＴタグを例にとってみましょう！！

ＦＯＮＴ
	ＳＩＺＥ	１〜７　又は　±１〜６
	ＣＯＬＯＲ	色名　又は　#ＲＧＢ
	ＦＡＣＥ	フォント名等

　上のようにタグ命令に対してそれぞれオプションを持ちます。
　これを詳しく説明すると、フォントのサイズというのは、

　　ふぉんとさいず１
　　ふぉんとさいず２
　　ふぉんとさいず３
　　ふぉんとさいず４
　　ふぉんとさいず５
　　ふぉんとさいず６
　　ふぉんとさいず７

と大きさを変えるものです。
　私の知る限りネスケなどの古いバージョンではこの大きさが全て出ない場合が ありますが、最近のものには何ら関係のないことです。
　又、±によって相対的にその差を示すこともできます。
　カラー設定は、色見本などの色を文字として指定することや、 直接フルカラーを設定することができます。

　　<FONT COLOR="red">赤のつもり</FONT>
　　<FONT COLOR="#ff0000">赤のつもり</FONT>

のように設定します。
　ちなみに上のタグは実行上の意味は同じです。
　まぁ、文字表記は色見本があればなんとかなるので、ネットで探してください。
　私は脳がＲＡＭ領域で占めてるので、文字を使わずに全て自分で 色指定をしています。(苦笑)
　よって、そちらの説明をします。
　まずは、＃の意味ですね。
　これは、特に意味はありません。
　ただ、フルカラーの設定上１６進法用いられているので、 どうしてもアルファベット使ってしまい、そのせいで文字指定と混乱してしまうので、 判別のために用意された文字なわけです。
　だから、それは覚えるしかありません。
　そして、１６進法というのは０〜１５までの数字を値として使うものです。
　しかし、１０〜１５までは文字がないので、Ａ〜Ｆで代用しただけの話です。
　良くわからない人は、時計を見てみましょう。
　１秒×６０＝１分、１分×６０＝１時間、ですよね？
　これは６０進法になっているのです。
　つまり、６０個で次の位になるってことなんです。
　同様に１６進法は１６個で次の位です。
　たとえば、Ａ０（１６進）＝１６０（１０進［一般］）です。
　それで、色というものは、Ｒ（赤）Ｇ（緑）Ｂ（青）から成り立っていて、 それがそれぞれ０〜２５５の値までを取ります。
　１６進の範囲では００〜ＦＦです。
　これを用いて６文字を２文字ずつ区切ってＲＧＢ埋めていくと色ができます。
　上の赤の例を参考にしてください。
　あとは、黒は００００００で、白はＦＦＦＦＦＦってことでしょうかね？
　この設定を覚えるとどんな色でも自分で自作できるので、文字にグラデーションを かけることなどもでき、それなりに使えます。
　その他オプションとしてフォント自体を設定できるＦＡＣＥ（顔）ってものも あります。
　これを用いると味のあるＨＰができるので、お勧めだったりしますが、いろいろと制約を 考えておかないと、プラウザによっては味気ないＨＰに展開してしまうので、 初心者向きとは言えませんので却下します。

　そして、オプションと言うものは多重に重ねることができます。

　　<FONT SIZE=6 COLOR="#ff0000">赤のつもり</FONT>

　こんな感じです。
　それで、他にもいろいろと多くタグがあるのですが、 それを書き出してる時間がないので（苦笑）、 私が良く参考にしているＵＲＬを書いておきます。

　　http://www.din.or.jp/~rinn/

　とっても、偉い人のサイトなので良く拝んでおくように！！（笑）