インターネットがこれほど世界に普及したのは、このリンク機能があるからです。リンクはあなたのHPの世界を広げていく上で大変重要です。ここではリンクの概念と基本的なリンクについてご説明します。

【構文8】
リンクはHPの醍醐味と言えますが、リンクの方法について、以下の二つのパスがあることを、まず覚えてください。

  • 絶対パス ---- 他のサイト等にリンクを貼る場合に用います。例えば、http://www.docomo.ne.jp/ のように http から始まる総てのアドレスを指定することです。
  • 相対パス ---- 同一サーバーの同一ディレクトリ(フォルダ)に格納されているサイトにリンクする場合に用います。通常、個人のHPをアップロードする際には、自分のHP内でのリンクを貼る場合は相対パスで指定します。その書き方は以下のとおりです。

    このHPのコンテンツは総て test のディレクトリの中にあると仮定します。ここでは contents_02 ディレクトリの中にある index.html を基準にしてそれぞれの階層のファイルやディレクトリに対してどのようにリンクを貼るのかを以下の表に表しました。なお、ここでは現実的にはあまり行わないディレクトリそのものに対してのリンクではなく、ディレクトリの中のファイルに対してのリンクとして説明をしています。

    index.html を基準とした場合
    リンクの対象 ディレクトリの位置 パスの記述
    next.html 同層ディレクトリ next.html
    contents_01 にあるファイル 上層ディレクトリ ../contents_01/ファイル名
    image にあるファイル 上層ディレクトリ ../image/ファイル名
    test にあるファイル 上層ディレクトリ ../../ファイル名

    上の表をリンクの構文にした場合、以下のとおりになります。

    <A HREF="next.html">対象となる文字・文章</A>
    <A HREF="../contents_01/ファイル名">対象となる文字・文章</A>
    <A HREF="../image/ファイル名">対象となる文字・文章</A>
    <A HREF="../../ファイル名">対象となる文字・文章</A>

【構文9】
ここではリンクのターゲットの指定を説明します。例えば、あなたがHPを作ってリンク集を作ったとしましょう。インターネットの醍醐味はリンクだということをご説明してきましたが、せっかくあなたのHPに来たお客さまがあなたのHPから他サイトへ行ったっきりで、戻ってこなかったとしたら少し寂しいでしょう。そのような時は別ウィンドウでリンク先を開くことが出来ます。それは以下の構文です。

    <A HREF="リンク先URL" TARGET="_BLANK">対象となる文字・文章</A>

【構文10】
また、以下の構文では同じページ内の指定の場所にリンクを貼ることも出来ます。
    <A NAME="定義名">定義する文字・文章</A>
    <A HREF="#定義名">対象となる文字・文章</A>

    [例4]
    このページ中の【構文8】へリンクします。
    <A NAME="koubun_08">【構文8】</A>、<A HREF="#koubun_08">【構文8】へリンク</A>という構文で書いたものを以下に表します。