ファイル master.html と slave.html を作って、相互にリンクで結んでみましょう：
| master.html |
|---|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<title>Master ファイル</title>
</head>
<body>
<h1>Master ファイル</h1>
<p><a href="./slave.html">スレイブ</a></p>
</body>
</html>
|
| slave.html |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<title>Slave ファイル</title>
</head>
<body>
<h1>Slave ファイル</h1>
<p><a href="./master.html">マスター</a></p>
</body>
</html>
|
この二つのファイルを同じディレクトリ内に置いてください。ハイパーリンクで相互に移動できるようになっていれば成功です。
相対 URL を、その基準 URL に基づいて絶対 URL に変換する事を RUL 解決と呼びます。ここでは、基準 URL "http://www.foo.com/public/" に対する相対 URL の解決を演習形式で行います。
./contents.htmlこのディレクトリ http://www.foo.com/public/ を基準 URL とする index.html に、次の様に記述されていたとします。この相対 URL が指し示す位置はどこでしょうか？
./contents.html
答えは、同じディレクトリの contents.html と云うファイルです。絶対 URL に翻訳すると、 http://www.foo.com/public/contents.html になります。
| 問題 | 解答 |
|---|---|
www.foo.com
|
+--/ (root)
|
+--public + ./contents.html
|
www.foo.com
|
+--/
|
+--public
|
+--contents.html <<-- This File
<< http://www.foo.com/public/contents.html >>
|
./links/bookmark.htmlでは次の相対 URL ではどうでしょうか？
./links/bookmark.html
答えは、index.html があるディレクトリの中にあるディレクトリ links の中にある bookmark.html と云うファイルです。絶対 URL では、 http://www.foo.com/public/links/bookmark.html と翻訳されます。
| 問題 | 解答 |
|---|---|
www.foo.com
|
+--/ (root)
|
+--public + ./links/bookmark.html
|
www.foo.com
|
+--/
|
+--public
|
+--links
|
+--contents.html << This File
<< http://www.foo.com/public/links/bookmark.html >>
|
../cover.htmlでは次；
../cover.html
答えは、 index.html があるディレクトリの一つ上のディレクトリにある cover.html と云うファイルです。絶対 URL に翻訳すると、 http://www.foo.com/cover.html です。
| 問題 | 解答 |
|---|---|
www.foo.com
|
+--/ (root)
|
+--public + ../cover.html
|
www.foo.com
|
+--/
|
+--cover.html <<-- This File
|
+--public
<< http://www.foo.com/cover.html >>
|
../doc/private.htmlでは最後の問題です；
../doc/private.html
答えは、 index.html があるディレクトリの一つ上のディレクトリの中にある doc と云うディレクトリの中にある private.html と云うファイルです。絶対 URL に翻訳すると http://www.foo.com/doc/private.html となります。
| 問題 | 解答 |
|---|---|
www.foo.com
|
+--/ (root)
|
+--public + ../doc/private.html
|
www.foo.com
|
+--/
|
+--doc
| |
| +--private.html <<-- This File
|
+--public
<< http://www.foo.com/doc/private.html >>
|
因みに、このサイトのトップページは、相対 URL では、 ../../../index.html となります。トップページから見ると、御覧になっている本ファイルは三階層下のディレクトリになる訳です。
"." （カレントディレクトリ）や ".." （一つ上の階層のディレクトリ）は、 WWW を提供しているマシンで起動している UNIX という OS のファイルシステムの、シンボリックリンク (symbolic link, symlink, soft link) というモノです。 Windows でもこの仕組みを真似ています。
興味があれば、ファイルシステムやシンボリックリンクについて、調べてみてください。