HTMLファイルとリンクする際に、絶対パス、相対パス、ルート相対パスなどがあり、絶対パスは誰から見ても変わらない住所(URL)を示し、相対パスは自分の居る場所から見た相手の場所を示す、そして、ルート相対パスは、ドキュメントルート(最上位階層)からの位置を示します。
ルートというのは1番上のディレクトリ(フォルダ)のことで、「/」から始まり、ルートパスの基本的な用途は、大規模な案件の開発に使われ、ルートパスのメリットは、誰が見ても何処に何があるのか分かりやすいのとドメインを変更してもリンクを修正しなくても良いところです。また、サイト全体どこでも同じ表記ができ、分かりやすくシンプルなところです。
ルートパスのデメリットとしては、ローカル環境でルート相対パスを使いコーディングする場合の注意点は、ルート相対パスはローカル環境(PC)のルートパスから参照してしまうため、誤った参照となりパスが外れ、リンクや画像やCSSなどがブラウザに読み込まれず、XAMPP でローカルサーバーを立ち上げて、「http://localhost/〇〇.html」 で確認しなければなりません。
私も絶対パスや相対パスは知っていましたが、ルート相対パスは知りませんでした。これからは、相対パスとルート相対パスを使い分けることがフロントエンドエンジニアには必須のようです。
ルート相対パスは、ローカルサーバー環境を設定するなど面倒だけど、ワンステップ上のステージを目指すのであれば、環境設定はこれからも多くのプログラミングで必要となり、テスト環境と本番環境が常に同じソースであることから最高のルートパスと言われているそうです。
(※コーディングとは、HTMLやCSSの仕様に沿って制作したデザインをブラウザで見えるカタチにすることをコーディングと言います。)