中級第１章 ：文字＆画像リンク

	初級編では、文字と画像について学んできました。 その文字と画像を使って、今度は「リンクを貼る」という作業を学んでみましょう。 「リンク」とは簡単に言うと、「他のページに飛ぶ為の足がかり」です。 トップページ１枚だけのＨＰではつまらないですよね。 そこで自分で他のページを作成してリンクしたり、友人や役立ちサイトへのリンクを貼ったりします。 リンクを貼る場合には＜A＞タグを使用します。 最初は「文字」にリンクを貼っていきます。 文字リンクは正確には「テキストリンク」と呼びます。 例をあげながら、順を追って見ていきましょう！
＜A href="test.html"＞テストページへ＜/A＞
	赤字の部分を見て下さい。 「test.html」の部分はこれからリンクを貼ろうとしている新しいページの名前です。 ＜A＞〜＜/A＞までの間に「テストページへ」のコメントが挟んでありますね？ ＜A＞タグで挟むことによって、「テストページへ」の文字にリンクが貼られます。 この表記の仕方は、自分で作成したファイルへリンクを貼る方法です。 赤字の部分を、もう一度良く見て下さい。 「test.html」というファイル名しか表記してありません。 例えば、友人のＨＰへリンクを貼る場合には自分で作成したファイルがある訳ではありませんよね？ その場合には「test.html」の部分に直接友人のＵＲＬ（アドレス）をフルパスで表記します。 例をあげてみましょう。
＜A href="http://popup.tok2.com/home/tochi/"＞トッチのページへ＜/A＞
	こんな感じにＵＲＬを直接表記します。 この例では「トッチのページへ」をクリックすることによってトッチのＨＰに飛ぶ設定になります。
	文字にリンクを貼る作業はここまでが全部です。 後は「テストページへ」や「トッチのページへ」のコメント部分の文字色を変更したり、文字サイズを変更したりして試してみて下さい。 文字にリンクを貼るだけではつまらない…と思いがちですが、ＨＰは画像を使い過ぎると表示が遅く（重く）なります。 画像リンクだけではなく、文字リンクを有効に使うことによって表示もずいぶんと速くなりますので閲覧する方に優しいＨＰになります。

	さて、文字リンクを勉強したらやはり画像リンクも勉強したくなりますよね。 次は「画像にリンクを貼る」作業に移りましょう。 要領は文字リンクと全く同じです。 ＜A＞〜＜/A＞までの間の部分を画像表示タグに変更すればよいだけです。 実際に例をあげてやってみましょう。
＜A href="test.html"＞＜IMG src="画像名.gif"＞＜/A＞
	このように＜A＞タグの間に挟む物をコメントから画像表示タグに変更すればよいわけです。 もちろん「画像名.gif」の部分にはローマ字で画像の名前を入れましょう。 画像の前や後に説明文字などをプラスしても良いと思います。 オリジナルなアレンジ法を見つけてみましょう！