Skip to main content

絶対パスと相対パス

【HTML入門】#13.絶対パスと相対パス (六月 2026)

【HTML入門】#13.絶対パスと相対パス (六月 2026)
Anonim

Webデザインの側面は、ハイパーリンクよりもWeb中心です(一般的には リンク )。ページ上にリンクを作成して読者が他のコンテンツに簡単にアクセスできるようにすることは、ウェブサイトを印刷媒体や放送媒体などの他の通信媒体とは別に定義する特質の1つです。

これらのリンクはページに簡単に追加でき、サイトやWeb上の他のWebページにリンクすることができます。画像、ビデオ、文書などの他のリソースへのリンクを持つこともできます。それでも、リンクを追加するだけでなく、多くの新しいWebデザイナーが最初に理解するために苦労している項目の1つです。特に、ファイルパスの概念と、絶対パスと相対パスの違いを意味します。 1つが他のものの代わりに使用されるとき。

上記の各リンクインスタンスでは、サイトのさまざまなページやリソースにどのように接続するかを検討する必要があります。具体的には、どの種類のURLパスを書くかを決める必要があります。 Webデザインでは、リンクを作成する2つの標準的な方法と、使用できる2種類のパスがあります。

  • 絶対パス
  • 相対パス

絶対パスのURL

絶対パスは、インターネット上の特定の場所を参照するURLを使用します。これらのパスには、リンクパス自体の一部としてドメイン名が含まれます。このWebページへの絶対パスの例は次のとおりです。

https://www.Go-Travels.com/web-typography-101-3470009

自分以外のドメインにあるWeb要素を指す場合は、通常は絶対パスになります。たとえば、ここに別のウェブサイトのページにリンクしたい場合は、あるドメイン(webdesign.Go-Travels.com)から別のドメインに移動しているので、そのリンクの完全なURLを含める必要があります。そのリンクは、そのリンクの「href」属性の値として使用されるURLをページ内の要素に追加するだけです。

したがって、自分のサイトから離れたものにリンクしている場合は、絶対パスを使用する必要がありますが、自分のドメインのページやリソースについてはどうでしょうか?自分のサイトのページにリンクしている場合でも、実際には絶対パスを使用できますが、必須ではなく、開発環境によっては絶対パスが問題を引き起こす可能性があります。

たとえば、Webサイトの作成時に使用する開発環境があり、そのURLにすべてのURLを絶対的にコーディングする場合は、サイトが公開されるときにそれらをすべて変更する必要があります。この問題を回避するには、ローカルリソースのファイルパスに相対パスを使用する必要があります。

相対パスのURL

相対パスは、リンクが存在するページに応じて変化します。相対パスは、リンク先のページ(つまり名前)に関連しています。自分のサイトのページ、またはそのサイトの「images」ディレクトリ内のイメージにリンクしている場合は、相対パスが使用されます。相対パスは、見た絶対パスとは異なり、ページの完全なURLを使用しません。

相対パスを使用してリンクを作成するには、いくつかのルールがあります。

  • 現在のページと同じディレクトリにあるリンクには、パス情報がリストされていません。

    ファイル名

  • サブディレクトリは、スラッシュを付けずに表示されます。

    毎週/ファイル名

  • 1つのディレクトリ上のリンクは次のように表示されます。

    ../ファイル名

相対パスを決定する方法

  1. まず、編集中のページのURLを定義します。上記の例の記事の場合、それは

    https://www.Go-Travels.com/web-typography-101-3470009

  2. / web-typography-101-3470009

ここでは、パスをスラッシュ(/)で始めることで相対パスを記述しています。その文字は、ブラウザに現在のディレクトリのルートに行くように指示します。そこから、特定のリソースに必要なフォルダやファイル名を追加したり、フォルダやドキュメントにドリルダウンしたりして、リンクしたい正確なリソースに最終的に着陸することができます。

要約すると、サイト外にリンクされている場合は、接続先の絶対パスを含む絶対パスを使用します。コーディングしているページが存在するドメイン上のファイルにリンクされている場合は、相対パスを使用して、現在のページからサイトのファイル構造を経由して、必要なリソースに移動することができます。