ランダムバナー Ver.1.00

はじめに。

この度は ランダムバナー をダウンロードしていただき、ありがとうございます。
以下に設定方法などの説明を書きます。十分に読んでから、設置をしてください。
またご不明な点があれば文末のアドレスまでご連絡下さい。
ソフト紹介

 インターネットショップも一つの大きなマーケットとして認知されて久しく、Amazon.comから楽天のようなインターネット専門の企業、また一般大企業のネット販売から、小さな街の商店がネットショップを経営することも珍しくなくなってきました。
 インターネットショップの大きな特徴の一つは、初期投資が格段に安く済むということにあると思います。もちろん運送費等の経費は店舗販売に比べても余分に掛かりますが、出店する際の投資は比較して非常に安価で済みます。

 しかし、このようにインターネットショップを運営するに一番のネックになるのは宣伝です。よくメルマガなどのヘッダーにネットショップの宣伝などがありますが、このようなものは(少なくとも私個人の経験としても)まず見ません。また大きなサイトにリンクを張ってもらうというのは、宣伝効果としては大きいかもしれませんが、その効果のほどは保証されない上に非常な金額をとられます。
 ではどのようにすれば、小さなネットショップに多くのお客様に来ていただくことができるのでしょうか?そこで考え出したのがランダムバナーです。

このランダムバナーの特徴としては…

1..視覚的…商品その物を有無を言わさず見せるという形で情報提供しています。よくあるダイレクトメールなどは意識的に読まなければ内容がお客様に入っていかず、「流される情報」になってしまいます。
2.動的…動きのない情報提供はすぐに興味を向けられなくなります。アクセスの度に内容が変わるということで、そのホームページに入ったときに飽きられることなくバナーに目がいくようになります。
3.簡便…お客様が商品のところにたどり着くためには、ただバナーが表示している写真をクリックするだけです。商品までの道のりに手間をとられるようでは、多くの来客というのは望めません。

この三点を意識して作りました。

 もうお気づきかもしれませんが、この手の広告の先駆者はAmazon.comのアフェリエイトシステムです。アフェリエイトはこの三点をクリアしつつ、またパートナーを増やす最も効果的な方法「報酬」を可能にするシステムを構築しています。しかし、そのシステムは非常に複雑で導入するにしてもメンテナンスが大変で、且つシステムを購入orレンタルするにしても高額です。

 このランダムバナーは広告効果としては同等でありながら、設置も安価ですみます。是非ご活用下さい。
 またバナー自体をテンプレートにしているので汎用性が高く、工夫次第でどのようにでもご利用頂けると思います。
機能紹介

・紹介したい商品を画像入りで紹介。
・価格・商品名を表示可能。
・商品をクリックするとその商品ページへ飛ぶ。
・表示された時・回数、クリックされた時・回数のログが記録される。
・バナー設置は基本的にHTMLソース一行で完了。

の四点が機能としての特徴と思います。

[構成ファイル]
rand_banner.cgi
rand_list.cgi
ac_analyzer.cgi
frame.cgi
source.htm
db_make.exe(ランダムバナーデータベース管理ソフト)
data.dat(上記のソフトで作成)
画像ファイル
(ローカルで用意) 
です。

[使用方法]
 各CGIファイルの先頭行はそれぞれ設置するサーバーのPerlへのパスに合わせて下さい。
 データベース管理ソフトの使用方法は画面を見て頂ければだいたい見当は付くかと思いますが、それぞれの項目を入力して[Enter]で入力完了。画面左のリストに反映されているかと思います。もし消したい項目が在れば左のリストの商品名を選択して[Delete]を押すと消えます。この様に編集して最後に画面下の[データ出力]のボタンを押すとdata.datが本体ファイルがあるフォルダに生成されています。それをアップして下さい。
 そして、画像データを/imgフォルダに入れます。画像の大きさはご使用のテンプレートによりそれぞれ異なるかと思いますが、出来る限り小さいめに、つまりテンプレートそのままの大きさにすると、データも小さくて済みますし、きれいに表示されるかと思います。

[ログ機能]
 またこのバナーにはログ機能が付いています。ログは二種類。バナーがどれだけ表示されたかという記録(log_view.dat)と、バナーがどれだけクリックされたかという記録(access.dat)です。具体的には

・アクセス日時
・アクセス時間
・商品名
・価格
・IP
・リンク元

の記録が残ります。
アップロード
以下に図で示します。
/ から始まるものはディレクトリを表します。
カッコ内の値はパーミッションです。

/hana (755) -+-- /img (777)
             |
             +-- rand_banner.cgi (755)
             |
             +-- rand_list.cgi (755)
             |
             +-- ac_analyzer.cgi (755)
             |
             +-- data.dat (644)
             |
             +-- source.htm (644)
             |
             +--(frame.cgi) (755)
             |
             +-- log_view.dat (755)
             |
             +-- access.dat (755)
先述のaccess.datとlog_view.datはCGIに依って自動的に生成されるものですので、パーミッションを気にする必要はありません。

カスタマイズ

