Kubeはプロフェッショナル向けのCSSフレームワークです。

見やすく、かつ様々なニーズに対して即座に答えられるようなデザインを考えるのはとても大変なことです。しかしその道のプロが作り出したスタイルシートフレームワークであるKubeを使えば実現しやすくなるかも知れません。


デモページです。リンクやサイドバーが並んでいます。


こちらはシンプルなベース表示。


iPhoneに対応。


全て一列になって表示されます。


タブレット向け。こちらも最適化されます。


横向きだとうまくいかず…残念。


こちらは表示例。Bootstrapのようなrowが使えます。


フォーム。


テーブル。


リンクの色変更も用意されています。


ボタン。

Kubeの特徴は優れたタイポグラフィ、グリッド表示、フォーム、テーブル、様々なクラスユーティリティ(.width-50とすれば半分になるなど)、ボタンなど最低限ながらも実用的なスタイルが定義されていることにあります。Kubeを導入し、さらに個々のWebサイトの要件を盛り込むのが良い使い方ではないでしょうか。

Kubeはスタイルシート製のソフトウェア(ソースコードは公開されていますがライセンスは独自(Free))です。

MOONGIFTはこう見る

ここ数年でスタイルシートのフレームワークが多数出揃ってきました。単なるTipsレベルではなく、導入した上で設定を個々のWebサイトに合わせて上書きしていくのがフレームワークの良さでしょう。デファクトと呼べる存在はまだなさそうですが、色々試してみるべきでしょう。

フレームワークを使えば各種Webブラウザのサポートはもちろん、後々のメンテナンスコストも低減されます。Bootstrapのレベルになるとかなり作り方の束縛が発生してしまいますが、ライトで最低限の設定を施してくれるものもあるはずです。

デモ:Demo

Kube CSS-framework for professional developers