フォルダの構造を知ろう

ホームページにもフォルダはあります

みなさんが使っているパソコンでは、全てのファイルを同じ場所に保存するなんてことはされてませんよね？
ちゃんとフォルダごとに整理されているはずです。

ホームページにおいても、ファイルはサーバーというパソコンのスペースに保存さているわけですから、普段使っているパソコンと同じ考え方ができます。正確にはフォルダのことを、ディレクトリと呼びます。

ディレクトリのアドレス(URL)と階層

ディレクトリについて、ホームページのアドレス(URL)に注目してみましょう。例えば、
http://hoehoe.com/test/moe.html
というアドレスは、http://hoehoe.com/というホームページの、testというディレクトリ(フォルダ) にある、moe.htmlというファイルを指しています。

普通のパソコンと同じように、複数のディレクトリ(フォルダ)を作ることも、ディレクトリの下にディレクトリを作ることもできます。
(例)

上の図で、ホームページのURLが「http://hoehoe.com/」の場合、「folder1」ディレクトリのURLが
「http://hoehoe.com/folder1/」になるのはわかると思います。

では「folder1」の下にあるのディレクトリ「folder1-1」の場合はどうなるのでしょうか。
これは「http://hoehoe.com/folder1/folder1-1/」になります。

さらに下の「folder1-1-1」なら、「http://hoehoe.com/folder1/folder1-1/1-1-1/」です。

このように、ディレクトリの階層は「/」(スラッシュ)で区切ります。
ちなみにURLの最初の「http://」のスラッシュは、データを通信するためのおまじないのようなものなので、これとは関係ありません。

ディレクトリやファイル名は半角英数字のみ

皆さんの使っているパソコンでは、フォルダやファイルに「マイドキュメント」や、「新しいフォルダ」など、ひらがな、カタカナ、漢字などを使って好きな名前をつけていると思います。

ですが今までに例として出したディレクトリ(フォルダ)の名前は「test」、「folder1」、「folder1-1」など、アルファベットと数字ばかりですよね。

ここはサイトを作ろうとする人が最初に一番間違いやすいポイントなのですが、ディレクトリやファイルには半角のアルファベットと数字の名前しかつけることができません。半角スペースもダメです。

「http://nantoka.com/新しいフォルダ/」なんていうアドレスのホームページは見たことありませんよね？

アルファベットは大文字、小文字どちらでもつけることができますが、通常は小文字を使います。

英数字のほかに一部の記号も使えますが、一般的には「-」(ハイフン)と、「_」(アンダーバー)くらいしか使われません。

indexファイルをお忘れなく

moe.htmlのようなファイルを指定せずに、http://hoehoe.com/test/abc/のように、ディレクトリそのものを指定してアクセスしたらどのように表示されるのでしょうか。
試しに http://te-koku.com/hp/index/
にアクセスしてみて下さい。
ファイルを指定していないのに、ちゃんとページが表示されたはずです。
次にこのページを開いてください。
http://te-koku.com/hp/index/index.html
さっき開いたhttp://te-koku.com/hp/index/と同じ内容のページが表示されるでしょう？
ほとんどのサーバーでは、ディレクトリそのものを指定して開くと、自動的に「index.html」という名前のファイルを表示するようになっています。
では、もしサーバーにindex.htmlを転送していなかったらどうなるでしょうか。
http://te-koku.com/hp/blank/
サーバーによって異なりますが、多くの場合はこのように、開いたディレクトリにあるファイルの一覧を表示することが多いです。
(ちなみに一覧に表示されている5つのhtmlファイルは、このために作成した空のファイルです。)
このままではディレクトリの中に入っているファイルが訪問者に筒抜けですし、好き勝手にダウンロードされる可能性もあるので、ディレクトリごとにindex.htmlを入れるのを忘れないようにしましょう。

わかりやすいディレクトリ構造にしよう

一つのディレクトリにいくつものファイルを置くこともできますが、ジャンルごとにディレクトリを作って、適切にファイルをわけるようにしましょう。
かといって、一つのファイルごとにディレクトリを作るなんてことはしてはいけません。自分で編集する時にわかりくくなるだけです。