リンクを貼る場合や画像を貼る時に、そのファイルへのURLが必要になります。
それを一般的にパスと呼びますが、そのパスには2通りあります。１つはURLを全て書き込む絶対パス。
もう１つはURLを埋め込む位置から埋め込むファイルの位置を考えた相対パスで、
ホームページでは通常この相対パスを使います。
分りやすい捉え方は、絶対パスは全住所を表示していて、世界中何処からでも そのパスで分ります。
相対パスはファイルとファイルの位置関係を表すもので、あくまでそのサイト内で利用可能なパスになります。
例えば住所で絶対パスを表現すると下のようになります。
日本 / ○○県 / ○○市 / ○○区 / ○○町 / ○丁目 / ○番地 / ○○様
それに対して相対パスは、現在いる場所を基準に考えます。
２つ目の角を右曲がって３軒目の左の家が○○さん家ですよ。
イメージとしてはこんな感じで、絶対パスは誰でもそこへ到達出来る住所で、
相対パスは、その地点にいてこそ成り立つ案内みたいなものですね。
絶対パス
<a href="http://www.marinenet.co.jp/you_style/index.html">
<img src="http://www.marinenet.co.jp/you_style/image/may.gif">
相対パス
<a href="../index.html">
<img src="../image/may.gif">
下の場合の相対パスを説明してみます。(f)はフォルダの意味です。
[HP(f)] ─――─―― index.html
｜
｜――─ [image(f)]
｜ ｜――─ top.gif
｜ └――─ today.jpg
｜
└――─ [diary(f)]
｜――─ june.html
└――─ bg.gif
HPというフォルダの中にimage・diary という2つのフォルダとindex.htmlというHTMLファイルが入っています。
また2つのフォルダにはそれぞれファイルが入っています。
この場合でimageフォルダの中のtop.gifをindex.htmlに貼り付ける相対パスは、下のようにになります。
<img src="image/top.gif">
index.htmlファイルから見て、imageフォルダの中にあるtop.gifと単純に考えれば良いんです。
ではdiaryフォルダの中にあるjune.htmlにtoday.jpgを貼り付けるのはどうか？
<img src="../image/today.jpg">
../ は１つ上の階層に上がる事を意味して、june.htmlから見て１つ上の階層に上り、
その階層にあるimageフォルダの中のtoday.jpg という事なんです。
同じフォルダの中にあるファイルの相対パスは、そのファイル名を書けば良く、
上の場合で、june.htmlにbg.gifを貼り付けるパスは次のようになります。
<img src="bg.gif">
相対パスは慣れるまでややこしく感じるかもしれませんが、ホームページを作るのにどうしても必要なものです。
絶対パスではPCで作っている時に見る場合と、サーバーに送りネット上で見た場合とで違うパスになってしまいます。
従ってホームページのために作ったフォルダ内でパスを考える必要があります。
このサイトをPCのディスクトップ置いた場合とサーバーに置いた絶対パスは、
file://C:\WINDOWS\ﾃﾞｽｸﾄｯﾌﾟ\hp\challengehp.html
http://www.dab.hi-ho.ne.jp/swan0608/hp/challengehp.html
自分のサイト内のリンクやその他のファイルへのURLは、基本的に全て相対パスでなんです。
そして余所のサイトへのリンクなどのURLは絶対パスになります。
表示されてない画像は、パスを間違っていたりPC内の絶対パスになっている場合が結構あります。
画像を削除されて表示されない場合が一番多いですけどね。
