html - URIと相対パスを使用してファイルを参照/リンクします。どちらが良いですか？

Question

私のWebページhttp://www.example.com/homepage.htmlの場合、 CSSファイルなどの静的リソースをリンクするための最良の方法はどれですか。

• http://www.example.com/css/base.css
• http://example.com/css/base.css
• /css/base.css

Answer 1

どちらも良くありません。

リンクドキュメントを別の場所に移動しても存続します。もう1つは、ツリー全体を別の場所に移動しても存続します。

ほとんどの場合、後者の方が便利です（環境（開発、ステージング、テスト、本番）間でリンクが機能するため）が、ニーズは異なる場合があります。

Answer 2

相対パスを使用するのが最適な方法です。

例： http： //www.example.com-絶対パス

相対パス

    var style="css/base.css";
    var style1="css/base1.css";

次に、絶対パス+スタイル。または絶対パス+style1。ハードコーディングせずに相対パスを変更できます。

Answer 3

内部で提供されるリソースの場合、Quentinが述べた理由により、通常は相対URLを使用します（それに応じて賛成）。

ただし、絶対URLは、次のような注意が必要ないくつかの重要なシナリオで役立ちます。

• CDN（コンテンツ配信ネットワーク）を使用して静的ファイル（質問で言及したCSSファイルなど）をより迅速に提供する場合。これらは自分以外のサーバーから提供されるため、場所を完全に指定する必要があります。
• プロトコルを変更する必要がある場合。最も一般的なケースは、たとえばサインインや購入などのアクションのためにhttpsに切り替えることです。
• あなたが電子メールにリンクを入れているなら、もちろん相対的な経路はどこにも行きません。スタイルはHTMLメールにインライン化されるため、これはCSSファイルの読み込みには関係ありませんが、それでも、たとえば画像の場合は検討する必要があります。