内部リンクと外部リンク

内部リンクと外部リンク

1.内部リンク

ナビゲーションメニューの各項目をクリックすると、それぞれ該当するページに遷移する機能を設定します。index.html以外のページはまだないためすぐには遷移しませんが以降の説明で作成します。また、ロゴにはindex.html自体へのリンクを設定します。

・ロゴ　　　：index.html
・ホーム　　：index.html
・店舗案内　：about.html
・アクセス　：access.html
・メニュー　：menu.html
・お問合せ　：contact.html

<a>タグの記述

index.htmlに以下のような記述を追記します。

ブラウザでの確認

ファイルの存在するリンク（ロゴ、ホーム）はindex.htmlに遷移しますが、それ以外のリンクはまだファイルを作成していないのでリンクさせようとしても、Page Not Found(404)が出てしまいますが、現時点では気にする必要はありません。

2.外部リンク

inde.htmlのニュース記事の一部に外部サイトへのリンクを設定します。index.htmlを以下のように編集します。

ブラウザでの確認

上のリンク個所をクリックし、外部サイトとして設定したYahooのトップページに遷移すればリンクの設定は正常です。リンクの説明は以上で終了です。次回は画像の挿入方法について説明します。