パスとは…
「パス」とは、ファイルやディレクトリなどが格納されている位置を示す文字列のことです。
通常、コンピュータのファイルシステムやウェブ上のリソースにアクセスする際に使用されます。
ウェブ開発では、サイトのファイルやページにアクセスするためにパスが使用されます。
具体的には<img>タグの src や<a>タグの href などに使われます。
パスの指定方法には、大きく分けて以下の三つの方法があります。
それでは順番に見ていきましょう。
絶対パス
絶対パスとは、ファイルやディレクトリへの完全な位置を示すパス情報です。
ファイルやディレクトリの位置をシステム全体でとらえて指定します。
どの位置から指定しても絶対にたどりつけるパス指定方法です。
「abc.png」のパスを絶対パスで表現すると以下の様になります。
https://www.ドメイン.ne.jp/image/abc.png上記の例の通り、URLで示され、どのディレクトリからでも正確に指定できます。
デメリットとしては、以下があげられます。
①サイト移設などでドメインが変わるなどの変更があった場合、パスを修正する必要がある。
②サイトの開発段階など、まだ、ドメインが決定していないうちでは絶対パスでは指定できない。
③相対パスと比べるとパスの文字数が多くなるので、時間的にコストがかかり、また、ソースコードも読みずらくなる。
以上のようなデメリットがあげられますが、同じシステム内ではない外部サイトのパスを取得したい場合は、相対パスでは取得できません。
必然的に絶対パスのみでの表示となります。
同システム内のパスを取得したい場合は、絶対パスより相対パスの方が向いています。
相対パス
相対パスとは、ファイルやディレクトリへのパスが、現在の場所からどれだけ離れているかを示します。
同システム内で現在地を起点として、目的のデータにたどりつくパス指定方法です。
相対パスの書き方は以下のとおりです。
■カレントディレクトリ
現在、作業中のディレクトリを指します。
相対パスはこのディレクトリから位置を指定します。
■親ディレクトリ
【 .. 】（ドットドット）で現在のディレクトリの「親」を示します。
つまり【 ../ 】で1つ上の階層に移動します。
上記を相対パスで表すと以下の通りとなります。
../image/abc.png表示させたいページ（index.html）から見て、表示したいファイルの場所を指定しています。
１.【 ../ 】で一つ上の階層 site フォルダに移動
▼
２. image フォルダに移動してabc.pngファイルを表示
サイト制作時にはこの相対パスで構築することがほとんです。
システム内で大幅にディレクトリ構成が変更しない限り、相対パスなら、サイト移設などでドメインが変更しても、修正する必要がなく柔軟に対応できます。
ルート相対パス
ルート相対パスは相対パスの一種です。
サイトのルートディレクトリからの相対的な位置を指定します。
ドメイン直下を起点として目的のデータへたどりつきます。
ルート相対パスは常にスラッシュ【 / 】で始まります。
/image/abc.png通常の相対パスはカレントディレクトリを基準にしているため、位置関係を理解する必要があります。
一方、ルート相対パスではカレントの位置に依存せず、常にウェブサイトのルートディレクトリからの相対位置を指定します。
そのため、パスが相対的でありながら、ウェブサイトの構造が変更されても対応しやすいという利点があります。
どの階層から指定しても同じパスが使えることから、システム内の構造が複雑な場合などは特に有効なパス指定方法です。
まとめ
それぞれの指定方法を解説いたしました。
パスの指定方法を理解することはサイト制作において必然となる知識です。
通常、外部サイトを指定する際は【絶対パス】、システム内を指定する際は【相対パス】もしくは【ルート相対パス】で指定するのが一般的です。
特に相対パスでは、ディレクトリ構造の理解が不十分で、リンク切れになる場合がありますので、きちんとパス指定の方法を理解しておきましょう！