TAGの使い方

HTML基本タグ一覧表に戻る

HTML文書におけるタグの使い方
<A HREF>タグの使い方の基本についての説明

☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆
右はHTML文書の基本構造です。この「タグの使い方」ページでは、右のHTML文書の中で、<BODY>と</BODY>とで囲まれた(1)Contents!の部分で使用する基本的なタグについて、その使用例を挙げます。以下を参照して下さい。

☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ <HTML>
<HEAD>
<TITLE>　TAGの使い方　</TITLE>
</HEAD>
<BODY>

　　　　(1)Contents!

</BODY>
</HTML>

　

「リンクについて」
<A HREF>タグを用いると、他のページとのリンクを結んだり、メール送信機能を付けたりすることができます。

<A HREF="URL">文章や画像など</A>

のように記述すると、ブラウザ上で<A HREF="URL">と</A>で囲った部分(「文章や画像など」)と記述したURLとがリンクされます(画像を押すとリンク先に飛ぶようにしたい場合は、「文章や画像など」の部分に<IMG>タグを使って下さい)。リンクする際、自分が複数のページを作成してそれらをリンクさせたいときと、自分以外の人が作ったページとリンクさせたいときとがあると思います。どちらを選ぶかによってURLの書き方が変わってきますので、以下に説明します。

●前者の場合、作成するすべてのページ(のファイル)を同じフォルダ(ディレクトリ)内に格納しているときは、URLの部分はファイル名だけを記述すればO.K.です。例えば、index.html(ホームページ)からtag.htm(タグのページ)というページにリンクさせたければ、index.htmlに

<A HREF="tag.htm">タグのページ</A>
と記述することになります。これで、index.htmlをブラウザに表示させたとき、その中に表示されている「タグのページ」という文をクリックするだけで実際にタグのページに飛ぶことができます。ここに、index.htmlやtag.htmのように、.の後にくる4つないしは3つの文字のことを拡張子と呼びます。ここにはあえて文字数の異なる2種類の拡張子を例に挙げました(htmlとhtm)が、このどちらを使用しても大丈夫です。ただし、ネットワーク管理者が拡張子の統一を要求する場合もありますので、確認することをお勧めします。

●さて、話を戻します。前者の場合で、作成している複数のページを異なるフォルダに格納することの方が一般的です。しかし、こちらの場合は、URLの部分にファイルを格納している場所(PATH:パスと呼びます)を指定することになります。こちらは少しややこしく、相対パスか絶対パスか、好きな方式を選び、<A HREF="PATH/file名">といったように記載します。例えば、index.htmlがpublic_htmlというフォルダの中に格納してあるとします。そこで、public_htmlフォルダの中に新たにtestという名のフォルダを作成し、このtestフォルダの中にtag.htmを格納したとします。その場合、相対パスで記述すると、

<A HREF="./test/tag.htm">タグのページ</A>
となります。ちなみに、./は省略しても大丈夫ですが、付ける習慣を身に付けておいた方が良いと思います。./は現在のフォルダ(ディレクトリ)であることを示すもので、./test/ということになると、./の中のtest/という意味、つまり、現在のフォルダ(ディレクトリ)の中のtestフォルダ(ディレクトリ)ということになるわけです。察しの良い人はもう気づきましたね。要するに、.が現在、/がフォルダ(ディレクトリ)を表現する記号なのです。ちなみに、../となると、現在のフォルダ(ディレクトリ)を格納しているフォルダ(ディレクトリ)を示す記号になります(フォルダ(ディレクトリ)は、このように階層構造になっているのですが、これを親子表現することが多々あります。つまり親フォルダ(親ディレクトリ)の中に子フォルダ(子ディレクトリ)が格納されていると表現します)。ということは、tag.htmのページ内からindex.htmlにリンクさせたい場合は、tag.htmのあるフォルダから親フォルダ(ディレクトリ)にあるindex.htmlに飛ぶわけですから、../記号を用いて、

<A HREF="../index.html">ホームページ</A>
となるわけですね。

●最後に、後者のように自分以外の人が作成したページにリンクしたい場合です。こちらは、相手のページのURLを記述して下さい。例えば、私のホームページは

http://usk.world.coocan.jp/
にありますが、このページにリンクする場合は

<A HREF="http://usk.world.coocan.jp/">USK website</A>
と記述します。ただし、この場合は以下のことに注意して下さい。

