--- title: URL とは何か slug: Learn/Common_questions/What_is_a_URL tags: - Infrastructure - URL - urls - インフラ - リソース - 初心者 translation_of: Learn/Common_questions/What_is_a_URL ---

この記事では Uniform Resource Locators (URL) について説明し、その内容と構造を説明します。

前提知識: まずインターネットの仕組み、ウェブサーバーとは何か、および ウェブ上のリンクの背後にある概念を知る必要があります。
目的: URL の内容とウェブ上での URL の仕組みを学習します。

概要

URL は{{Glossary("Hypertext", "ハイパーテキスト")}}や {{Glossary("HTTP")}} とともに、ウェブの重要な概念の一つです。{{Glossary("Browser", "ブラウザー")}}がウェブ上の公開されたリソースを取得するために使用するメカニズムです。

URL は Uniform Resource Locator の略です。URL はウェブ上の特定の一意のリソースのアドレスにすぎません。理論的には、それぞれ有効な URL は一意のリソースを指しています。そのようなリソースは HTML ページ、 CSS 文書、画像などである可能性があります。実際には一部例外もあります。最も一般的なものは、もはや存在しないリソースや移動したリソースを指す URL です。URL で表されるリソースと URL 自体はウェブサーバーによって処理されるため、ウェブサーバーの所有者がそのリソースとその関連 URL を慎重に管理する必要があります。

アクティブラーニング

アクティブラーニングはまだありません。協力してください。

より深く

基本: URL の解剖

URL の例を次に示します。

https://developer.mozilla.org
https://developer.mozilla.org/en-US/docs/Learn/
https://developer.mozilla.org/en-US/search?q=URL

これらの URL のいずれかをブラウザーのアドレスバーに入力して、関連するページ (リソース) をロードするように指示することができます。

URL はさまざまな部分で構成されていますが、必須のものと任意のものもあります。次の URL を使用して最も重要な部分を見てみましょう。

http://www.example.com:80/path/to/myfile.html?key1=value1&key2=value2#SomewhereInTheDocument
プロトコル
http はプロトコルです。 URL の最初の部分は、ブラウザーが使用するプロトコルを示します。プロトコルとは、コンピューターネットワークを介してデータを交換または転送するための設定方法です。通常、ウェブサイトの場合は HTTP プロトコルまたはそのセキュアバージョンの HTTPS です。ウェブにはこれらの2つのうちの1つが必要ですが、ブラウザーは mailto: (メールクライアントを開くため) や ftp: などの他のプロトコルを扱う方法も知っていますので、そのようなプロトコルを見ても驚かないでください。
ドメイン名
www.example.com はドメイン名です。リクエストされるウェブサーバーを示します。他にも {{Glossary("IP address", "IP アドレス")}} を直接使用することも可能ですが、あまり便利ではないため、ウェブ上では頻繁に使用されることはありません。
ポート番号
:80 はポート番号です。これはウェブサーバー上のリソースにアクセスするために使用される技術的な「ゲート」を示します。ウェブサーバーが HTTP プロトコルの標準ポート (HTTP の場合は80、 HTTPS の場合は443) を使用してそのリソースへのアクセスを許可する場合、通常は省略されます。それ以外の場合は必須です。
ファイルへのパス
/path/to/myfile.html は、ウェブサーバー上のリソースへのパスです。初期のウェブでは、このようなパスはウェブサーバー上の物理的なファイルの場所を表していました。今日ではほとんどの場合、物理的なものではなくウェブサーバーによって処理される抽象的なものです。
引数
?key1=value1&key2=value2 は、ウェブサーバーに提供される追加の引数です。これらの引数は & 記号で区切られたキー/値のペアのリストです。ウェブサーバーは、リソースを返す前にこれらの引数を使用して追加の処理を行うことができます。各ウェブサーバーには引数に関する独自のルールがありますので、特定のウェブサーバーが引数を処理するかどうかを確認する確実な方法は、ウェブサーバーの所有者に問い合わせることだけです。
アンカー
#SomewhereInTheDocument は、リソース自体の別の部分へのアンカーです。アンカーはリソース内の一種の「ブックマーク」を表し、ブラウザーにそのブックマークされた場所にあるコンテンツを表示するための指示を与えます。たとえば、 HTML 文書では、ブラウザーはアンカーが定義されている位置までスクロールします。ビデオやオーディオ文書では、ブラウザーはアンカーが表す時刻に移動しようとします。 # の後の部分はフラグメント識別子とも呼ばれ、リクエストとともにサーバーに送信されることはありません。

{{Note('URL に関する他の部分と規則もありますが、それらは通常のユーザーやウェブ開発者には関係ありません。これについて心配する必要はありません。完全に機能する URL を構築して使用するためにそれらを知る必要はありません。')}}

