タテバナー登録CGI

■かっこいいっ

zero-zeroさんがタテバナー登録CGIを試験的にアレンジしてテスト設置してくださったのですよ。うわぁ、すごいすごい。カッコイイ。


バナー受付から発行まで、かなりの部分を自動化できるばかりか、小説の説明まで出来てしまうという。(いや、別に説明はやろうと思えば現行でも受付時点でなら即日出来なくはないんですが、登録バナー一覧ではそういうデザインをしていないので受付時点でだけそんなことしても意味がないと言えばない……)
タテバナーでだけ使うのもったいないですね。もうちょっと小さいサイズのランダムバナーとか、やってみると面白いかもですよ。ひさちさんが王子王女で作っていたあのサイズがいいなぁ。レイアウトの邪魔にならなくて、しかもサイト用リンクバナーとはちょっと違う味わいで、バナーデザインのしがいがありそうですよ。規格バナーに丁度よさげ。
うちで使うかどうかは、ちょっと考えさせてください。あとで書きますが、ちょっとばかし考えていることがあって、それを実行するかどうか決めてからにしたいというこちらの事情です。勝手言ってすみません;

■経緯をまとめておこうっと

とりあえず、知りたい人がいるのかどうかは疑問ですが、タテバナーが出来るまでの経緯を簡単に書いておくというのも価値があるかもしれませんということで。
もともとはですね、お遊びでした。共同運営お絵かき掲示板で、まあちょっとした思い付きから、こういうサイズの大きなバナーを作ってみたら面白いんじゃないかなぁというような話を、私が投稿した…んだとおもいます。ええ多分(自分のことなのにうろ覚え)。去年ぐらいでしたっけ? もうすでに覚えていないんですが; 気持ち的にはあきこさんのところのデカバナーなんかを見ていて、CGIじゃなくて、Javascriptなら負荷的にいけるんじゃないかなという気分とか、でもあのサイズはデザインによっては邪魔になりそうだなとか、本物の広告と間違えそうだなとかいうのがあって。その時に、何かで縦型のバナーを見たのじゃないかなと思います。で、確か縦型の国際サイズみたいなのを見たんだったのかな? 最初は120*480だったんですが、縦が長すぎるという意見が多かったので120*360にしたのだと思います。

あまりページが重くなりすぎるのは良くないという意見があったものですから、その場にいた人(その掲示板に意見を出した人、という意味ですが)たちの意見をとって15kb前後のファイルにしようということになりました。(指摘するのがちょっと大変なので、現在、受付をしている掲示板で投稿時に多少のファイルサイズ制限を行っています。多少余裕を見ているので、やや大きめファイルサイズの画像もそのまま通してしまっています。多少表示の縦横サイズが間違っているのに気づいても、直さずにそのまま120*360で無理やり表示させています。だって、レイアウト崩れたら嫌じゃないですか。うちならともかく、よそで困るようなことはちょっとイヤだし。)

最終的に30件押し出し式のあの形に収まったわけですが、ああなるまでにいろいろ皆様にご尽力いただきまして。今では最初のところから数えるとなんともう少しで延べ件数が500件ですよ。びっくりですよねぇ。Javascriptなのでモニタできませんけど、何サイトぐらいがアレを呼び出しているんでしょうね。10件とかじゃないのは確かですね;

■現状

今現在、あのスクリプトが吐き出しているHTMLは、"ここ"にあるとおりです。

Aタグにクラス指定がしてあるので、A.tbnrのセレクタスタイルシートも適用できてしまいます。あんまり意味なさそうですが。imgタグにもクラス指定したほうが良かったかな; 考えていなかったけど。imgにはちゃんとタイトルも指定してありますので、オペラとかでもタイトルのツールチップが出る…はずです、確か。

参考までに更新の手順なども書いておきます。

  1. 前回更新分の最後のログ番号を確認、投稿された記事を確認
  2. イメージファイルを保存(ファイル名をtbn_ログ番号にする)
  3. tbnr.jsを開いて、過去データをずらす。(今回更新する件数分だけ)
  4. 更新分のデータを入力して保存する。
  5. ↑で作ったデータ部分をコピーして、タグ吐き出しHTMLファイル(これJavascriptを含むためテキストファイルにしていますので保存してから見てください)に貼り付けて保存、実行(ブラウズ)する
  6. 出来たタグをバナー一覧ページ、登録リストに貼り付け、過去リストを整理
  7. フレームページを表示させて、全体の表示確認
  8. date.jsの更新日書き換え
  9. 画像ファイルアップロード
  10. tbnr.js,HTMLファイル(バナー一覧、登録リスト、過去リスト)、date.jsの順にアップロード
  11. 不要な画像ファイル(押し出されたバナーのことです)をサーバから削除
  12. 再度オンラインで表示確認をしつつ、掲示板に更新履歴書き込み
  13. 終了

あり? 書き出すと、意外と煩雑っぽく見えますね。大して頭を使う作業じゃないので別にそれ自体はまあいいのかなぁとは思っています。

■おうちでタテバナー&一体型のアイディア

こういうことをやったら面白いかな? ということ。いろいろ問題含みなので一応黙ってはいたんですが、まあ言う分には問題ないかな(どうせやるのは自分なので、自分が作業を進めなければそれまでかと)。

*おうちでタテバナー

タテバナー表示のアレンジのアイディア。
うちはオリジナル一般向けしか扱っていないんですが(一応。かなり審査甘いという話もありますが)、自分のサイトでだけ表示させたいバナーがあったりした場合に、一緒くたにランダム表示させることが出来る、というアイディア。
何のことはなくて、タテバナー様のスクリプト内で抽選を行って一定の率でタテバナーのスクリプトを実行させるSCRIPTタグをdocument.write();するという、ある意味乱暴なものなんですが。スクリプトのダウンロードよりかは(画像がないとかいう)不具合は起こりにくそうな気がします。
例えば特定ジャンルのリンク集で別途募集して半々で表示させるとか、個人サイトで自作品用バナー(二次創作とかBLとか高画質版とか)を混ぜ込むとか。
宣伝はしたくないけど、タテバナーはやってみたいとかいう向きにもよさそうかなぁ。
でもこれをやるんなら、一体型版が必要なのよね。説明ページを自力で作って、そちらにフッタからリンクする形にすれば、大抵のトラブルは回避できるかな、と思っているんですけど。需要はあるかなあ?

*一体型版

バナーだけじゃなくて、フッタとか、それを囲むdivタグとかも一体でdocument.writeするバージョンのスクリプト。外部スタイルシートファイルを同時配布して、スタイルシートを調整することで個性を演出できる形に。タテバナーの説明ページへのリンクを併記しなくても、リンクも一緒に書き出すので、ある意味ではラクかもしれない?
書き出すタグの例(案)
<div class="tbnr">
<A HREF="小説のURL" TARGET="_blank" class="tbnr">
<IMG SRC="バナーのURL" ALT="無料オリジナル小説宣伝「小説タイトル」" WIDTH="120" HEIGHT="360" border="0" title="「小説タイトル」"></A>
<div class="tbnr_foot">
<A HREF="http://satsuki.sakura.ne.jp/~kate/tbnr/" TARGET="_blank" class="tbnr_foot">タテバナー</a><br />
<A HREF="http://hm2.aitai.ne.jp/%7Ekate/" TARGET="_blank" class="tbnr_foot2">Girlish Frolic</a>
</div>
</div>