・相手のページにリンク拒否の旨が書いている場合はリンクしない。
・相手のページにリンクの申し出が必要と書いてある場合は申し出る。
・相手のページにリンクに関する制限があった場合はそれを厳守する。
・相手の著作権を侵害しない。

この4番目はなかなか判断が難しいかもしれません。そこで、自分がホームページを作成するときに以下のような点に気を配ることをお勧めします。

・自分のページに対するリンクの可不可を明確に記載する。
・自分のページに対するリンクを自由化する場合はリンクフリーと記載する。
・自分のページに対するリンクに制限をかける場合は、その旨を簡潔にわかりやすく記載する。
・自分の作成した情報に著作権を発生させたい場合、その意志を記載する。

4番目について、他人が著作権を発動している事柄に対しては、それを複製するなどして自分の著作権を主張することは絶対にしないでください。モラルを守って楽しくインターネットを利用しましょう。

「メール送信機能について」
メール送信用のタグを作りたいときは、次のように記述します。

<A HREF="mailto:メールアドレス">メールはこちら！</A>
こうすると、ブラウザ上の「メールはこちら！」という表示部分をクリックすることで、「メールアドレス」部分に記述した宛先にメールを送ることができます。ただし、このメール用タグについてはページ閲覧者側がブラウザの設定でメールソフトを登録かつ利用可能にしておかなければ意味がありません。

HTML文書記述例は以下を参照して下さい。なお、 は改行、<CENTER>はセンタリング(中央寄せ)をするタグです。

　 <HTML>
<HEAD>
<TITLE>　TAGの使い方　</TITLE>
</HEAD>
<BODY BGCOLOR=LIGHTYELLOW>

<CENTER>
USK websiteに行くには 
<A HREF="http://usk.world.coocan.jp/">ここ</A> 
をクリックして下さい。 

ご意見ご希望をお待ちしております。 
<A HREF="mailto:hogehoge@hoge.hogejp">メールはこちら！</A>
</CENTER>
</BODY>
</HTML>

→
ブ
ラ
ウ
ザ
で
の
表
示
→

USK websiteに行くには
ここ
をクリックして下さい。

ご意見ご希望をお待ちしております。
メールはこちら！

　

左側が作成したHTML文書。右側が、左側のHTML文書を実際にブラウザに表示した結果を示しています。

