ITエンジニア/デザイナ向けにオープンソースを毎日紹介

なぜデザインとYAMLが関係するのだろうと思ったが、ここでは「Yet Another Multicolumn Layout」の略らしい。つまりマルチカラムのデザインを容易に実現するためのCSSテンプレートということだ。


ピクチャ 36.png

整ったデザインが簡単に手に入るのはすばらしい!

 

Webプログラマの一番の悩みどころがデザインだ。特にCSSを使ってマルチカラムや入れ子になっているデザインは難しい。高さをそろえたり、メニューを横並びにしつつ、次の要素では違う表示など、複雑になればなるほど放棄したくなってくる。それがFirefox/IE/Safariなどのブラウザにも対応するとなれば尚更だ。そこで登場するのがYAMLだ。

今回紹介するフリーウェアはYAML、複雑なマルチカラムデザインテンプレートだ。

YAMLでは多数のサンプルが用意されている。単純な2または3カラムを基本として、グリッド化されてページの幅に応じて変化するもの、メニュー部分の幅は固定のもの、3カラムの他に複数カラムが混在しているもの、ダイナミックにレイアウトを変更するものもある。HTMLはXHTML validなものだ。


ピクチャ 35.png

あまりに複雑で自分で作れるような気がしない…

 

カラムの高さを統一したり、ページの最下部にフッターを表示するものなど、役立ちそうなものがたくさんある。さらにWebアプリケーションとして提供されているビルダーを使って、自分だけのデザインを生成することもできるようになっている。

開発はプログラミングばかりではなく、デザインも含めて行わなければならない。だが苦手な分野に手を入れるとどんどんやる気が失せてしまう。YAMLのようなテンプレートを使って、なるだけ楽に、しかし高品質なデザインを実装しよう。


ピクチャ 31.png

グリッドに対応して自在にレイアウトが変化する

 


ピクチャ 38.png

WebベースでデザインするYAML Builder

 

Home: Yet Another Multicolumn Layout | An (X)HTML/CSS Framework

 http://www.yaml.de/

YAML Builder | A tool for visual development of YAML based CSS layouts

 http://builder.yaml.de/

 

MOONGIFTの関連記事

コメント

  • MOONGIFTプレミアム
  • Mobile Touch