|
リンクの作成 |
ホームページの醍醐味は、リンクのクリックにより次々と関連するページを表示できること。リンクが全く配置されていないホームページなんて、ほとんど見かけません。それほどリンクは重要な要素です。 |
 |
相対パスと絶対パス |
|
リンクを知るには、まず“相対パス”と“絶対パス”の違いを理解しなければいけません。“相対パス”とは、現在の位置を基準にリンク先を相対的に指定する方法です。たとえば、現在表示されているページのURLが「http://www.dreamgate.info/index.html」であったとしましょう。
ここから、 「http://www.dreamgate.info/photo.html」へリンクさせる場合、リンク先の指定は「photo.html」となります。
リンク先が「http://www.dreamgate.info/photo/index.html」であった場合は「photo/index.html」。つまり、現在の位置(フォルダ)からどうやってリンク先にたどり着くかを指定するのが“相対パス”です。
対して“絶対パス”は、「http://www.rakuten.co.jp/」のように「http://」から始まるURLを全て指定する方法となります。
リンク先の指定は“相対パス”と“絶対パス”のどちらを利用しても構いませんが、自分のホームページ内を移動するときは“相対パス”、他人のサイトへリンクするときは“絶対パス”を利用するのが一般的です。なお、“相対パス”で一つ上のフォルダを指定するときは「../」と記述します。 |
 |
文字のリンク |
|
実際にホームページにリンクを作成するには、HTMLでは<A>〜</A>タグを使ってリンクを実現します。具体的には、<A>〜</A>タグの間に挟まれた項目がリンクとして表示する内容、href属性で指定したパス(相対パスまたは絶対パス)がリンク先、となります。たとえば、文字でリンクを作成する場合の記述方法は以下のようになります。 |
|
<HTML>
<HEAD>
<TITLE>初めてのホームページ!</TITLE>
</HEAD>
<BODY>
<A href="photo.html">写真のページへ</A><BR>
<A href="http://www.rakuten.co.jp/">楽天へ</A>
</BODY>
</HTML> |
 |
画像のリンク |
|
画像でリンクを作成する場合は、<A>〜</A>タグの間に<IMG>タグを挟むような構造になります。たとえば、以下のようにHTMLを記述すると画像のリンクを作成できます。なお、リンク用の画像は自動的に青い枠線が表示されます。この枠線を表示したくない場合は、<IMG>タグでborder属性を「0」に指定してください。これで、画像の枠線が表示されなくなります。 |
|
<HTML>
<HEAD>
<TITLE>初めてのホームページ!</TITLE>
</HEAD>
<BODY>
<A href="photo.html"><IMG src="image01.jpg"
border="0"></A><BR>
<A href="http://www.dreamgate.info/"><IMG src="dreamgate.gif"
border="0"></A>
</BODY>
</HTML> |
(※1) |
詳しくは、「郡上ホームページ教室」にて・・・ |
|
|
|
|
|
自動で被リンクが増殖する新しいリンクシステム。登録無料!アクセスアップ・SEO対策にご利用下さい。 |
|
郡上のイベント
 |
|
 |
|