今までのサンプルは同じサイト内のWebページへリンクを設定してきましたが、他のサイトにあるWebページへリンクを設定することも可能です。
他のサイトにあるWebページへのリンクは次のように記述します。
例としてYahoo! JAPANへリンクを設定する場合は次のように記述します。
このように他のサイトへのリンクであってもhref属性に対する値の記述形式が異なるだけで、サイト内のWebページへリンクを設定するのとそれほど違いはありません。
では実際に試してみます。今回は「hatsumoude.html」ファイルを次のように記述しました。
では「hatsumoude.html」ファイルをブラウザで表示させてみます。
それぞれ別のWebサイトにあるWebページへリンクが設定されています。では「成田山新勝寺」と書かれたリンクをクリックして下さい。
リンク先である「http://www.naritasan.or.jp/」のWebページが表示されます。
このように他のWebサイト内のWebページであっても自由にリンクを設定することが可能です。ただ、リンク先へ移動した後に元にページに戻るためにはリンク先のWebページに記述してもらう必要がありますが、自分のサイトのように自由にはなりません。
リンク元のページを表示するには、ブラウザの戻るボタンで戻るしかないでしょう。
現在ほとんどのブラウザはタブブラウザなので、リンク元のWebページは一番目のタブで表示されていて、リンク先のページは2つ目のタブに表示することができます。
このように新しいタブでリンク先を表示するには、次のようにhrefに追加します。
target="_blank" はリンク先を新しいタブで表示させるものです。
このようにした場合は、タブを切り替えてリンク元のページ「hatsumoude.html」を表示することができます。
「成田山新勝寺」「川崎大師」についてもtarget="_blank"を追加しましょう。
そこで、「成田山新勝寺」「川崎大師」と書かれているリンクもクリックしてリンク先のページが表示されるのを確認しましょう。