絶対パスと相対パスとルートパスの完全マスター

WEB制作のHTML記述における、他のサイトやファイルへのリンクのＵＲＬ書き方、つまりパスの話。

絶対パス

絶対パスは、フルパスとも言ったりしますが、目的のリンク先のパスをhttps://から最後まで完全に書く方法です。

同一ドメインのサイト内リンクでは、ほぼ使うことはないと思いますが、サイト内のリンクであってもディレクトリ階層が深い場合に、正確にファイルにリンクするために使用することがあります。

相対パスは、リンクを記載するファイルの場所を基準にしてリンク先を記載する方法です。

<a href=”./xxxxx.html”>

同じ階層にあるxxxxx.htmlファイルにリンク

<a href=”../XXXX.html”>

階層を１つ上に戻ったディレクトリにあるxxxxx.htmlファイル

<a href=”../../XXXX.html”>

階層を２つ上に戻ったディレクトリにあるxxxxx.htmlファイル

<a href=”./yyyyy/xxxxx.html”>

同じ階層にあるyyyyyディレクトの中のxxxxx.htmlファイルにリンク

WEBサイトの制作は同一ドメイン内で行われるのが通常ですので、画像や別ページへのリンクなどこの相対パスで記載するのが一般的になっています。

パスの書き方の説明で抜けていることが多いのが、このルートパスです。

「ルートパス」というのは、今のファイルの位置は無視して、ルートを基準にリンク先を指定する方法です。

ルートというのは、公開フォルダであるpublic_htmlであり、ディレクトリの一番上ということなります。

説明がわかりにくいかもしれないので、具体的な例を。

<a href=”/yyyyy/xxxxx.html”>

上記がルートパスでの記載方法になります。相対パスの「./」ではなく、「/」で始まっていることにお気づきでしょうか？

つまり、リンクが「/」ではじまるとそれはルートのディレクトリを基準に指定していることになり、具体的には、ルートにあるyyyyyフォルダ（ディレクトリ）の中にあるxxxxx.htmlファイルにリンクという結果になります。

ルートを絶対的基準にする点で絶対パスに近いですが、絶対パスでhttps://～と書くとWEBを探しに行くことになりますが、ルートだと、あくまでルートからの位置を辿るだけなので、絶対パスとは意味が違ってきます。

【ルートパスの使いどころ】

ややテクニカルな話になるのかも？しれませんが、階層の深さが違うファイルから共通ファイルを読み込む場合（共通のヘッダーやフッターなど）、共通ファイル内に相対リンクがあると、意図しないリンクアドレスが生成され404エラーなどの問題が生じます。

しかし、別階層から共通で読み込まれるファイル内に記述されているリンクを相対パスではなくルートパスにしておけば、どこから読み込まれようがリンク先を統一することが出来大変便利です。

ヘッダーやフッターを共通化して別ファイルで読み込んでいる場合は、その読み込みリンクにルートパスを使うと便利ですね。