初心者のためのホームページ製作講座
第2回 リンクの張り付け
第1回

今回はホームページでよく見かける、リンクの付け方です。  つまり、前回の分と今回の分を完璧にマスターすれば、いちおう自分のホームページを作成できます。  今回のメールにはサンプルファイルが3つ添付してあります。ファイル名は sample2.htm sample2a.htm sample2b.htm の3つです。  これらを前回作っておいたsampleフォルダに保存してください。  あと、実習には、ファイルの拡張子が表示されていた方が便利ですから、エクスプローラー(今後インター ネットエクスプローラーと表示しない限りは、ファイルを見るためのエクスプローラーのことと思って下さい) を立ち上げて、上の「表示」をクリックして「オプション」を選択し、「表示」のシートを選んで、そこに出て いる「登録されているファイルの拡張子を表示しない」にチェックが付いていたらそれをクリックしてチェック を消して下さい。これでファイル名にはいつも拡張子が付いて表示されるはずです。 それでは今回のファイルの中身を説明します。次はsample2.htmの中身です。 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ <html> <head> <title>リンクの練習</title> </head> <body> 今度はリンクの練習です。<br> <a href="sample2a.htm">サンプルA</a><br> <a href="sample2b.htm">サンプルB</a> </body> </html> ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 基本的な構造は前回のsample.htmと同じだということがわかるでしょう。その本文の中に新しいタグがあるのが わかるでしょう。 この新しいタグ<a>がリンクをするのに使用するものです。 <a href="ファイル名">リンクの表示をするもの</a> というように記述するとファイル名で示したファイルをブラウザが表示します。 さらに、<br>は改行タグです。これは、</**>がつかない例外的 なタグのひとつです。HTMLファイルの中でいくら改行して記述しても、この<br>を付けなければブラウザの表 示では改行されませんし、ファイルでは同じ行に書いても途中に<br>があれば改行されます。 ところでファイル名のところには、自分のコンピュータの中のファイルだけでなくて、インターネットで接続され たどのホームページやファイルでもかまわないわけです。 たとえば <a href="http://www.ceres.dti.ne.jp/~gengen/">踊る麻酔科</a> と記述すれば、ブラウザに表示された「踊る麻酔科」のところに踊る麻酔科最前線のページに飛ぶリンクが張り付 きます。  というわけで、まずブラウザでsample2.htmを読み込んで表示して下さい。  そうすると、「サンプルA」と「サンプルB」に飛ぶためのリンクが表示されますから、それを選択して、飛べ ることを確認して下さい。 つまりsample2.htmが目次、sample2a.htmとsample2b.htmが内容に相当します。 今回の実習  まずエクスプローラーでsampleフォルダの内容を表示して、sample2a.htmをデスクトップにコピーします。操作 法はsample2a.htmのアイコンのところでマウスの右ボタンを押して、押したまま、エクスプローラーの表示の外 (デスクトップ)まで移動してボタンを離します。出てきた表示の中から「ここにコピー」を左ボタンでリック します。    次にコピーしたsample2a.htmアイコンをマウスの右ボタンでクリックして、名前の変更を選択します。そしたら キーボードを打って名前を「sample2c.htm」に変更します。新しいファイル名を打ってenterキーを押せばできます。  今度はさっきと同じやりかたで、マウスの右ボタンを押しながらエクスプロ−ラー内のsampleフォルダの表示の ところにもっていきます。ただぢ今度は「ここにコピー」ではなく、「ここに移動」を選択します。  ワードパッドを使ってsample2c.htmファイルの中の「サンプルA」をすべて「サンプルC」に書き直して上書き 保存します。  次にsample2.htmをワードパッドで開いてサンプルCへのリンクをつけます。 <a href="sample2c.htm">サンプルC</a> と入れますが、サンプルBへのリンクのうしろに<br>が付いていないのでつづけて表示されますから、サンプ ルBへのリンクの行の最後に<br>を追加して下さい。 今回の課題  いちおう今回で、文字だけのホームページをつくるための基本はできたはずですから、sampleフォルダ内に好き なホームページを作って見て下さい。  もちろん本文の中に色つき文字をいれてもよいですし、太文字を いれてもよいです。次回以降は画像の表示や表の表示などを解説します。
第3回 目次