webデザイン 相対パスか絶対パスか

質問

初歩的な質問失礼します。

今まで外部サイトへのリンクは絶対パスで、同じサイト内でのリンクは相対パスでリンクを記述するという認識でいたのですが、同じサイト内でも絶対パスでリンクを記述しているサイトをよく見かけます。

同じサイト内でのリンクの記述はプロの現場ではどちらが一般的なのでしょうか？
またその理由を知りたいです。

どなたかよろしくお願いします！

回答No.4

kao03 · ベストアンサー

私は、(No.2の方が書かれている所の)
サーバー相対URLを使用しています。
－－－－－－－－－－－－－－－－－－－－
<a href="/dir/demo.html">こちら</a>
－－－－－－－－－－－－－－－－－－－－

理由は、
このリンクを複数ページにコピーする必要が出てきた場合に、
<a href="/dir/demo.html">こちら</a>
↑どこのページにも貼れますが、
<a href="../../dir/demo.html">こちら</a>
↑ページからの相対リンクだと貼る箇所に合わせて修正する必要があります。

「サーバー相対URL」の場合、リンク先だけ正しければ
リンク元との位置関係を意識する必要がありません。

また、http:から書かないのは、サイトがオープンするまでは、
仮ドメイン(http://test.honban./)などでサイト構築し、
本番(http://www.honban./)に切り替えるためです。

なので、<a href="/dir/demo.html">この形を採用しています。

余談ですが、どの形式で書いてもサイトの速度は変わりません。
結局は内部的に変換されてしまうので。

ご参考までに。

お礼

とてもわかりやすいご説明ありがとうございました！

回答No.3

tkmojo

1の方が言うように、ローカルにサーバー環境がある場合を除き普通の相対パスが一番管理が楽です。（プレビューが正しく表示されるので）
ただ、人によって（もしくは使用ソフトによって）は階層が複雑な場合には「/」から書いた方が楽、という考え方もあります。
要はどっちが管理しやすいかという問題ですね。
私は普段全部相対パスで書いてます。

CMSやSSIでの共通パーツの場合は、「別階層のファイルからも同じ共通パーツを呼び出す」という特性上相対パスでは書けませんので、通常は「/」からの絶対パスで書きます。

http://からの絶対パスは、ドメインの引っ越しやディレクトリの大幅な改造の際に非常にめんどくさいので避けたほうが良いかと思いますが、
一時期「サイト内からのトップページへのリンクはhttp://から書いた方がSEOの効果がある」という噂があったので、そういうサイトもちらほらあるかと思います。

お礼

大変参考になりました。

ご回答ありがとうございました！

回答No.2

Lchan0211b

「絶対パス」「相対パス」という言葉は、
結構曖昧なもので、使うときは注意する必要があります。

http://blog.kaihatsubu.com/?p=1721
を参考に読んでください。

ここにあるように、
<img src="/images/hoge.png">
のリンク記述を「絶対パス」と呼ぶべきかどうかについて
議論があり、Microsoftはこれを「サーバー相対URL」と
呼んでいます。
こういうのは、人によって言葉の解釈が違いますので、
質問するときは、具体的なパス名や使用例を挙げて
質問しないと、自分の聞きたい回答と異なる回答が
返ってくることになります。

実は「絶対」という言葉に「絶対」はないのです。
必ずなんらかの条件を前提にした「絶対」であり、
その前提条件の下での「相対」であるということなのです。

質問に対する回答ですが、結局、「アクセスしようとしている
リソースと、自分との間で共通のリソースは何か?」を考えて、
「その共通リソースを元にした相対パスでアクセスする。」
と考えればよいです。
(それがちゃんと考えられてなくて、おかしなリンク記述になって
いるケースはよくあります。)

例えば、自分が今、あるフォルダ配下にWebページを作っていて、
いくつかのHTMLページと画像ファイルで構成しているなら、
それらは、その「あるフォルダ」が共通のリソースになりますので、
そのフォルダを元にした相対パスにすればよいです。
例えば、「webpage」というフォルダ配下に
webpage/document/page.html
webpage/images/image.png
というファイルを作ってpage.htmlからimage.pngにアクセスしたいなら
<img src="../images/image.png">
という相対パスでアクセスすればよいです。

もし、そのWebページを作る時に、サーバホスト内共通の画像部品を
使っているなら、その部品と共通するリソースである「サーバホスト」
を元にした相対パスで記述すればよいです。
それが冒頭の「/images/hoge.png」です。
Microsoftはこれを「サーバー相対URL」と呼びますし、
これを「絶対パス」と呼ぶ人もいます。

もし、別のWebサイトに対してアクセスするなら、共通している
リソースは「インターネット」です。
「http://hostname/pathname」は、絶対URLと呼ばれますが、
それは「インターネット」という共通リソースを元にした
相対パスなのです。

お礼

丁寧なご回答ありがとうございました！

回答No.1

ORUKA1951

開発環境によります。
ローカルにテストサーバーがあれば、圧倒的にルートからの絶対パスのほうが便利です。
　理由は、webデザイン a要素のhref="/"( http://okwave.jp/qa/q8512524.html )に書きました。
　私は、Firefoxですが、テキストエディタ(EmEditor)でツールバーのプレビューボタンを押すとサーバー経由のブラウザ表示に切り替わります。
　またファイルをブラウザで直接開いたときもServer Switcher( https://addons.mozilla.jp/firefox/details/2409 )でapacheに切り替えればよいです。さらにServer Switcherでリモートホストに切り替えたり
　これが出来ないと、ファイルマネージャ(エクスプローラ file:/// )からになりますから、/からパスは使えないです。

★ローカルサーバーで
http：//A-cite.local/ ⇔ file:///E:\user/web/A-cite/
とかが可能か否か!!
　そうしないと、<a href="/">TOP</a>でfile:///E:に飛んじゃう(^^)

お礼

ありがとうございました。