Smart Communication Design Company
ホーム > ナレッジ > Blog > Web標準Blog > 2005年5月 > css Zen Garden

Web標準Blog

Web標準Blogでは、Web標準の利用に興味のあるWebサイト管理者、Webデザイナーの方向けに、Web標準を利用するための手法やノウハウ、参考になるリソース等を、国内外を問わずご紹介します。

2005年5月24日

css Zen Garden

フロントエンド・エンジニア 木達

Web標準と長期的ROIのなかで、いったんWeb標準に準拠してしまえば、以後のリデザインは原則としてCSSの編集のみで完結できるということをご紹介しました。それを如実に実感させてくれるWebサイトとして、css Zen Gardenをご紹介します。英語サイトですが、書籍や雑誌等でも紹介されており、既にご存知の方も少なくないでしょう。コンテンツの一部は日本語(css Zen Garden:CSS デザインの美)でも読めます。

CSS Zen Gardenとは、同じXHTML文書に対して異なるCSSを適用することにより、いかに多様で優れたデザインが実現可能かをデモンストレーションするサイトです。世界中の数多くのWebデザイナーからデザインが寄せられており(数は少ないですが日本からの応募作品もあります)、その素晴らしいビジュアルや上手くCSSプロパティを適用した事例の数々には目を見張るものがあります。

弊社のWeb標準セミナーのなかで参加者の皆さんにご紹介しているデザイン例としてはDecoBonsai SkyRevealedWiggles the Wonderwormがあります。是非Mozilla FirefoxやOperaなどの、比較的最近の(CSS仕様により忠実な)Webブラウザでアクセスしていただきたいと思います。いずれのデザインも、制作者スタイルシートを無効化したり、あるいは直接XHTMLソースを眺めれば、同じ文書において見栄えだけを切り替えていることがおわかりになることでしょう。

もしかするとcss Zen Gardenを見ずとも、読み込むCSSファイルの変更だけで簡単に全ページをリニューアルできるということは、Blogを通じてご存知だったかもしれません。しかしcss Zen Gardenは、Blogの流行よりずっと早い時期からこのような試みを開始し、CSSが優れたデザインツールであることを多くの人々に示してきたという点において、その果たした役割は大きいと思います。