スタイルシートとの出会い
今までサイトの構築にカスケードスタイルシート（ＣＳＳ）は使用していました。ホームページの更新にはいつもホームページビルダーを使用しているのですが、このメニューの中に「サイトにスタイルを適用する」などの項目があり、何だろうと思っていじっているうちにうまく適用できてしまって、統一感をとったページを作成することができたためです。スタイルシートと出会ったことで、サイトの作成効率はかなり良くなったのですが、まだまだサイトを構築していく上で不便な点はいろいろありました。
不便な点
まずは、各ページの構成です。テーブルを使用してホームページをデザインしていたのですが、テーブルを使ったデザインには自ずと制約があります。また、表組みをあまり複雑にすると、ブラウザでページを表示させようとすると、表示が終わるまでに非常に時間がかかってしまうことがあります。
また、メニューを作成するのにも不便な点があります。たとえば、このページの左側のようなメニューを各ページに貼り付けておいたとしましょう。もしも、コンテンツが増えていってカテゴリーを追加したり増やしたりしたら、全ページの左側のメニューをメンテナンスしなければいけなくなります。小規模なサイトであればそんなに問題にならないと思いますが、ページ数が１０を超えたあたりからメンテナンスが非常にたいへんになってきます。
このようなときに、どんな技術を使えば楽にメンテナンスができるようになるかを調べている中で見つけたのが、このＳＳＩ（Server Side Include)という技術です。
ＳＳＩの概要
ＷＥＢサーバーのほうで発信するHTMLの内容を加工してクライアントのパソコンに送信してくれる技術です。従って、クライアントパソコンから見れば、すでに加工済みの普通のHTMLが発信されるので、クライアントのブラウザの環境などを気にする必要がありません。一方、サーバーの方はＳＳＩが使えるように設定をしておかなければいけませんが、レンタルサーバーの中には、セキュリティの確保やサーバー負荷の軽減のために、ＳＳＩの使用が出来ないように設定しているところもありますので注意が必要です。
さきほど説明したメニューのようなものの場合、メニューの部分だけを別のファイルに分けてサーバーにアップロードしておきます。そのメニューを貼り付けたい場所にＳＳＩのおまじないを記入しておけば、それだけでメニューが該当の場所に挿入されて表示されるようになります。
もしもメニューの内容に変更が出た場合には、来だしておいたメニュー用のファイルの内容を更新してアップロードしておけば、ＳＳＩで読み出しを行う全てのホームページに更新をしたのと同様の効果があります。
自宅サーバーの設定
ＳＳＩを使用できるようにするためには、ＷＥＢサーバーに設定をする必要があります。私はApacheというＷｅｂサーバーを使用していますが、このhttpd.confに下記の太字の部分の記述を追加しました。
下記は実際にＷＥＢを公開しているディレクトリに関する設定を行っている部分について、「Includes」という記述を追加します。
<Directory /home/･･････････････>
AllowOverride All
Options Indexes MultiViews Includes
</Directory>
下記は丸々一つの行の追加になります。他のサイトではコメントアウトされていると書いてあったのですが、私のhttpd.confにはなぜか無かったので、１行追加しました。本当はＳＳＩを使用するページの拡張子は「shtml」として、そのページだけにＳＳＩのページ解析をAPACHEに実施させるようにすれば、ＷＥＢサーバーの負荷を軽減することができるのですが、私は既に出来上がっているページを順次、ＳＳＩを使って書き換えていきたかったので、「.htm」と「.html」の両方をＳＳＩの解析が実施されるように設定しました。
AddType text/x-server-parsed-html .html .htm
ホームページの作成
ホームページの作成にはＩＢＭのホームページビルダーを使用していますが、ＳＳＩのコマンドを挿入するときに支援してくれる機能が付いています。ちょっとメニュー的には気がつきにくいところにあるのですが、「挿入」→「その他」→「ＳＳＩ」で指定できます。
一番便利な、「ファイル挿入」ですが、fileとvirtualという２つの選択肢があります。最初私はfileの方を使用していたのですが、挿入したい先のファイルが自分より上位のディレクトリにあるときにエラーメッセージが出力されて、うまく挿入ができなかったので、virtualの方を使用することにしました。
他にも下記のような表示がＳＳＩで実施できます。これらはすべて、ホームページビルダーの機能を使ってHTMLの中に埋め込みました。
| 最終更新時間表示 | 12/12/05 |
| ファイルサイズ表示 | 13,990 |
| 日付表示 | 01/06/06 |
| ＵＲＬ表示 | /homeserver/ssi/index.htm |
アフィリエイトへの応用
このＳＳＩですが実に手頃で便利です。また、アフィリエイト広告の管理にも絶大な威力を発揮することが判りました。アフィリエイトの広告の内容はときどき提供者側の都合で差し替えないといけない場合があります。ＳＳＩを使用しておけば一カ所の広告を貼り替えておけば一気に全ページの広告を貼り替えることができて非常に便利です。
コメント