青空の会サイトりにゅぅ

もう先々週の話ですが、うちの同人サークル「すばらしき青空の会」のサークルサイトをリニューアルしたのでその話題。

2009年冬コミで素晴らしき青空の会にうちが合流(?)して、それから1年半の2010年6月にサークルサイトを立ち上げ、サークルサイトも2年半が経ち、だんだん情報がごちゃごちゃしてきたなあと感じていたんですよね。
ちなみにその感じてた点とは──
■既刊紹介のデザインに柔軟性がない
とりあえず既刊紹介を横に2つずつって枠で並べるように寸法したんですが、意外に既刊情報の寸法にまとまりがなくて、いまいちだなぁと。
この辺は実は2年半前に以前のデザインが完成したときから気になってて、改装意欲が上がる前からどうしたらいいかなぁと考え続けてたり。
■参加予定イベントを書く場所に思い通りに情報を並べられない。
これは作る側の手間の問題なんですがね。今度のコミケはなんとか出します! とか書くあの枠。個人的にイメージとしては、最低でも左側に左揃えで文章を、右側に本の表紙とかの画像を並べたいと思ってるんですが、あの枠だとそれが上手く出来なくて、毎度誤魔化し誤魔化しそれっぽく書き上げてるものの余計な時間がかかるしその割りに汚い。
楽に、あわよくばより綺麗になったらいいな。
■画面が縦長すぎる
ページの縦の長さが長すぎるのがなにより気になってました。ページの構成的に大抵の目的では下にスクロールしなくてもいいようにしてはあったんですが、例えば「どんな本出してるのかな…」とか「今までの例大祭はどれぐらいの頻度で出てたのかな…ｱﾊｧ」とか「各個人個人のブログとかあるのかな…」みたいな状況で、あのスクロールをしたまで下げてくのは手間だし、既刊誌も順当に増えた今あの情報の並べ方がそもそも向いてないっていう。
■HTMLが陳腐
陳腐、というか。うちのFireFoxで見るとあのサークルサイトだけやたら表示に時間がかかって、理由は分かんなかったんだけどなんとなく妙な括り方をしてたDIVを正したら上手い表示してくれるかなと思ってみました。
■サークルロゴを作った
この間の冬コミから使われてますが、素晴らしき青空の会もサークルロゴが出来ましたー!
せっかくなのでサイトに使いたかったんですが、今までのだとはめ込める場所がなかったんですよね。

──って感じで色々問題とかをはらみながら今回の改装にいたったわけです。
てことで今度は主な推しポイントをー。
○なんといっても黒枠をベースにしたページ作りをやめてみました。あまりにも使いやすいもんだから、てこまいとか何かのまとめサイトとか何かの保管庫とか、いろんなのに流用し続け何気に8年続いたスタイルをこの機会に一新。
この時点で中身が大して変わってなくても見た目ががらっと変わった感じに。
○ゼロベースで作り始めたのでCSSもほぼゼロベースで。今改めてCSS書くんだし思ってより本格的にCSSを記述してみました。表もdivで組み立てたしもうHTML3.2時代のタグは使ってないんじゃないかな?
ただ色々取り込みすぎてIE対応はかなり甘くなってて、情報によるとIE7以下ではうまく表示できないらしい(未確認)。自分のサイトはともかくサークルサイトはあまりハードルを上げないつもりだったんだけどね。統計見たらIE7は1.15%、IE6は0.53%だそうで、同人に足を突っ込んでる人の情強さを加味、さらにうちのサークルのサークルサイトを隅々まで見る人が古いIEを使い続けてる可能性も加味すると多分ゼロと言っていいと思うので無視。
まぁ表示がどうとか抜きに速くIEなんてやめてchromeとかFirefoxとかに乗り換えた方がいいよ。IEはパンクした自転車に乗り続けてるようなもんですんでー。
○上でも書いたとおりサークルロゴが出来上がりました。うちにしては珍しく何かに迎合して作ってみました。おそらくちょこちょこ使ってくかと思うのでよろしくです。これについてはそのうちてこまいのどこかにアップしたときに触れると言うことで。
○既刊紹介のデザインを代えてみました。これが一番のキモかなー。
今までは頒布順だった並び順を、在庫の有無で分類してからの頒布順に変えてみました。これで何が残ってるのか分かりづらくはなくなった。
あと数が増えてきたので全部の情報を表示しっぱなしにせずとりあえず表紙画像だけ並べて、気になった物はクリックすると見えるようにしました。ブログの[続きを見る]ボタンみたいな感じで。多分本の詳細の情報が知りたい人の量って、今まででイベント一覧だとか個人のブログリンクだとかを見たい人と同じぐらいしかいないと思ったので、情報を全部表示しておくことより必要な情報だけ見られるように見たい物を広げるって発想にしてみました。
ただソースがあくまでブログの[続きを読む]なので、最近通販サイトによくあるフローティングウインドウ風のアレみたいな挙動はしなかったり。なので詳細を閉じるときに画面の他の場所を押したら消えるなんて気の利いた挙動はせず、詳細の[閉じる]をクリックするか開いたのの表紙をクリックするしかなかったり。あとなにかを開いたままで他の本を見たくなったときに、通販サイトとかのあれだと今のを閉じてクリックした別のを開いてくれるけど、うちが今回使ったのは二重に重なって開くだけ。
──今考えれば使うもん間違ったかなぁ。まぁだいたい動いてるんでとりあえずはこれでいいかなぁなんて。
○色々としたので縦長だったページもだいぶ短くなりましたー
。画面を実際にスクロールして数えてみたところ、これまで150スクロール分だったのが、今回のリニューアルで50スクロールぐらいに(153スクロールが48スクロールに。縦の長さ1/3ですね。おー!

あと今はまだイベント情報が無いけど、イベント情報の枠がアグレッシブな頒布物告知が出来るようになると思います。イベント直前にそんな時間があるのか?と言われると…。

ただメールフォームがリニュ前ほとんどそのままなんだよなぁ。別に使う人もいないだろうと思って後回しにしちゃってるんだけど。
このメールフォームを完成させたらうちのサーバーに4つぐらいあるメールフォームも全部新しいのに移行させよう。後はてこまいに貼ってるTwitterブログパーツをちゃんと動くやつに替えて、インデックスに使ってるRSSパーツも動くやつにしないといけないし、てこまいの頂き物イラストのページにサムネイル付けたい気がしてきたし、よんち印刷のバナーをもうちょっと大きく作るためによんち印刷用のキャラクターを書き起こさないといけないし、そもそもよんち印刷のサイトを完成させないといけないし、それが完成したらよんち印刷の見本誌とガイドブックみたいなのも簡単に作りたいし──はぁ、やりたい事多すぎすなぁ。

──なんというか。てこまいもすばらしき青空の会の今後ともよろしくー。
あ、そんなこと言っといて何ですが来週はブログ休みますー