六花工房
六花工房
 
  TOP Material Web FAQ BBS Link  
 
Web
サイト制作(個人編)
サイト制作(企業編)
    はじめに
    Webの基礎知識編
   

HTMLの構造編

    基本的なタグの知識
 その1
 その2
リンクについて
 その1
 その2
テーブルの使い方
フレームページ
スタイルシート
チェック観点
     
Web制作のお仕事とは?

Webサイト制作(企業編)|HTMLの構造編(2)

AというページからBというページへリンクを貼る、ということが、Web制作の際にはよく発生します。
しかし、このリンク、簡単なようで結構いろいろ難しい問題があったりします。
リンクの貼りかたについては、「基本的なタグの知識」で説明しましたので、ここではそれ以外のさまざままリンクについての決まりごとや問題点を見てみましょう。

相対パス

リンクを貼る際によく「パス」という言葉が使われます。
「パス」には2種類あります。まずは「相対パス」から。

一般的に同じサイト内にあるときは、相対パスといわれるものを使います。
例えば、TOPページから、「登場人物紹介」のページへリンクを貼るとします。
このとき、リンクは相対パスで表されます。
chara/index.html
これがリンクの相対パスです。

相対パスは自分がいる場所を基点に考えます。
TOPページは一番階層が上なので、他のところへリンクを貼るときは、
chara/index.html
novel/01/01.html
といった形になります。

一方、「本編」のindex.htmlを基点に考えてみると、これが変わります。
TOPページへリンクを貼るときは、
../index.html
となります。「../」は階層を1コ上に上がりなさい、という指示になります。
また、本編ディレクトリの中にある「01」ディレクトリ内の01.htmlにリンクを貼るときは、
01/01.html
となります。これは、TOPページから他ページへリンクを貼るのと同じとなります。
では、本編ディレクトリと同じレベルの階層にある「登場人物」の「min.html」への相対パスはどうなるでしょう?
これは
../chara/min.html
となります。
「../」で1つ階層を上がり、「chara」というディレクトリに下りて、その中の「min.html」というファイル、という指示になります。

ちなみに、同じ階層にあるファイルへのリンクの場合、
./01.html
といったように表す場合もありますが、これを使用するのは、主にプログラムが絡んだときが多いような気がします。普通に静的ページをつくっているときは、あまり出てこないかもしれません。

▲このページのTOPへ戻る

 

絶対パス

自分のサイトから、他のサイトへのリンクを貼る場合には主に「絶対パス」といわれるものを使用します。
絶対パスは、要するにURLを全部書くのです。
『竹林奇譚』から、YAHOOのTOPページへリンクを貼るとすれば、そこには、
http://www.yahoo.co.jp/
と「絶対パス」を記載することになります。

同じサイト内でも絶対パス!もある

同じサイト内では相対パス。他サイトへの場合は絶対パス。
原則はこれで問題ありません。
ただし、絶対パスの場合、同じサイト内のページであるにも関わらず、相対パスではなく、絶対パスで指定しなければならない場合があります。

パターン1)プログラムへのリンク
CGIなどの動的ページへのリンクは、絶対パスを使用することが多かったりします。
1つの理由として、サーバーによっては、プログラムを置くディレクトリが制限されていることがあるからです。
しかも、呼び出す(作動させる)ときに「このアドレスじゃないと呼び出せませんよ」となっていることがあるのです(面倒な…)。
たとえば、通常のページは
http://www.tikurin.que.jp/
でも、プログラムは
http://cgi-bin.que.jp/bbs.cgi
というアドレスじゃないと動かせない、というようなことも!
企業のサイトではあまりないと思いますが…。
この場合、http://www.tikurin.que.jp/index.htmlからプログラムにリンクを貼るときは、http://cgi-bin.que.jp/bbs.cgiときちんと書かなくてはいけない、ということになります。

わかりやすく言うと…
http://www.tikurin.que.jp/をAさんの住所
http://cgi-bin.que.jp/bbs.cgiをBさんの住所
として考えて見ましょう。

相対パスはAさんのおうちの中でなら通用します。
「chara/index.html」というモノがあったとしたら、
「家の中の、chara/index.htmlをとってよ」
で通じます。これが相対パス。
一方、プログラムはBさんのおうちにあります。この場合、Aさんの家にいるのなら
「プログラムとってよ」
といっても、どこの何かはわかりません。
「Bさんのところにあるプログラムだよ」
といって初めてわかります。これが絶対パス。
プログラムは他の住所にあるので、絶対パスで指定しないといけないことがある、ということです。

あとは、個人的な理由なのですが、こんなこともあります。
例えば、自分のパソコンでまずはサイトを作成します。
その際、よく「プレビュー」機能を使って、実際にページがどのように表示されるのか確認しながら作業を行うのですが、プログラムはローカル(つまり自分のパソコンの中)では、作動しません(作動させる方法もありますが)。
なので、はい、見てください。こんな感じになります。

ローカル上のプログラム

これでは、実際に正しくリンクが貼られているのか、といったことは確認できません。
ですので、実際に本番ページにUPされているプログラムへの絶対パスでのリンクを貼ったりするのです。
そうすると、すでにUPされているものですので、ローカルで確認しても現在本番にUPされているものが読み込まれてきちんと表示される、というわけです。
まあ、理由はどうであれ、「プログラムへのリンクは絶対パスで指定することもある」ということです。

パターン2)プログラム内でのリンク
私も詳しくはまったーくわかりませんが、なにやらプログラムの中には、「絶対パスで指定」しないといけない場合があるようです。
そうしないと、動かないというわけです。

パターン3)セキュリティのかかったページへのリンク
会員制サイトや、ショッピングサイトでは、SSLという暗号化されたセキュリティのかかっているページが存在します。
この場合、通常のページは「http」で始まるのですが、SSLのページは「https」と最後に「s」がくっついています。このときは、相対パスではなく、絶対パスを使う必要があります。
「http」で始まるページから相対パスでリンクを貼ることはできないからです。
逆もまた然り。「https」が必要のない、通常のページへ戻す場合は、絶対パスでリンクを貼る必要があります。時々、これができていないサイトにお目にかかりますが(笑)。
後者はさほど問題ないかもしれませんが、前者はセキュリティをかけるべきところが、かかっていないということになってしまいますので、気をつけてください!