HTMLに慣れてきて、書くことも増えてきたら、test2.html、test3.html など、別のページも作成してみてください。別のページができたら、最初のページ(test.html)から次のページ(test2.html)にリンクを張ってみましょう。test.html の中に、次のように記述してください。
次のページに <A HREF="test2.html">ジャンプ</A> するよ。 「ジャンプ」の部分が(通常)下線付きの青色で表示され、そこをクリックすると、そのページにジャンプできるようになります。
ディレクトリとは、WindowsやMacOSで言うところのフォルダと同じ意味です。ファイルの数が増えてきたら、○○に関するファイルはこのディレクトリ、△△に関するファイルはこのディレクトリ・・・のように、ディレクトリごとに分けて保存しておくと便利です。たとえば、作成したHTMLファイルが次のようなディレクトリに置かれているとします。(□はディレクトリ、◇はHTMLファイルを表します)
aaa.html から bbb.html にリンクするには、上で説明したように、次のようにします。
□ public_html
├□ hogege
│├◇ aaa.html
│├◇ bbb.html
│└□ zumomo
│ └◇ ccc.html
├□ kupopo
│└◇ ddd.html
<A HREF="bbb.html">ジャンプ</A> aaa.html から ccc.html にリンクするには、ディレクトリをスラッシュ( / )で区切って次のようにします。
<A HREF="zumomo/ccc.html">ジャンプ</A> また、aaa.html から ddd.html にリンクするには、「ひとつ上のディレクトリ」を表すドットドット( .. )を用いて、次のようにします。(「ひとつ上のディレクトリの中の、kupopo というディレクトリの中の ddd.html というファイル」という意味になります。
<A HREF="../kupopo/ddd.html">ジャンプ</A>
別のWebサーバー上にあるページにリンクを張る場合は、http:// ではじまるURLを記述します。xxx.yyy.zzz の部分がWebサーバー名に相当します。
<A HREF="http://xxx.yyy.zzz/index.html">ジャンプ</A>
リンク先にファイル名ではなく、ディレクトリ名を指定することもできます。
<A HREF="../kupopo/">ジャンプ</A>
<A HREF="http://xxx.yyy.zzz/ukeke/">ジャンプ</A>この場合、通常、そのディレクトリの中にある「デフォルトファイル」が表示されます。デフォルトファイルは index.html だったり、index.htm だったり、default.htm だったりします。(サーバーの種別や設定によって異なります)
また、デフォルトファイルが存在しない場合は、そのディレクトリ内のファイルの一覧が表示されます。(これも、サーバーの設定によって表示できない場合があります。)
ページの途中の特定の場所にジャンプすることもできます。たとえば、ここをクリックすると、このページの「別ディレクトリのページへのリンク」の個所にジャンプします。これを行うには、次のようにします。
<A NAME="OtherDir">別ディレクトリのページへのリンク</A>
:
...たとえば、<A HREF="#OtherDir">ここ</A>をクリック...ジャンプ先の個所に<A NAME="名前">〜</A>で名前をつけておき、<A HREF="#名前">でジャンプします。別のファイルの特定個所へのジャンプは次のようになります。
<A HREF="bbb.htm#xxxx">ジャンプ</A> 他のサーバーのページの特定個所へのジャンプは次のようにします。
<A HREF="http://www.yyy.zzz/bbb.htm#xxxx">ジャンプ</A>
画像ファイル(次章で説明予定です)をリンクボタンにすることもできます。
<A HREF="xx.htm"><IMG SRC="xx.gif" BORDER=0
HEIGHT=20 WIDTH=20 ALT="説明"></A>この際、<IMG>タグに BORDER=0 属性を指定しないと、画像の周りに青い枠線が表示されてしまい、見栄えが悪くなることがあります。
また、<A ...> と <IMG ...> の間、または <IMG ...> と </A> の間に改行を入れてしまうと、画像の前後に小さな青いゴミ(正体は、リンクテキストとして表示された改行マークなのですが)が表示されることがありますので、改行しないか、タグの途中(BORDER=0 と HEIGHT=20 の間など)で改行するようにしましょう。
→