自分のホームページ内のリンク（パス）について

質問

openoficeのwieterでＨＰを作っています。
まずWEBに乗せる前に、ローカルで作っています。
c:\homepage内に

たとえば、okinawaというフォルダー内にokinawa.htmというhtmlファイルを作ります。
okinawa.htm内には「那覇の写真」という文字にハイパーリンクをつけたい。

さらにokinawaのサブフォルダーnahaをつくりその中にnaha.jpgを作ったとします。

「那覇の写真」の文字からnaha.jpgへ参照でリンクを張ると
C:\okinawa\naha\naha.jpg
となってしまい実際にUPしたときにnahajpgは見えなくなってしまいます。

「那覇の写真」のリンクに直接
/naka/naha.jpgといれても./naka/naha.jpg(ドットが入っている）直接打っても表示されません。

WEBにあげてから直接全部URLで修正すれば何とかなるのですが
ローカルで大体作り上げたいのですが、どうしたものでしょうか？
お詳しい方お願いします。

回答No.5

ORUKA1951 · ベストアンサー

以下パスはUNIXに合わせて、/を使います。逆スラッシュ(日本語環境では\)は、Windowsしか通用しないのでね。

C:　　　　　　　　　　　　　　1
　/homepage　　　　　　　　　 2
　　|-- okinawa.htm　　　　　 3
　　|-- /naha　　　　　　　　 4
　　|　　|-- naha.jpg　　　　 5

この場合、ブラウザがokinawa.htmを開いている場合、ブラウザが認識しているURIは、
file:///C:/homepage/にある、[okinawa.htm]というファイルですね。
・カレントディレクトリは、C:/homepage/であり、
・ファイルは[okinawa.htm]
　カレントであるC:/homepage/ (2)からみた、
1は、../ ないし /
2は、./ ないし　/homepage　ないし、[なにも書かない]
4は、../homepage/naha　ないし、/homepage/naha あるいは ./naha さらに naha
よってnaha.jpgへのリンクは
　<a href="../homepage/naha/naha.jpg">写真</a>
　<a href="/homepage/naha/naha.jpg">写真</a><!-- ※ -->
　<a href="./naha/naha.jpg">写真</a>
　<a href="naha/naha.jpg">写真</a>
のいずれでも同じです。
　ただし、/から始まるパスは、ローカルでのものとリモートのサーバーとは異なりますから、file:///環境では使いません。
　ローカルにHTTPサーバーを持っている場合は、サーバーのルートからのパスの記述も可能です。
　たとえば、あなたのパソコンにapacheなどが入っている場合は
http://local.host/naha.html
　とか・・・

お礼

うんっと。
よくわかりました。
LINUXとかソラリスとか少しいじったことがあり、確かに/を使っていましたね。
WEB自体UNIXベースと考えると、確かにそうですね。

JPYの円記号をコピペすると\なりますね。これwindows環境のみだったんですね。
LINUXと共通のような気がしてました。間違いの元です。

しかしWriterのハイパーリンクではfile:///D:から始まって表示されているんです。
HTMLソースは<A HREF="ph-org/CA3C0300.JPG">オリジナルダウンロード</A>　</P>
ってなっているんですけどね。

ちなみにfile:///はどういう意味でしょうか。もしわかれば。

ローカルにHTTPサーバーでapacheは少し前ならやったかもしれませんが
最近は無料HPスペースが充実してるのでそっちを使います。

回答No.6

ORUKA1951

＞しかしWriterのハイパーリンクではfile:///D:から始まって表示されているんです。
　ブラウザなり、アプリケーションなりはサーバーとは別に、そのファイルの置かれているカレントがどこであるかを独自に判断して、次のファイルの要求に使うのです。
　ファイルの提供を、fille:----ファイルマネージャーから受け取ろうが、HTTPサーバーhttp:から受け取ろうが、それは関係ありません。また、そのPATHが実在の物であろうとなかろうと関係ありません。
　リンク先のファイルを要求するときに、そのカレントからのPathが../abc/cde.jpgだとすると、アプリケーションが、カレントをfile:///C:/homepage/naha/と判断していれば、二つを組み合わせて、file:///に対して、C:/homepage/naha/から、naha/を除いた、C:/homepage/　に、abc/cde.jpgを加えた物、すなわち/C:homepage/abc/cde.jpgを、ファイルマネージャーfile:に対して求めるだけです。
　HTTPサーバーは、受け取った要求(/C:homepage/abc/cde.jpg)を探し出して、応答する。もちろん、それが実在しようがしまいがとは関係ありません。

＞ローカルにHTTPサーバーでapacheは少し前ならやったかもしれませんが
最近は無料HPスペースが充実してるのでそっちを使います。
　意味が違います。
　ページのリンク内でルートからのパスを使いたいとき・・・例えば作成中のファイルの場所を移動する可能性があるときや、一つのテンプレートを使いまわす時などでは、絶対パスで記入します。
<link rel="stylesheet" type="text/css" href="./standard.css">
とか、
<a href="/index.html">TOP</a>
とか、
<img src="/images/LOGO.jpg">
とかはね。
　ところが、これではそのHTMLを直接開くと期待した場所にリンクできませんね。
　そのためにテスト環境としてlocal.hostが必要なのです。また、CGIなどサーバー側で動作するもののテストには必須です。
　firefoxのアドオンには、Server Swictherという開発用のローカルサーバーとリモートサーバーを切り替えるアドオンもあります。
Server Switcher | Mozilla Japan ( https://addons.mozilla.jp/firefox/details/2409 )

お礼

回答ありがとうございます。
file:///はファイルマネージャーのことと理解でよろしいでしょうか。
古くはfileman.exeだったような気がしますが、今はエクスプローラー？

＞＞ローカルにHTTPサーバーでapacheは少し前ならやったかもしれませんが
＞最近は無料HPスペースが充実してるのでそっちを使います。
＞　意味が違います。
そうですね。local.hostをたてれば絶対パスでのテストまでできますね。
今回そこまで大そうなページを作ろうとしているわけではないので、今後の参考にさせていただきます。
全部理解したわけではありませんが、なるほどと思う部分多々あり助かります。
なにせ相対パスではまっているぐらいなので。。。

回答No.4

tracer

例に出されたディレクトリ構成は、質問用につくった仮の構成ですか？　それとも本当のディレクトリ名、構成ですか？
もし、実際の構成と、質問に出されたものが異なる場合、たとえば実際のディレクトリ名(またはファイル名)が全角(極端にいえば日本語)になっていませんか？全角はリモートでは通りませんよね。
逆に質問内容と実際のものが同じ構成の場合、質問に出された内容構成のどこかに必ず誤りがあるはずです。単純に間違い探しです。いずれにしても、もう一度、分かりやすく実際のディレクトリ構成を提示されると答えが見えてくるかもしれませんね。

たとえばこんな感じで。

[ ローカル ]
C >
　　naha.htm
　　naha >
　　　　naha.jpg

[ リモート ]
hoge.com >
　　naha.htm
　　naha >
　　　　naha.jpg

補足

そうですね。では実際に
D:\homepage2010-08-\matenro\siosite\caretta1.html
これ本体です。
上手く開けるときのwriterでのハイパーリンクのプロパティのパス表示は
file:///D:/homepage2010-08-/matenro/siosite/ph-org/CA3C0175.JPG

このときのソースコードは
<A HREF="ph-org/CA3C0300.JPG">オリジナルダウンロード</A>　</P>

っと
これあってますね。
Writerのハイパーリンクのプロパティのパス表示が紛らわしかったですね。
それとも
file:///に深い意味があるのか。
いずれにしても深く考えることはなく、今のままでいいと今わかりました。
ありがとうございました。

回答No.3

tracer

トップディレクトリから見ると、この階層ですよね？
/okinawa/okinawa.htm
/okinawa/naha/hana.jpg

> C:\okinawa\naha\naha.jpg
これだとローカルからだけしか見れません。
リモート側にCというトップディレクトリがないためです。

> /naka/naha.jpg
この場合は、ローカルでもリモートでも見れません。
そもそもの参照が間違っています。

> ./naka/naha.jpg
この場合も、ローカルでもリモートでも見れません。
単順にタイプミスかもしれませんが、nakaの箇所はnahaですよね。
nakaがnahaになれば、この参照は正しいです。

okinawaディレクトリを、リモート・ローカルともにトップディレクトリ(最上層のディレクトリ)に配置するならば、次の絶対参照か、相対参照のいずれかで参照が通ります。

絶対参照(トップディレクトリから見た参照)
/okinawa/naha/naha.jpg

相対参照(okinawa.htmから見たnaha.jpgへの参照)
./naha/naha.jpg（※　naha/naha.jpg　でもよいです。）

お礼

回答ありがとうございます。

>絶対参照(トップディレクトリから見た参照)
>/okinawa/naha/naha.jpg

>相対参照(okinawa.htmから見たnaha.jpgへの参照)
>./naha/naha.jpg（※　naha/naha.jpg　でもよいです。）

両方試しましたが駄目でした。
他にも試しましたがNGです。
./naha/naha.jpgか

naha/naha.jpgで
通るとおもってたんですけどね。
なんでしょう。

回答No.2

piroshi999

>サブフォルダーnahaをつくりその中にnaha.jpg
>/naka/naha.jpgといれても./naka/naha.jpg(ドットが入っている）

綴り間違いですね。
/naka/naha.jpg　ではなく
/naha/naha.jpg　です。

お礼

このつづり違いはここのページだけです。すみませんでした。

回答No.1

hansenkoh

ドットが１つ足りないか、スラッシュが１つ余分なんだと思われます。

　フォルダの位置関係が同じ階層の場合、移動のリンクに必要なのは「../」ドット２つにスラッシュです。
　つまり「okinawa」と「naha」が更に上位の１つのフォルダ内に有る場合、

　[okinawa]フォルダ ─ okinawa.htm
　[naha]フォルダ ─ naha.jpg

　文字に付けるハイパーリンクは <a href="../naha/naha.jpg">那覇の写真</a> です。

　もし「naha」フォルダが「okinawa」フォルダ内にあるならフォルダ名の前にスラッシュは要りません。

　[okinawa]フォルダ ─ [naha]フォルダ ─ naha.jpg

　<a href="naha/naha.jpg">那覇の写真</a> になると思います。

お礼

たぶんこれだと思います。
今ちょっととりこみちゅうになってしまったので、時間が出来たらやってみます。
ありがとうございます。