CSSデザインレイアウトをオンラインで簡単に作成する （YAML）

WebコンテンツをCSSレイアウトで作成する場合、非常に便利なのが Yet Another Multicolumn Layout (YAML)。必要なレイアウトをドラッグで変更できるなど、直感的に目的のレイアウトを作成することができる。

レイアウトへのコンテンツ要素の追加も可能になっている。[+]add 部分をクリックするとツールバーからドラッグできるように編集状態になる。要素を追加するとデフォルトのテキストなどが挿入されるので、変更して目的の内容にする。

作成したコードの取得
徐々に慣れてきたら、作成したレイアウトコードを取得してみる。ツールの下の「Get Code」ボタンからHTML、CSS以外にもIE用のパッチコードを取得することができる。

CSMプラグイン
YAMLプロジェクトにはCMSプラグインもあり、すでにいくつかリリースされている。各CMSによって利用方法は異なるようなので、ためしに使っていただきたい。

CSSレイアウトを作成する場合、予想以上に時間がかかる場合がある。複雑なレイアウト構造を作成する必要がある場合、こうしたオンラインツールを活用することで効率を上げられる。出力されるコードも比較的すっきりとしているので、自分で修正を加える場合も問題ないだろう。