**HTML文書におけるタグの使い方**
<A HREF>タグの使い方の基本についての説明
☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ 右はHTML文書の基本構造です。この「タグの使い方」ページでは、右のHTML文書の中で、<BODY>と</BODY>とで囲まれた(1)Contents!の部分で使用する基本的なタグについて、その使用例を挙げます。以下を参照して下さい。 ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆	<HTML> <HEAD> <TITLE>　TAGの使い方　</TITLE> </HEAD> <BODY> 　　　　(1)Contents! </BODY> </HTML>
「リンクについて」 <A HREF>タグを用いると、他のページとのリンクを結んだり、メール送信機能を付けたりすることができます。 <A HREF="URL">文章や画像など</A> のように記述すると、ブラウザ上で<A HREF="URL">と</A>で囲った部分(「文章や画像など」)と記述したURLとがリンクされます(画像を押すとリンク先に飛ぶようにしたい場合は、「文章や画像など」の部分に<IMG>タグを使って下さい)。リンクする際、自分が複数のページを作成してそれらをリンクさせたいときと、自分以外の人が作ったページとリンクさせたいときとがあると思います。どちらを選ぶかによってURLの書き方が変わってきますので、以下に説明します。 ●前者の場合、作成するすべてのページ(のファイル)を同じフォルダ(ディレクトリ)内に格納しているときは、URLの部分はファイル名だけを記述すればO.K.です。例えば、index.html(ホームページ)からtag.htm(タグのページ)というページにリンクさせたければ、index.htmlに <A HREF="tag.htm">タグのページ</A> と記述することになります。これで、index.htmlをブラウザに表示させたとき、その中に表示されている「タグのページ」という文をクリックするだけで実際にタグのページに飛ぶことができます。ここに、index.htmlやtag.htmのように、.の後にくる4つないしは3つの文字のことを拡張子と呼びます。ここにはあえて文字数の異なる2種類の拡張子を例に挙げました(htmlとhtm)が、このどちらを使用しても大丈夫です。ただし、ネットワーク管理者が拡張子の統一を要求する場合もありますので、確認することをお勧めします。 ●さて、話を戻します。前者の場合で、作成している複数のページを異なるフォルダに格納することの方が一般的です。しかし、こちらの場合は、URLの部分にファイルを格納している場所(PATH:パスと呼びます)を指定することになります。こちらは少しややこしく、相対パスか絶対パスか、好きな方式を選び、<A HREF="PATH/file名">といったように記載します。例えば、index.htmlがpublic_htmlというフォルダの中に格納してあるとします。そこで、public_htmlフォルダの中に新たにtestという名のフォルダを作成し、このtestフォルダの中にtag.htmを格納したとします。その場合、相対パスで記述すると、 <A HREF="./test/tag.htm">タグのページ</A> となります。ちなみに、./は省略しても大丈夫ですが、付ける習慣を身に付けておいた方が良いと思います。./は現在のフォルダ(ディレクトリ)であることを示すもので、./test/ということになると、./の中のtest/という意味、つまり、現在のフォルダ(ディレクトリ)の中のtestフォルダ(ディレクトリ)ということになるわけです。察しの良い人はもう気づきましたね。要するに、.が現在、/がフォルダ(ディレクトリ)を表現する記号なのです。ちなみに、../となると、現在のフォルダ(ディレクトリ)を格納しているフォルダ(ディレクトリ)を示す記号になります(フォルダ(ディレクトリ)は、このように階層構造になっているのですが、これを親子表現することが多々あります。つまり親フォルダ(親ディレクトリ)の中に子フォルダ(子ディレクトリ)が格納されていると表現します)。ということは、tag.htmのページ内からindex.htmlにリンクさせたい場合は、tag.htmのあるフォルダから親フォルダ(ディレクトリ)にあるindex.htmlに飛ぶわけですから、../記号を用いて、 <A HREF="../index.html">ホームページ</A> となるわけですね。 ●最後に、後者のように自分以外の人が作成したページにリンクしたい場合です。こちらは、相手のページのURLを記述して下さい。例えば、私のホームページは http://usk.world.coocan.jp/ にありますが、このページにリンクする場合は <A HREF="http://usk.world.coocan.jp/">USK website</A> と記述します。ただし、この場合は以下のことに注意して下さい。・相手のページにリンク拒否の旨が書いている場合はリンクしない。・相手のページにリンクの申し出が必要と書いてある場合は申し出る。・相手のページにリンクに関する制限があった場合はそれを厳守する。・相手の著作権を侵害しない。この4番目はなかなか判断が難しいかもしれません。そこで、自分がホームページを作成するときに以下のような点に気を配ることをお勧めします。・自分のページに対するリンクの可不可を明確に記載する。・自分のページに対するリンクを自由化する場合はリンクフリーと記載する。・自分のページに対するリンクに制限をかける場合は、その旨を簡潔にわかりやすく記載する。・自分の作成した情報に著作権を発生させたい場合、その意志を記載する。 4番目について、他人が著作権を発動している事柄に対しては、それを複製するなどして自分の著作権を主張することは絶対にしないでください。モラルを守って楽しくインターネットを利用しましょう。「メール送信機能について」メール送信用のタグを作りたいときは、次のように記述します。 <A HREF="mailto:メールアドレス">メールはこちら！</A> こうすると、ブラウザ上の「メールはこちら！」という表示部分をクリックすることで、「メールアドレス」部分に記述した宛先にメールを送ることができます。ただし、このメール用タグについてはページ閲覧者側がブラウザの設定でメールソフトを登録かつ利用可能にしておかなければ意味がありません。 HTML文書記述例は以下を参照して下さい。なお、<BR>は改行、<CENTER>はセンタリング(中央寄せ)をするタグです。
	<HTML> <HEAD> <TITLE>　TAGの使い方　</TITLE> </HEAD> <BODY BGCOLOR=LIGHTYELLOW> <CENTER> USK websiteに行くには<BR> <A HREF="http://usk.world.coocan.jp/">ここ</A><BR> をクリックして下さい。<BR><BR> ご意見ご希望をお待ちしております。<BR> <A HREF="mailto:hogehoge@hoge.hogejp">メールはこちら！</A> </CENTER> </BODY> </HTML>	→ ブラウザでの表示 →	USK websiteに行くにはここをクリックして下さい。ご意見ご希望をお待ちしております。メールはこちら！
左側が作成したHTML文書。右側が、左側のHTML文書を実際にブラウザに表示した結果を示しています。

HTML基本タグ一覧表に戻る