Webサイトを作ろう！（HTML編）

8. リンク

このページの最下部にトップページへのリンクを張っていますが、以下のように記述しています。


<a href="index.html"> Topページ </a>

「a」は「anchor（船のいかり）」の略、「href」は「hyper reference（超越した参照）」の略です。"と"の間にファイル名を入れます。

Webサイトのトップページは「index.html」にすることが決まっています（「index」は「索引、見出し」の意）。

下のリンクをクリックすると、このページ下部の「練習問題5」までページがスクロールします。

このようなリンクは、まずリンクされる先に名前（id属性）をつけます。ここでは「練習問題5」の見出しに「practice05」という名前をつけました。


<h3 id="practice05"> 練習問題5 </a>

名前（id属性）をつけた場所にリンクさせるためには、以下のように記述します。


<a href="#practice05"> 練習問題5 </a>

「2-7 画像」ページ（ファイル名は「0207_image.html」）の「練習問題4」にリンクしたい場合も、まずリンクされる先に名前（id属性）をつけます。ここでは「練習問題4」の見出しに「practice04」という名前をつけました。


<h3 id="practice04"> 練習問題4 </a>

このページから名前（id属性）をつけた場所にリンクさせるためには、以下のように記述します。


<a href="0207_image.html#practice04"> 練習問題4 </a>

「Yahoo!Japan（http://yahoo.co.jp）」にリンクを張る場合、以下のように記述します。


<a href="http://yahoo.co.jp"> Yahoo!Japan </a>

他のWebサイトにリンクを張る際には、リンク先の著作権者に許諾を取らなくても法律上特に問題ありません。ただ、Webサイトによっては「リンクポリシー」など独自の条件を定めている場合もあるので、相手の意思を尊重するようにしましょう。

「練習問題5」をクリックしてください。
ブラウザのメニューバーの[表示]＞[ソース]をクリックしてください。
メモ帳のメニューバーの[ファイル]＞[名前をつけて保存]をクリックしてください。
マイドキュメントの「web」フォルダに、ファイル名は 「index.html」に変更して 保存してください。
「見出し・段落」「リスト」「表」「画像」の文字列に、[マイドキュメント]＞「web]フォルダ内の「practice01.html」「practice02.html」「practice03.html」「practice04.html」ファイルへのリンクを張ってください。
「Webサイトを作ろう！」の文字列に「http://www.ac.cyberhome.ne.jp/~joho/」へのリンクを張ってください。
[マイドキュメント]＞「web]＞[index.html]のアイコンをダブルクリックして、リンクが正しく張れているか確認してみましょう。