アドレス編

ここでは「http://」で始まるHTTPでのアドレスを指しています。HTMLの記述でリンク先のアドレスを指定する方法にはhttpから全アドレス省略せず絶対アドレスで記述する方法と、重なったアドレスを省略する相対アドレスの記述法がありますが、同サーバ内では普通は相対アドレスで記述します。このアドレスは階層（ディレクトリ）構造で構成されています。フォルダの中にファイルを収めるのと同じです。

絶対アドレス・相対アドレスとは何なのか、問題を解く側も知っておく必要があります。例えば、次のリンク。

• [ ディレクトリサンプル ]

このソース部分は以下の通りです。

<ul>
<li>[&nbsp;<a href="./directory/">ディレクトリサンプル</a>&nbsp;]</li>
</ul>

アドレスそのものを指す記述は引用符（"）で囲まれた「./directory/」の部分です。これが先で「相対アドレス」と説明したものです。ソースでの記述はこれだけですが、だからといって「./directory/」をアドレスとして入力するだけでは目的のページは開けません。目的のページを開く場合は「http://」から、即ち「絶対アドレス」で指定する必要があります。実際にリンク先へ飛んでアドレスを確認して下さい。「http://」から始まり最後の記述のみソースで指定されている「/directory/」に変わっているはずです。

アドレスにある「/」は階層の仕切りです。私はソースに「./」と付けて書いていますが、これは省略しても構いません。「./」は「同一ディレクトリにある」という意味です。階層が下がる（「/」が増えていく状態）なら記述もその通り増やしていけばいいでしょう。しかし、階層が上がる場合は相対アドレスでの記述はどうなるでしょうか？　その場合は「../」とドット（.）を二つにするのです。「../」は「階層が一つ上がる」という意味です。これを増やせばその分階層が上がっていく事になります（「../../」二階層上がる）。絶対アドレスで書いた方が楽に思われるかも知れませんが、それだとサイトを移転するたびにアドレス部分のソースを書き換える必要が出てきます。それに冗長以外のなにものでもありません。

[ ディレクトリサンプル ]の内部はややこしく見えますが図で表すなら単純に次の通りです。アドレスとソースを確認しながら、ディレクトリとはどういったものか掴んで下さい。

├directory(/index.htm)
　 ├directory1(/index.htm)
   ｜  ├directory1a.htm
   ｜  └directory1b.htm
   ｜  
   └directory2(/index.htm)

Indexファイルはアドレスとして入力する時には特に必要ありません。なくても自動的にファイル検出されます。

ただし、サイトを管理する上ではIndexファイルは設置しておくべきです。サイトを公開するサーバにもよりますが、Indexファイルが設置されてない場合エラーページになるならまだしも、階層中のファイルが全て一覧表示されるサーバもあります。特に隠しページでは問題中の下層ファイルが見えてしまったら致命的です。次のページがそのサンプルです。

• [ ファイルに関する注意事項１ ]

普段のネットではあまり開く事がないエラーページですが、隠しページ探しでは存在しないファイル、404へのアクセスは避けては通れません。他にもページが開けない理由は幾つかありますが、500の場合は制作者のミスである可能性が高いです。掲示板などのCGIの設置をミスした時にこのエラー結果が出てきます。

主なエラーページ

番号	説明
400	Bad request:リクエスト方法の間違い
401	Unauthorized:認証失敗時のエラー
403	Forbidden:アクセス制限に対するエラー
404	Not Found:ファイルが存在しない時のエラー
500	Internal Server Error:サーバ内部エラー

ファイル名

【 リンク編 】でも説明しましたが、例えば、ここでのアドレス「http://（省略）/lecture/address.htm」の「address」がファイル名です。これはアドレスの一部ですから大文字なら大文字、小文字なら小文字でと正確に打つべきです。ただし、サーバによっては例外がないわけではありません。拡張子がなくとも勝手に判断、大文字小文字も勝手に判断する所もあります。次のページがそのサンプルです。

• [ ファイルに関する注意事項２ ]

answeR.htmだろうとaNswerだろうとanSWer.htmだろうと……同じページが拾えたと思います。しかし、これはあくまで例外、これを期待されない方が良いでしょう。不正確なアドレスには飛ばないものです。またサーバによっては付けられるファイル名に規制がひかれている場合もあります。

