７日で作る、無料で自分オリジナルのタグ打ちホームページの作り方

リンク

1.リンクをはる

たいていホームページって、
「自己紹介のページ」だとか、
「ペットの写真館」だとか、
「日記」だとかって、
何ページにもわたる場合が多いですね。
そこで、top.htmlを、こんなページにしてみたいと思います～♪↓

サイト内のいろんなページにジャンプできる、まさに「トップページ」にするわけです。
↑このページは例なので、クリックしてもどこにもジャンプしません(^^;)メールだけは起動します。

ハイここでキーワードです！
このように、あちこちのページにジャンプさせる機能を、「ハイパーリンク」といいます
（略して「リンク」とよく言われます）。

ではさっそく、リンクをはってみましょう！

top.htmlは、「初めてのホームページです。」で終わっていますが、
その下にリンク文字を付け加えていきますので、とりあえず改行を２つほど入れておきます。

<HTML>
  <HEAD>
    <TITLE>ななたぐのへや</TITLE>
  </HEAD>

  <BODY bgcolor="yellow" text="blue">
      <CENTER><H1>
          <FONT color="red">ななたぐのへや</FONT>
          </H1></CENTER>
      <FONT size="5">「ななたぐのへや」</FONT>へようこそ！<BR>
      初めてのホームページです。
      <BR><BR>
  </BODY>
</HTML>

続いて、まず最初のリンクは「自己紹介」です。
リンクは、 <A HREF="リンク先のHTML名">リンク文字</A> と書きます。

「ん？ややこしいなぁ。」
・・・ちょっと、ややこしいですね。
ま、ためしに、実際に書いてみましょう。そのうち慣れますよ(^-^)

<HTML>
  <HEAD>
    <TITLE>ななたぐのへや</TITLE>
  </HEAD>

  <BODY bgcolor="yellow" text="blue">
      <CENTER><H1>
          <FONT color="red">ななたぐのへや</FONT>
          </H1></CENTER>
      <FONT size="5">「ななたぐのへや」</FONT>へようこそ！<BR>
      初めてのホームページです。
      <BR><BR>
      <A HREF="profile.html">自己紹介</A>
  </BODY>
</HTML>

「profile.html」なんてHTMLは、まだ作ってないんですが、
明日作りますので、とりあえず書いとくだけ書いておいてください(^^;)

さて、いったん上書き保存して、ブラウザで更新して、確認してみましょう。

・「自己紹介」って文字に、下線が引かれてますか？
・「自己紹介」にマウスをもっていくと、カーソルがになりますか？
・ブラウザのステータスバー（下辺の「ページが表示されました。」とか表示されるところ）に、
　「ナントカ/profile.html」と表示されますか？

以上をクリアすれば、成功ですよ(^-^)

続けて、同じように

リンク先		リンク文字
diary.html	＝	日記
bbs.html	＝	掲示板
link.html	＝	リンク

というリンクを、つけていってみましょう！
（「link.html」は今日、あとで作りますからね♪）
１個つけるたびに、上書き保存→更新、で確認しましょうね(^-^)

あ、改行、忘れないでくださいね～!!

「メールはこちら」については、次のページの「３」で解説します！

*リンク*

リンク