<A HREF="http://www.asahi.com">朝日新聞</A>
<A HREF="http://www.yomiuri.co.jp">読売新聞</A>
これをホームページで見るとつぎのように"朝日新聞""読売新聞" の文字が色が変わってみえます。あるいは下線が引かれます。 これをクリックするとそのホームページにジャンプします。 次のようになります。
インターネット上の住所
<A HREF="http://www.asahi.com"> のなかのアドレスhttp://www.asahi.comのことをURLといいますが、 これが朝日新聞の実際のホームページのインターネット上のアドレスすなわち住所です。 このようなアドレスはあらかじめ調べておく必要があります。
アドレスの指定法にはこれ以外に直接数値で指定する方法があります。これは IPアドレスといいます。 たとえば、次の2つはおなじことです。
<A HREF="http://133.91.169.171">中央大学</A>
<A HREF="http://133.91.154.53">吉野ゼミ</A>
<A HREF="http://www.asahi.com"><IMG SRC="kabe1.jpg"></A>
実際、ブラウザでは次のように見えます。
またあるサイトの中の特定のページをみたいことはよくあります。 その時は、上のアドレスのあとにそのファイル名を続けて書きます。 次のようにします。
<A HREF="http://133.91.154.53/~yoshino/yoshino.html"><IMG SRC="kabe1.jpg"></A>
<A HREF="http://www.nikkeibp.co.jp/biztech/index.html"><IMG SRC="kabe1.jpg"></A>
<A HREF="http://www.mainichi.co.jp/index.html"><IMG SRC="kabe1.jpg"></A>
のように書きます。
画像と文字の両方をリンクキーすなわちクリックする部分とするときは 次のようにします。原理的には画像のときと同じです。
<A HREF="http://www.asahi.com"><IMG SRC="kabe1.jpg">朝日新聞</A>
ブラウザでは次のようにみえます。
このように説明をつけた方が親切です。
<A HREF="http://www.asahi.com"><IMG SRC="kabe1.jpg" ALT="朝日新聞"></A>
次のように最初の場合には画像がありませんがそれのリンク先がわかります。 それに対して、書かないとわかりません。
今までは、異なった中央大学から朝日新聞へのように異なったサイトをリンクしていました。
しかし、同じホームページの中でもページ間をリンクすればページからページへ移動できます。
これの方法について解説しましょう。
大きなファイルは読み込みにみも時間がかかり、編集も大変です。
これをあらかじめいくつかの小さなHTMLファイルに分割しておき、あるページから他のページ
へ表示を切り替えていくことを考えます。 これは全体の構成を見やすくできるという長所があります。
今、2つのファイル page1.html, page2.html
を作成し、おなじディレクトリにそれらをおきます。
page1.html のなかからpage2.html を表示するにはpage1.htmlのなかに
次のように書きます。
<A HREF="page2.html">次のページ</A>
このとき、"次のページ"の文字をクリックするとpage2.htm を表示します。
次に、page2.html の本文中たとえば最後に
<A HREF="page1.html">前のページ</A>
としておけば前のページに戻ることができます。
矢印と<IMG SRC="larrow.gif"><IMG SRC="rarrow.gif">
と組み合わせればもっとわかりやすいでしょう。たとえば
としておけばわかりやすい。
ファイルの中の特定の部分にリンクをはる
page2.html を表示するだけでなくそのなかの特定の部分にリンクを張るにはどうすればよいでしょうか。
<A HREF="page2.html#key">項目1</A>
page2.html には
<A NAME="key">項目1の解説</A>
の様にかいておきます。こうするとpage1.htmlから、page2.htmlのkeyにジャンプします。
すなわち、リンクが張れます。
ここで項目1の解説は項目1に対応する説明、keyはどのような言葉でもよいのですが、
"mifile2.htm#key"の中のkeyと対応していなければなりません。
すなわち, page1.htmlでkeyを別の言葉たとえばmykeyに変えたのなら、page2.htmlの
対応する部分もkeyを mykeyに変えなければなりません。
同じページ内でのリンクの例を与えます。
想定しているのは、最初に項目の一覧があり、その後に項目の長い説明が
あるような場合です。
たとえば、最初にコマンド一覧があり、その詳しい使い方を後ろに説明する場合が
その例でヘルプファイルで単語をひくような場合です。
この場合、各項目にはその説明をリンクします。さらに、その説明のあとに最初の項目一覧への
リンクを張っておきます。このようにすると、説明を読みおわってからすぐに項目一覧に戻ることができます。
具体的に次のような例を考えましょう。
<A NAME="return1">
観光地名
</A>
<A NAME="J1">
< FONT COLOR="red">日光とは</FONT>
</A>
この例では2つのジャンプを組み合わせています。すなわち、
<A HREF="#J1">日光</A>で日光をクリックすると
<A NAME="J1"><FONT COLOR="red">日光とは</FONT></A>
にジャンプします。また、returnの文字をクリックすると
もとの観光地名にもどります。それは
<A HREF="#return1">return</A>の部分で実現されます。
うえの例はつぎのように見えます。
日光
日光は東京から日帰りが可能であるがそこには湖や名所が多くあり...
return
北海道のみどころ
北海道はその雄大な自然とみどころの多さで是非一度は行きたいところである。
......
return
湯河原のよさ
東京に住んでいるのに湯河原のよさはあまり知られていない。
....
return
page1.htmlからpage2.htmlの中のキーワードにジャンプするためにはpage1.htmlのなかに
つぎのように記述しておきます。
同じページ内でのジャンプ
<UL>
<LI><A HREF="#J1">
日光
</A>
<LI><A HREF="#J2">
北海道
</A>
<LI><A HREF="#J3">
湯河原
</A>
</UL>
日光は東京から日帰りが可能であるがそこには湖や名所が多くあり...
<A HREF="#return1">
return
</A>
<HR>
<A NAME="J2">
<FONT COLOR="red">
北海道のみどころ</FONT>
</A>
北海道はその雄大な自然とみどころの多さで是非一度は行きたいところである。
......
<A HREF="#return1">
return
</A>
<P>
<A NAME="J3">
<FONT COLOR="red">湯河原のよさ</FONT>
</A>
東京に住んでいるのに湯河原のよさはあまり知られていない。
....
リンク内容を別のウィンドウに表示する
あるページを表示させている時、ちょっと別の内容を表示させたいが今のページはそのままにしておきたい ということはよくあります。たとえば、ヘルプなどを表示させる時です。 この場合には、リンク先の内容を現在の文書を表示しているウィンドウとは別のウィンドウに表示させることができます。 このためには、次のようにします。
<A HREF="page2.html" TARGET="window3" >次のページ</A>
このとき、"次のページ"の文字をクリックすると 新しくwindow3という名前のウィンドウが開き、そこにpage2.htm を表示します。 window3は自由に名前をつけることができます。ただし、すでに同じ名前のウィンドウが 開かれている時はそこに文書が表示されます。たとえば、window3以外の名前ではそうなることもあります。 次のようになります。
別のウィンドウに表示する内容はたとえば、別のホームページでもかまいません。 つぎのようにかきます。
<A HREF="http://www.asahi.com"TARGET="window3">朝日新聞</A>
<A HREF="http://www.yomiuri.co.jp"TARGET="window4">読売新聞</A>
メールを受け取りたい時に記述します。次のように記述します。
メールは<A HREF="mailto:yoshino@chuo-u.ac.jp">こちら</A>まで
つぎのようになります。
メールはこちらまで
電話をかける(iモード専用)
電話をかけたい時には次のように記述します。 ハイフンはつけなくてもかまいませんが、市外局番は記述しないと電話はかかりません。
<A HREF="tel:117">117に電話</A>
ダウンロードするファイルの場所を指定します。クリックするとダウンロードが始まります。 次のように記述します。
<A HREF="index00.txt">ファイルのダウンロード(index00.txt)</A>
マウスがリンク文字の上にあるときに表示する説明を指定します。 長い説明は適当に折り返されて表示します。 次のように書きます。
<A HREF="mypage1.html TITLE="前のページ""><IMG SRC="larrow.gif" BORDER=0> <A HREF="mypage2.html"TITLE="次のページ"><IMG SRC="rarrow.gif" BORDER=0>
次のようになります。