使用するリンク:絶対リンクか相対リンクか?

意味:サイト内のナビゲーションに使用するアドレスは何ですか? すでに機能しているサイトを含むsite.ruドメインに別のサブサイトを作成し、そのファイルがショップフォルダーにあるとします。 このサブサイトのURLは次のようになります。



http://site.ru/shop
      
      





タスクを複雑にした理由は、この記事の最後で明らかになります。



1.絶対リンク(絶対)



 href="http://sites.ru/shop/" —      href="http://sites.ru/shop/t-shirts/t-shirt-life-is-good/"c   
      
      





2.相対リンク



相対リンクを使用すると、毎回参照ポイントの開始ページが取得されます。



 href="t-shirts/t-shirt-life-is-good/" —        href="../../"
      
      





ここで最初の結論を出すことができます。 相対アドレスは絶対アドレスよりも短いように見えますが、サイトのどのページでも同じリンクを変更せずに使用できるので、絶対アドレスのほうが望ましいです。



中間オプション



上記では、2つの極端なケース、純粋な絶対リンクと純粋な相対リンクを調べました。 ただし、他のリンクオプションがあります。 まず、この世界ではすべてが相対的であると言わなければなりません。 これはリンクにも適用されます。 リンクが絶対であると言って、あなたは常に示すべきです:何に関して。 簡潔にするため、以下で検討するすべての中間リンクオプションについて同意します。以下の構成を使用して「...に関連するアドレス」を呼び出しますが、本質的にはすべて絶対です。 最初の2つの参照(1および2)は、引き続き単に「絶対」および「相対」と呼ばれます。



3.プロトコルに関連するアドレス(プロトコル相対)



 href="//sites.ru/shop/" —    href="//sites.ru/shop/t-shirts/t-shirt-life-is-good/"
      
      





プロトコルを指定せずにアドレスに切り替えることをお勧めします。 ただし、http://とhttps://は異なるサイトであると考えられているため、移行期間の長さはわかりません



4.ドメインルートフォルダーに相対的なアドレス(ルート相対)



 href="/shop/" —    href="/shop/t-shirts/t-shirt-life-is-good/"
      
      





サイトのすべてのページが同じドメイン内にある場合、これは適切な選択です。 サイトを別のドメインに移管する場合、リンクで大量のドメインを置き換える必要はありません。



5.サイトのメインページに相対的なアドレス(ベース相対)



HTMLには<base>タグがあります。 すべての相対リンクとアンカーに自動的に追加されるベースアドレスを設定します。 このタグを<head>セクションに配置します。 ベースアドレスとして、メインページのURLを示します。



 <base href="http://sites.ru/shop/"> href="" —    href="t-shirts/t-shirt-life-is-good/"
      
      





アドレスの以前のバージョンのすべての利点に加えて、ここにもう1つ追加されます。サブフォルダーの名前がhrefから消えたため、サイトを任意のドメインだけでなく任意のサブフォルダーにも安全に転送できるようになりました。 これは開発に便利です。作業中のコンピューターのWebサーバーの任意のサブフォルダーにサイトを構築し、サイトの準備ができたら、サイトファイルをホスティングに転送するだけです。



アドレスは相対として記録されますが、絶対として動作するという事実に慣れるだけです。 よく知られているhref = "#comments"構造は現在のページ内ではなく、メインページのURLが前に自動的に割り当てられるため、メインページに移行するため、アンカーについて特に注意する必要があります。 ハッシュの前に、現在のページのアドレスを明示的に登録する必要があります:href = "t-shirts / t-shirt-life-is-good /#comments"。



「実際の」絶対リンク(1、3、4)については、通常どおり機能します。ベースタグはそれらに影響を与えません。 ベース要素のアクションはhtmlドキュメントにのみ適用されますが、css、js、svgおよびその他のファイル内の相対URLには適用されません。



おわりに



リンクを使用するオプションは、各ケースで他の要因を考慮する必要があるため、決定する必要があります。 内部リンクの場合、サイトのメインページに相対的なアドレス(5.base-relative)を使用します。 サイトからの外部リンクおよびニュースレターには、絶対リンク(1.absolute)を使用することをお勧めします。



All Articles