ジオシティーズなどのweb上で作る前に、まず自分のパソコン内に作ってみましょう。これは練習の意味もありますが、あとでファイルの整理するのに便利なように、自分のパソコンの中とｗｅｂ上のディレクトリ構造を同じにしておいたほうがいいからです。珍獣のおともだちの場合、自分で作ったホームページはC:ドライブのMy Documentsの中にWebPageっていうフォルダ（ディレクトリ）を作って保存しているとのことでした。ここではその設定で説明してみようと思います。
では、デスクトップにあるマイコンピュータのアイコンを左クリックしてください。うちの場合は下のようなウインドウが開きます。
珍獣様のパソコンにはハードディスクが２台くっついてるので、２台目はＤ：ドライブになっておる。
そしたら、(C:)って書いてあるアイコンを左クリックしてください。まだ新たなウインドウが開いて、Ｃ：ドライブの中にあるファイルやフォルダが表示されますね？ そこからMy Documentsというフォルダを探して左クリックしてウインドウを開きましょう。
Windowsをふつうにインストールすると、このフォルダは必ずあるんです……よね、たぶん。
珍獣のおともだちは、ここにWebPageというフォルダを作ってあるらしいので、珍獣も作ってみました。
同じ条件で練習したい人も作ってみてください。新規フォルダの作り方は、「ファイル(F)→新規作成(W)→フォルダ(F)」です。
では、WebPageというフォルダを左クリックで開いてください。
これで、わたしたちはC:/My Documents/WebPage/というフォルダの中にいます。珍獣のおともだちは、ここにHPのトップページが入ってるんです。珍獣も雰囲気を出すためにindex.htmlをぶちこんでみましたが、ディスプレイの前の良い子のみんなはここまでまねしなくてもいいです(笑)これで準備完了！
つぎに、今開いているWebPageの中にひとつページを作ってほしいんです。フロントページやコンポーザーなど、HP作製ツールを使っている人は、いつも通りそれ使ってください。ファイル名はわかりやすいように1.htmにしてください。
内容もわかりやすいように決めちゃいましょうか。新規作成で空白ページを開いて、２．ｈｔｍへ
これだけ書いて名前を付けて保存。ファイル名は1.htmで、ちゃんとWebPageの中に保存してくださいね。
テキストエディターでタグを書いて作ってる人は、<HTML>って書いて、1.htmという名前でC:/My Documents/WebPage/にセーブしてください。
<BODY>
<A HREF="test/2.htm">２．ｈｔｍへ
</BODY>
</HTML>
そうしたら、もう一度WebPageのフォルダのウインドウを見てください。さっき保存した1.htmというファイルはちゃんとありますか？？
では、先に進みます。
今度はWebPageフォルダの中に新しいフォルダ（ディレクトリ）を作って、testという名前をつけてください。
やりかたは説明しなくてもわかると思いますが、いちおう説明すると、ウインドウの上の方にあるファイル（Ｆ）というメニューを左クリックしてメニューを開き、新規作成（Ｗ）→フォルダ（Ｆ）の順に選べば新しいフォルダが作製されて、名前を聞かれるはずです。ここでtestとつけてください。できましたか？
この、testというフォルダが、WebPageのサブディレクトリです。
また、WebPageはtestの親ディレクトリです。では、今作ったばかりのフォルダの中に入ってみましょう。testというフォルダを左クリックしてください。ウインドウが開きましたね？これであなたはtestの中にいます。いま作ったばかりのフォルダなので、中はからっぽです。
からっぽなのを確認できたら次へすすみましょう。
今度はこのtestの中に、新しいページを作製します。もちろんＨＰ作製ツールを使っていいです。
内容は１．ｈｔｍへ
だけ。
これだけ書いて、testというフォルダの中に2.htmという名前で保存してください。
ちゃんとC:の中のMy Documentsの中のWebPageの中のtestの中に2.htmを作ってくださいね。そうしたら、もう一度testのフォルダのウインドウを見てください。さっき保存した2.htmというファイルはちゃんとありますか？
なかったら保存の仕方を間違えてますよ。保存する場所をまちがえてると、次の作業で失敗しちゃうので気を付けて！テキストエディターで作ってる人は、ここまでできたら次へすすみましょう。<HTML>って書いて、2.htmという名前でC:/My Documents/WebPage/test/の中にセーブしてください。
<BODY>
<A HREF="../1.htm">１．ｈｔｍへ
</BODY>
</HTML>
さて、いよいよサブディレクトリと親ディレクトリの間にリンクをはります。
フロントページなどのツールで1.htmを開いてください。
そして、２．ｈｔｍへ
という文字をマウスで範囲指定して、リンク先を指定しましょう。
testというディレクトリ（フォルダ）の2.htmにリンクするんだから、test/2.htmという相対パスを書くんでしたよね？
前に書いたとおり、フロントページやコンポーザーはちゃんと相対パスで書いてくれると思うので、手で書かずにツールに書いてもらってもいいです。できたかな？
こんどは、サブから親へのリンクです。
2.htmをひらいてください。１．ｈｔｍへ
という文字をマウスで範囲指定して、リンク先を指定しましょう。
ひとつ上のディレクトリの1.htmへリンクするんだから、../1.htmという相対パスを書けばいいはずです。もちろん、ツールに書いてもらってかまいません。
テキストエディターで作ってる人は、すでにリンクできちゃってるのでこの過程は必用ないです。親へ移動するときの相対パス、サブへの相対パスをどう書くのかだけ再確認しましょう。できたら、この状態でプレビューしてみましょう。テキストエディターで書いた人もブラウザに読ませて動作を確かめてください。ふたつのファイルの間をちゃんと行き来できますか？できたら成功です。次はいよいよwebにアップロードします。
前のページへ 目次へ 次のページへ
