ずっとオチしつづけているサイトの一つzengarden。いわゆるCSS+XHTMLのデザインサンプル集。その数膨大。世界中のデザイナーが我こそはと、みんなその辣腕を披露。最近のなかからほんの一部をピックアップ。ちなみに好みのデザインで選んでいません。個人的な好みはチト違うので。
世界には、こんなサイトがゴロゴロあって、その中の一つを紹介。実在のサイトを評価しているサイトで、"stylegala.com"。世界中のCSS+XHTMLのサイトを紹介して、みんなでポイントをつけている評価サイト。ちなみに、このサイト自体も手の込んだつくりこみかと。一見テキスト主体のサイトに、アクセントをつけて(イメージのアクセントじゃない)、「読ませるテキスト」と「見せたい画像」を分離している。
構造と表現の分離。「構造」は、XHTMLのマークアップを適切に意味づけしていき、「読ませるテキスト」を配置。例えると"論文"かな。「表現」は、CSSで見せるべき画像やアクセントに使うアイコン、その他をコントロール。ブラウザの設定で、CSSをはずしてみると、「なーるほど」って感じ。
ただね、CSS2.0までは段組が弱い。正直言って段組を制御するのは一苦労。テーブルみたいに、段組のなかに段組を作るのも、DWやGLでチョチョッとマウスを動かして、3分でハイできあがり!なんてわけには到底いかないんだよね。
だから、どうしてもサイト全体が縦長になっちゃう。それと、ディスプレイの解像度が1024がスタンダードになってきても、「表現」のバランス上、細長いものが比較的多い。それを嫌ってリキッドデザインにするんだけど、これも帯に短したすきに長し。
stylegalaが紹介しているなかで度肝をぬかれたサイトが、ここ。初めてアクセスしたとき、あっけにとられた。ボーゼン。
イラスト、配色、配置、マジックセブン、どの要素もすばらしい。世界はひろすぎる(笑)
このあたりの話は、もっと書きたいんだけど、クライアントや訪問者の方々に変な誤解を与えては本末転倒なので、もっと僕自身が勉強してから、本質論へと昇華させてみたいな、いずれ。
まぁ、とにかく、「読ませるテキスト」と「見せるべき画像」のデザイニング(きらびやかなって感じの意味じゃなく)の妙。そして、OSに依存しないし、どのブラウザからでも閲覧できる。HTMLを解釈できる端末なら、ケータイ・PDA・PSPと何でもOK。これがWeb2.0の世界(のほんの一部)。ここに、音声と映像がアドオンされちゃう。スゲエなぁ。