Web制作を進める上で必須の知識となる「パス」の扱い方には、絶対パス・相対パス・ルートパスの3種類があります。
それぞれの違いを理解し、正しく使い分けることでリンク切れを防ぎ、安定したサイト運営が可能になります。
「各パスの意味や記述方法を知りたい」「リンクの最適化をしたい」とお考えの方に向けて、わかりやすく解説します。
目次
パスとは
パスとは、ファイルやフォルダの場所を示す情報で、Webサイト内のページや画像などのリソースにアクセスするための「道しるべ」としての役割を果たします。パスの指定方法によっては、リンク先が異なったり、表示エラーが発生したりするため、正確に設定することが重要です。
パスの中にもいくつか種類が存在します。それぞれ目的によって使い分け、正しく使用することが必要です。
絶対パス
絶対パスは、ファイルのフルパスを示し、URLのプロトコル(https://など)から始まるパス指定方法です。
サーバーの場所に関わらずファイルの正確な位置を示します。
メリット
- どのページにいてもリンクが確実に正しい位置を指すため、リンク切れを防ぎやすい
デメリット
- ドメインが変わるとリンクが無効になり、複数ページでリンクを書き換える手間が発生する(ローカル環境やテスト環境で作業を行う際、環境によってリンクを書き換える必要があります)
- 必然的にURLが長くなるため、ファイルの場所を指定する作業に時間がかかる
- サーバー環境を用意しないと使用できない
相対パス
相対パスは、リンク元の位置からの相対的なパス指定方法です。リンク元のページから見た位置関係でリソースを指定し、たとえば images/photo.jpg や ../about/index.html のように記述します。
メリット
- ページ間で移動してもリンクが機能するため、異なる環境での再利用が容易であり、リンク先の一括変更がしやすい
- Webサーバに上げずに作業を行えるため、ローカル環境のブラウザで制作やテストを行える
- 絶対パスよりも短いURLを記述できるため、作業の負担が軽減される
デメリット
- 前提として、同じサーバ内にファイルやデータがなくてはいけない
- 自分が今いるページの位置を起点にするため、そのページが移動するとリンク切れになる (現在開いているページの階層が変わるなど)
ディレクトリの構造が決まっているプロジェクトや、開発環境・本番環境でのURLが異なる場合に便利です。
ルートパス
ルートパスは、ルートフォルダ(枝分かれした最上位階層のディレクトリ)を起点にパスを指定する方法です。パスの先頭にスラッシュ(/)をつけて、/images/photo.jpg のように書き、現在のドメインからの相対的な位置を示します。
現在編集中のファイルを起点としている相対パスに対して、トップ階層からの相対パスを指定します。
メリット
- どの階層から指定しても同じパスが使える
- ドメインのみが変更となった場合、修正が不要
デメリット
- ディレクトリ名などを変更した場合、パスを書き換える必要がある
- サーバー環境を用意しないと使用できない
目的に合わせて使い分けましょう
それぞれのパスには異なる特性と役割があり、状況に応じて使い分けることが重要です。
基本を理解し、目的に合わせて適切なパスを選ぶよう心がけましょう。