ファイル名自体を使った問題は隠しページではよくあります。ファイル名を考えるのも制作者なので当然といえば当然ですね。後、何処にも書かれていなくても日本語から英語、英語から日本語に変換する事はある意味常套手段として使われます。それから、ローマ字で打ち込む時に注意しなければならないのは、表記方法には個人個人癖があるという事です。ここは制作者の癖に合わせるのが一番ですが、全種類打ち込むまでは考えから消去しない方が良いでしょう。解答自体は正解してるのにいつまでもヒットしないのはつまらないですからね。何より固定観念に縛られず試す事が大切です。

ディレクトリ名も当然制作者が考えています。ただし、こちらには制限もあります。ウェブサイトの管理人だからといって全て自分で付けているとは限りません。

これらの発言に対して理解して戴けたのか軽いテストをしますね。

• [ 表記法 ]

拡張子

.(ドット)以下を拡張子と呼び、ファイルの形式を表しています。例えば、ここでのアドレス「http://（省略）/lecture/address.htm」の「htm」が拡張子です。これは、このファイルが「HTML文書」である事を表しています。ただしファイルの形式を表しているといっても、拡張子も最終的には制作者によって付けられているので、でたらめな拡張子にする事は可能です。ちなみに、ほとんどのWebページはHTML文書によって記述されているので「html」もしくは「htm」はネットで一番よく見かける拡張子です。

拡張子一覧

拡張子	種類	拡張子	種類
.htm(l)	HTML文書	.jp(e)g	JPEG画像
.txt	テキスト文書	.gif	GIF画像
.css	Cascading Style Sheets	.png	PNG画像
.js	Javaスクリプト	.zip	ZIP圧縮
cgi	CGIスクリプト	.lzh	LZH圧縮
.mid(i)	MIDI音声	.mp(e)g	MPEG動画
.mp3	MP3音声	.swf	Shockwave Flash

これは数あるタグの一部に過ぎません。一般的と判断される拡張子はたくさんあります。私の所有してるツールだけでも音楽・画像形式が数10、圧縮形式で100以上とその他様々な形式に対応しています。その事からも拡張子の多さがお解りになると思います。やる前に土台作りをする事は大切な事です。最低限基本的なものだけは押さえておきましょう。ネットを廻っていると必ず拡張子に関わる機会があるので、知らなければ然るべきサイトを利用するなり意欲的に調べる事が大切です。拡張子こそファイルを知る上で唯一の情報源だともいえます。

Windowsでは拡張子を表示しないのを基本設定にさせていますが、ファイル名だけでは一体何のファイルかわからないので表示するように設定した方が良いです。フォルダを開いて「ツール→フォルダオプション→表示」の「登録されているファイルの拡張子は表示しない」のチェックを外しましょう（画像）。その他にも自分の使いやすいように任意で設定を変更されても良いと思います。

• 参考ツール【 拡張子判別ソフト 】

外部ファイル

講座中のページは外部ファイルのCSSで外観整形されています（ただし一部説明上の記述は除く）。ソースを覗けば上部に記述された拡張子「.css」のファイルがそれに当たります。この外部ファイルに何かを隠す場合もよくあります。怪しいと思ったら外部ファイルを直接覗いてみましょう。このページにだけ変なスタイルシートがあるので、試しにファイルの中味を覗いてみて下さい。それから、ひょっとしたら「トラブル！？」と思われる事が起こりえます。。その時は別の講座ページを読み込むかページを移動（ブラウザの戻る・進む）した後にまたこのページに戻ってくれば直りますから安心して下さい。

外部ファイルのCSSをいきなり覗こうにもファイルが開けない場合があるかも知れません。これはWindowsではファイル拡張子の「関連付け」がなされていない為です。「関連付け」というのは拡張子とそれを実行する為のアプリケーションを結びつけるプログラム設定です。その時は、開けないファイルを一度実行してから選択画面でこの関連付けを行うか、何かフォルダを開いてみてエクスプローラから「ツール→フォルダオプション→ファイルタイプ」で普段使っているテキストエディタにでも設定して下さい。関連付け設定を行うのが面倒なら一度CSSファイルを落とした後、テキストエディタでそのファイルを開くのも一つの手段です。

では、ここで一問。

• [ アドレス編参照 ]

例題

訪問者に対して失礼な例題名かな？そこは気にしないで下さい。これは私の普段のサイト移動です。

• 例題【 出歯亀 】

• 次の【 フレーム編 】へ進む