［ＨＰを作ろう！］ ☆第１６回☆
こんにちは、ＴＨ６９です。
かなり間が開きましたが、皆さんお変わりありませんでしょうか。
夏の疲れが出たのか、体調がいまいちで［ＨＰを作ろう！］の製作も全く進みませんでした (^ ^;
これからもぼちぼちとやっていきますので、気長にお待ち下さいね。
今回は、前回お知らせした通り、『リンク』について勉強したいと思います。
リンクというのは、皆さんもご存知の通り、ＨＰ上でマウスカーソルが矢印から手の形に変わり
クリックすると他のページへジャンプする、というものです。
これも難しそうに思えますが、やってみるととても簡単ですよ。
難しいというかややこしいのは、ジャンプ先のページの場所の指定だけですので、
書いてある通りにやれば、必ずうまく行きます。
では始めましょう。
今回は『リンク』という事ですので、リンク先（ジャンプ先）のページがなければ始まりません（笑）。
まず、そのページを作ってみましょう。
新しいページの作り方は、これまでに勉強してきましたので、それを参考にやってみて下さい。
１）ページの名前（タイトル）は『メニューページ』です。
２）ページの背景（壁紙）は［素材集］にある『haikei2.gif』にしましょう。水色のチェックです。
（『gazou』フォルダに、名前を付けて保存して下さいね。）
３）ページの背景色は壁紙に合わせて、水色（#00ffff）にします。画像が表示できなかったら、
これが表示されますので。
４）文字の色は青（#0000ff）にします。
５）ベースフォント・サイズは『５』にして下さい。
６）全体を『中央揃え』にします。（〜）ですね。
７）一番上にフォントサイズ『７』で、『メニューページ』と記入します。
８）その下に水平線を入れます。サイズは『５』で色は黒（#000000）です。
９）ページの名前は『menu.html』にして、『homepage』フォルダに保存します。
以上の内容のページを作ってみて下さい。
かなり間が開いたので、忘れてしまったでしょうか（笑）。
下にソースは記入しておきますが、なるべく自分で復習して、やって下さいね。
ソースは次の通りです。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
メニューページ
メニューページ
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
どうでしょうか？
簡単でしたか？ それとも… (^ ^;
ソースが書けたら、ページを開いてみましょう。
［ＨＰを作ろう！］の復習用『16b』のようになっていればＯＫです。
背景（壁紙）はうまく表示されましたか？
うまく行かない時は、画像がちゃんと『gazou』フォルダに保存できているかどうか、確認して下さいね。
これでリンク先のページは出来あがりました。
ページの内容はこれから作っていきますので、心配しないで下さいね（笑）。
では、［index.html］のページ（以下トップページ）から、このページにリンクさせて見ましょう。
いつものようにトップページを開いて、そのソースを表示して下さい。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
私のホームページ
ようこそ！私のホームページ
へ
このページはただいま製作中です。
Kea Point からのＭｔ．クック
またのお越しを
お待ちしております。
２００１年６月１７日 製作開始
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
のようになっていますね。
このソースの『このページはただいま製作中です。』の部分を変更することにします。
まず
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
このページはただいま製作中です。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
をすべて削除します。
そこにフォントサイズ『６』で、『●メニューページへ』と記入します。
下は２行開けて下さい。
『●』は「まる」と入力して変換すると、出てくると思います。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
●メニューページへ
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
このようになりますね。
そして上書き保存して更新すると、赤い文字で『●メニューページへ』と表示されます。
さあいよいよリンクさせますよ。
上のソースの『●』の後ろに『』と記入して下さい。
さらに『●メニューページへ』の後ろに『』と記入します。
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
●メニューページへ
〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
のようになります。
できたら、上書き保存して更新してみましょう。
どうですか？
『メニューページへ』の色が変わって、下線がつきませんでしたか？
（ブラウザの設定によっては、下線がつかない場合もありますが…）
そして、マウスカーソルを持って行くと、矢印が手の形に変わりませんか？
変わったら成功です！ ＼(^o^)／
では、クリックしてみましょう。
う〜ん、ドキドキしますね（笑）。
どうでしょうか？
先程作った『menu.html』（メニューページ）に、うまくジャンプできたでしょうか？
うまくいった方は、案外簡単だったでしょ。
うまく行かなかった方は、もう一度最初からやり直して下さい。
いろいろ間違いやすい所はありますので、どうしてもうまく行かない時はご質問下さいね。
今回勉強した『リンク』のタグは、［〜］でセットになっています。
『***』の部分には、リンク先のページの保存場所を、
『〜』の部分には、リンクしたい文字をいれます。
どうして［a href］でリンクなのかは、よく分かりませんので、そういう物として覚えて下さい (^ ^;
ページの保存場所については、今回のようにリンク元のページ（トップページ）と
リンク先のページ（メニューページ）が同じフォルダ（homepageフォルダ）にある場合には、
『***』にリンク先のページの名前を記入するだけでＯＫです。
（今やった［menu.html］ですね）
まだまだ先の話だと思いますが、ページが増えてきて別のフォルダを作った時には、
これが少しややこしくなります。
これもまた勉強しますので、頭の隅にでも置いておいて下さい。
それで、今回はリンク先のページから元のページへ戻る、というボタン（？）は作りませんでしたので、
元のページへ戻る場合は、ブラウザの『戻る』ボタンを使用して下さい。
次回はこのボタンなど、さらにリンクについての勉強を進めたいと思います。
また、メニューページに加えたいメニューがありましたら、ご連絡下さい。
［自己紹介］、［趣味］、［リンク］くらいしか思い付かないもんで…（笑）。
お願いしますね。
では、また第１７回でお会いしましょう。