カスタム検索
トップページ >HTML/XHTML >HTML / XHTML入門 >他サイトへのリンク

他のサイトへのリンク

他のサイトにリンクする方法を説明します。例えば、Googleのトップページにリンクするには、URLである"http://www.google.co.jp/"を<a>タグのhref属性の値に指定します。

google.html
<html>
    <head>
        <title>Googleにリンク</title>
    </head>
    <body>
        <h1>Googleにリンク</h1>
        <p>
        <a href="http://www.google.co.jp/">Googleにリンク</a>
        </p>
    </body>
</html>

他のサイトの特定のページ、例えばこのサイトの、このページにリンクするには、"http://w-d-l.net/html__course__full_path/"を指定します。ブラウザのアドレスバーに表示されているものと同じです。

w-d-l_net.html
<html>
    <head>
        <title>w-d-l.netにリンク</title>
    </head>
    <body>
        <h1>w-d-l.netにリンク</h1>
        <p><a href="http://w-d-l.net/html__course__full_path/">w-d-l.netにリンク</a>
        </p>
    </body>
</html>
アドレスの末尾にファイル名がないのは・・・

通常、ファイル名を省略してアクセスがあると、何らかのファイル(大抵、index.htmlやindex.phpなどindex.xxxというファイル名が多い)が読み込まれるようにサーバ側で設定をしています。例えば、http://www.google.co.jp/なら、http://www.google.co.jp/index.htmlを指定しているのと同じことになります。

パス

href属性に指定する値である

  1. http://w-d-l.net/html/course/
  2. http://www.google.co.jp/
  3. same/ei/akaei.html
  4. ../madai.html

これらは、いずれもファイルが存在する場所を表しています。

このようにファイルの存在場所を示したもの(href属性の値)をパスといいます。

絶対パスと相対パス

パスの中でも、ファイルの存在場所を「http://」からファイル名までを示したものを絶対パスといい、3と4のように「http://」を省略してアドレスの途中から「/」や「../」を使用して示したものを相対パスといいます。

まとめ
  • 他のサイトにリンクするにはそのサイトのURLを指定する
  • パスとはファイルの存在場所を示したもの
  • 「http://」も含めて完璧に記述したパスが絶対パス
  • 「http://」を省略して記述したパスが相対パス
CopyLeft 2017 Webデザインレッスン プライバシーポリシー サイト管理者に連絡