[データ作成]
 まずデータベース作成用ソフトで表示させたい商品のリストを作ります。画像データの欄はファイル名のみの記入で結構です。ただしリンク先の欄は絶対パスでお願いします。またフレーム方式のお店でのご利用の場合は、商品が子ウィンドウに表示されるので工夫が必要です。
 色々対処法があるかとは思いますが、一番簡単な対処法は同封してあるframe.cgiのような方法です。つまりCGIにQUERY_STRINGで表示させたい子ウィンドウのアドレスをCGIに渡し、そのアドレスを埋め込む形でフレームそのものを生成させる方法です。カスタマイズの方法としてはframe.cgiをエディタで開いて、

print << "EOD";
<html>

hoge

</html>
EOD

のように二つのEODを挟むような形でおそらくはindex.htmに相当するであろう内容をそのまま流し込んで下さい。そして商品が表示されるウィンドウのソースはframe.cgiを参考にsrc="$ENV{'QUERY_STRING'}"として下さい。これで準備できました。データベース作成の時、その商品のリンクは

http://www.hoge.com/cgi-bin/rand/frame.cgi?http://www.hoge.com/shop/good/shohin1.htm

といった形になります。これでフレーム内に期待の商品が表示されるようになります。

 次にその商品の画像について。特にブラウザで表示できる形式であれば画像の形式について制限はありませんが、サイズについては極力バナーで表示される大きさで作成されることをお奨めします。出来るだけ軽い方が軽快な動作が期待できるからです。
 ここで一度動作確認をしてみて下さい。きちんと表示され、クリックによって希望するリンク先に飛ぶことが確認できれば、完了です。

 一通りデータを作成し終えたらrand_list.cgiにアクセスしてみて下さい。これはデータ一覧を表示させるためのCGIです。これで画像がきちんと表示されているか、リンク先は正しいかなどを確認することが出来ます。逆に、ここで間違っていれば、バナーでの表示も期待したものとは異なります。

[デザイン作成]
 最後はデザインです。このランダムバナーはテンプレート方式でデザイン変更が自由ですので好きなように変えることが出来ます。デザイン変更の際に気をつける点としては、テンプレートの中に__hoge__という形の文字列が埋め込んであると思います。これはそれぞれバナー背景の色(__color__)商品の指定()、リンク元()、画像()、商品名()、価格()、にそれぞれ対応しています。商品の指定とリンク先はわかりずらいかもしれませんが、画像へのリンクタグはあまり気にせず変更せずに張り替えて下さい。

アクセス解析データの集計
 access.datとview_log.datがアクセス解析データなのですが、その集計は容易です。それぞれのデータ項目をタブ区切りで一行ずつ記録しているだけなので、Excel等でそのままCSVとして読み込んで頂けます。
 ログはずっと残り続けますので、企画を適当に区切って削除して下さい。削除はファイルごと消して下さい。だいたい月に一回程度が目安かと思います。
設置方法
 最後にバナーの設置方法です。
  設置は

<IFRAME SRC="http://www.hoge.com/cgi-bin/rand/rand/rand_banner.cgi?FFFFFF" width="255" height="140" frameborder="0" marginwidth="0" marginheight="0"></IFRAME>

という形の一行で設置完了です。もちろんアドレスは変更して下さい。ただし、二点注意が必要です。
 rand_banner.cgiへ渡されているQUERY_STRINGはバナーの背景色です。ご覧のようにバナーはインラインフレームですので、バナー本体とインラインフレームとの間に空白が出来ます。これを設置しているホームページのデザインを損なわないように、ホームページの背景色に合わせることが出来ます。このQUERY_STRINGを指定しない場合は背景色は黒になります。
 もう一点はインラインフレームの大きさです。一応例としてあげている数値は添付してあるデフォルトのテンプレートに合う大きさです。しかし合うといっても、テーブル仕様のテンプレートの場合(多くはそうだと思いますが)テーブルの大きさとまったく同じでは表示させた時にスクロールバーが出てしまいます。このスクロールバーは見た目的に好ましくないと思いますので、極力出ないような数値を設定したいものです。

 スクロールバーを出ないようにするコツとしては
・テンプレートでのテーブルのデザインをパーセントではなく、ピクセルでの絶対値にする。
・インラインフレームの大きさをテンプレートの数値より10ほど多く設定する。
・表示画像の大きさを忘れずに指定する。
・商品の名前が二行にわたる可能性を考えておく。(三行にわたる場合には、テンプレートのデザインを変更するか、その商品の時だけはスクロールバーが出るものと諦めましょう(爆))
履歴

Ver.1.00  
2005/1/29 Release
開発環境 等
Windows XP SP2

[CGI 一式]
WZ Editor
Dreamwaver

[ランダムバナーデータベース管理ソフト]
Visual C++ 6.0 with MFC

作者
はじ銀
免責

本ソフトウェアはフリーウェアです。配布・転載は自由です。ただし雑誌等へバンドルの場合は是非御一報を♪
本ソフトウェアを使用したことにより生じたいかなる損害も、当方は一切責任を持ちません。自己責任の上での利用をお願いします。
ウィルスチェックはNorton Internet Security 2005で行いました。