Blog

Published on

RSS

ヴォルフロッシュv3 -デザイン

ってことでv.3になりました。

結局時間かかったなぁ。しかもそれでも無理矢理9日に押し込んだ感があって、まだ終わりきっていないところが多々ある。しかし、それを待っているといつまでたっても上がらないのは目に見えているので、まだ終わっていないのに無理矢理上げる。いわゆる「見切りなんとか」。ここ1週間=10日の間はちょっと破綻してても見逃してくれると嬉しい。詰められるところから詰めるんで。

v.3について。色々書きたいことはあるのだが今日はひとまずデザインのことを書こうと思う。

v.1(フレーム)からv.2の時はほとんど見た目やテイストは変えなかったのですが、今回は大幅にリデザインしました。特に、ロゴの変更とマスコット蛙なアイゾメヤドクガエルのベジエ化、そしてページの3ペイン化(?)にそれが顕著に出ていることでしょう。

ヴォルフロ v.2からv.3の間に別件でサイトを2~3個作ったのですが、そこで得た知識や手法は色々活用しています。手抜きではないよ。還元還元。

ロゴは前はマニアッカーズデザインの "アストロ" っていうわりと癖のあるフォントを使っていたのですが、今回はなんとヒラギノ。ヒラギノなんですよこれ。インパクト的に弱すぎてサイトロゴには耐えられないかと思ったのですが、使ってみると意外とキレイにまとまった。もう、万能だな、ヒラギノ。

カエルは写真を元に地道にトレースしていったものです。泥臭い。カエルだけに(←いらない

デザインに関して、今まではわりとPhotoshopとかImageReadyとかラスター系がメインのソフトでサイトのパーツを作っていたのですが、このアイゾメヤドクだけではなく今回はほとんどIllustratorで仕上げてます。この辺はv.1をデザインしたころはOSがMac OS9で、現在はMac OS Xで作業をしているっていう差が結構大きいと思います。アンチエイリアス! IEがPNG-24のアルファチャンネルに対応してくれるともっとやりやすいのですが。

それぞれのコンテンツのページデザインを統一する。ちょっとどのコンテンツにいるか分かり辛いのかもしれないけど、揃えた方が良い、という判断から。多分正しい判断だろう。単純にメンテも楽だし。唯一困るとすれば私のコンテンツレイアウトに対する融通が利かなくなることくらいか。

h2(セクションタイトル)のボーダーが中途半端な長さなのはわざとです。尻切れとんぼな感じがいいかな、とか。

そしてサブカラムの存在。上のグローバルメニューが一番上の段階でサブカラムがページナビゲートというかカテゴリナビゲートというか。検索欄がサブカラム側にあるのは理論的にはおかしい気もするのだが、正直上にいい位置がなかった。カエルがいなければ右上に置くんだが……。

ヴォルフロはそこそこ小さくはないサイトなんで2段階あった方が分かりやすいかな、と。こういうナビゲーションは初めてやるんでどうも手慣れていないというか使いにくいかもしれないので、なんか使い辛いところがあったらフィードバック下さい。

v.3のデザイン起こし始めた当時サブカラムがグレーってのになんか憧れを感じててやったんですけど、こうやってみるとなんかblogみたいですね。PHPで吐いてるし。一応本文はテキストエディタで開いてXHTML打つっていう原始的な書き方なのですが。結果的にいかにも最近風なデザイン&レイアウトに仕上がってしまった気が……。いいのか? いいのか?

サブカラムのデザインはまだ釈然としていない部分もあるので時間があったらもう少し詰めたいです。

フォントサイズは今回13pxに固定してしまった。しかし、固定と言ってもIEではパーセントになるようにしているので、閲覧者がフォントサイズを変えられない、という問題はないだろう。しかしUA側のデフォルトサイズは受け入れられないので不親切と言ったら不親切。しかし、デザインとのバランスや読みやすさやブラウザの環境設定を見ない人の存在や色々考えた末この結論に至る。今時13pxは少し小さめかもしれないが、当分はこれでいく。気に入らないストリクタンの人はお得意のユーザCSSでなんとかしてくれ。

リキッドレイアウトは意地。リキッドじゃないのにアクセシビリティがどーだとかCSSレイアウトがどーだといか言うな、というぐらいで(別に言ってもいいと思うけど)。結局自分がリキッドじゃないと落ち着かないんだよねぇ。幅固定したらCSS組むのも画像使うのも5倍くらい楽になるの分かってるのに。

いやーまーいいんじゃないんですかねぇ。自分で言うのもなんだけど、良くなってると思ってます。一応現時点で出せるだけの力は出してます。

Comment

この記事へのコメント受付は終了しました。