色々とページを作っていると、たまには違うレイアウトにしょうか。
と思うこともしばしば。 しかしWebデザイナーではない人は
毎日レイアウトのことばかり考えるわけにもいきません。
さくっと何かかわったレイアウトはないかな？
CSS書くのは楽しいけど、はまると時間かかっちゃうしなぁ。
なんてお考えの貴方。
こちらのサイトでレイアウトのインスピレーションを得ちゃいましょう。
ついでにXHMLのコードとCSSをいただけちゃいますよ！
YUI CSS Grid Builder
ヤフー・ユーザー・インターフェース CSSグリッド・ビルダー左にあるメニューをちょちょいといじると、右側にレイアウトが
表示されます。ヘッダーとフッターも入れられます。
CSSボタンをおすとあら簡単。 CSSのコードが表示されます。
YUIのページはこちら
Layout Iron Myers
http://layouts.ironmyers.com/こちらは下の写真に有るように、あらかじめ56種類のレイアウトが整列しています。
それぞれのレイアウトの下にラジオボタンがあります。
一番上が幅100%リキッドレイアウト。Fluid （流動体）とあります。
他には974ピクセルのリキッドレイアウト、950ピクセル、750ピクセル
と続きます。実はこの56種類の中にはあまり気に入ったのはないのですが
シンプルなレイアウトを何も考えずに使いたいときに利用しています。
Layout GALA
http://blog.html.it/layoutgala/全39種類の中から好きなレイアウトをクリックすると、サンプルページが
次に現れ、すぐにコードをダウンロードできる仕組み。
個人的にはここのレイアウトは好みのものが多いです。
たぶんコンテンツ部分を2段にしたかったりだとおもうのですが。
とはいえ、そのままコードを使ったこと無いです。
かなり前から存在するサイトで、他のがジェねレートしているのに
比べるとここは決めうちですから、CSSジェネレイターではないです。
正確には。
CSS Creator
http://csscreator.com/tools/layoutこれはCSSジェネレイターです。
ドキュメントタイプもHTMLからXHTML Strictまで選択でき、
また3つの単位(px,em,%)でカラムの値を指定してレイアウトしていきます。
縦に2列などはできませんが、普通の横3段組まで可能です。
バックグラウンドカラーもその場で選べるので雰囲気をあれこれ
見ておいて、他でそのレイアウトを選択すって言うのもありかも
しれません。 ちなみに値をいれると右に小さなレイアウト
が表示されますが、Hightの値が今ひとつ反映されていない気も。
ま、たぶん気のせいです。
mitchbryson
http://mitchbryson.com/free-css-templatesここはシンプルです。 敢えてレイアウトの中から選びたい。
そんな気にしてくれるサイトです。
Nice and Free CSS Templates
http://www.mycelly.com/ここもシンプルです。 レイアウトはたった12種類しか
ないのですが、中ほどのメニューをフローとさせたものと
下の段のBOXをページ中央におくレイアウトがおもしろいです。
普段かわったページを作ること無いので、こういうところをみると
ああ。なるほど。 となります。