URL を通常の郵送先住所のように考えるといいかもしれません。プロトコルは、使用したい郵便サービスを表し、ドメイン名は都市または町であり、ポート番号は郵便番号のようなものです。パスは郵便物が配信される建物を表します。引数は建物内の部屋番号などの追加情報を表します。最後に、アンカーは郵便物の宛先に当たる実際の人物を表します。

URL の使い方

ブラウザーのアドレスバーの中に正しく URL を入力すれば、それに対応するリソースを得ることができます。しかし、これは氷山の一角にすぎません。

後で説明する {{Glossary("HTML")}} 言語では、 URL を幅広く使用しています。

メモ: <script>, <audio>, <img>, <video> を使用する場合など、ページの一部としてリソースを読み込む URL を指定する場合は、HTTP と HTTPS の URL のみを使用してください。たとえば FTP を使用しても、特に安全になることはなく、、多くのブラウザーでは対応していません。

{{Glossary("CSS")}} や {{Glossary("JavaScript")}} などの他の技術は、URL を広範囲に使用し、真にウェブの中核です。

絶対 URL と相対 URL

上記で見たものは絶対 URL と呼ばれていますが、相対 URL と呼ばれるものもあります。その違いが何を意味するのかをもっと詳しく調べてみましょう。

URL の必須部分は、その URL が使用されているコンテキストによって大きく異なります。ブラウザーのアドレスバーでは、 URL にはコンテキストがありません。そのため、上で見たように、完全 (または絶対) URL を指定する必要があります。プロトコル (ブラウザーは既定で HTTP を使用します) やポート番号 (対象となるウェブサーバーが通常以外のポートを使用している場合にのみ必要) を含める必要はありませんが、 URL の他の部分はすべて必要です。

HTML ページ内など、文書内で URL が使用されている場合は状況が少し異なります。ブラウザーはすでに文書自身の URL を持っているので、この情報を文書内で利用される URL の欠けている部分を補うために利用することができます。絶対 URL と相対 URL は、 URL のパスの部分を見るだけで区別することができます。 URL のパスの部分が "/" の文字で始まっていれば、ブラウザーは現在の文書で指定されているコンテキストを参照せずに、サーバーの最上位のルートからそのリソースを取得します。

これを明確にするためにいくつかの例を見てみましょう。

絶対 URL の例

完全 URL (以前に使用したものと同じ)
https://developer.mozilla.org/en-US/docs/Learn
暗黙のプロトコル
//developer.mozilla.org/en-US/docs/Learn

この場合、ブラウザーはその URL をホストしている文書を読み込むために使用されたものと同じプロトコルで、その URL を呼び出します。

暗黙のドメイン名
/en-US/docs/Learn

これは、 HTML 文書内の絶対 URL の最も一般的な使用例です。ブラウザーは、その URL をホストしている文書を読み込むために使用されたものと同じプロトコルおよび同じドメイン名を使用します。メモ: プロトコルを省略せずにドメイン名だけ省略することはできません。

相対 URL の例

次の例をよく理解するために、これらの URL が https://developer.mozilla.org/en-US/docs/Learn という URL にある文書内から呼び出されると仮定しましょう。

サブリソース
Skills/Infrastructure/Understanding_URLs
URL が / で始まっていないので、ブラウザーは現在のリソースを含んでいるディレクトリのサブディレクトリでその文書を見つけようとします。そのため、この例では本当に達したい URL である https://developer.mozilla.org/en-US/docs/Learn/Skills/Infrastructure/Understanding_URLs に到達します。
ディレクトリツリーを遡る
../CSS/display

この場合、 UNIX ファイルシステムの世界から継承された ../ の表記規則を使用して、ブラウザーに1つのディレクトリから上に移動したいことを伝えます。つまり、 https://developer.mozilla.org/en-US/docs/Learn/../CSS/display という URL にアクセスしたいわけで、これは https://developer.mozilla.org/en-US/docs/CSS/display のように単純化できます。

セマンティック URL

URL はとても技術的な香りがするにもかかわらず、人間が読めるウェブサイトの入口を表します。覚えることができ、誰でもブラウザーのアドレスバーに入力することができます。人々はウェブの中核にいるので、セマンティック URL と呼ばれるものを構築することがベストプラクティスと考えられています。セマンティック URL は、技術的な知識に関係なく、誰でも理解できる固有の意味を持つ単語を使用します。

言語的セマンティックはもちろんコンピューターとは無関係です。おそらくランダムな文字を組み合わせたように見える URL を見たことがあるでしょう。しかし、人間が読める URL を作成することには多くの利点があります。

次のステップ