ドットインストール学習日記:Twitter Bootstrap (v1.3)
今日のドットインストール学習記録。
Twitter Bootstrap version 2 が出たらしいので、使い方を覚えておこうかな、と。
明らかに出遅れてるけど version 1.3で練習だ!
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css" />
こうやってスタイルシートを指定してあげるだけで今風のデザインが使えるんだからすごい。
ちょこっとさわってみた感想
Twitter Bootstrap を使うと、とりあえずそれっぽい整ったデザインができるだけじゃなく、
"こういう用途には こういう色を使ってね"
みたいな指針(?)に沿ってデザインできるから統一感が生まれる。
例:ラベル(label)に付けたいろいろなクラス
クラス | 意味 | 色 |
---|---|---|
success | 成功 | 緑 |
warning | 注意 | オレンジ |
important | 重要 | 赤 |
notice | 通知 | 水色 |
これひとつとっても、用途と色の関連付けがしっかりされている。
ただ色をつけるだけじゃなく、直感的に意味が伝わるように、色が与える印象を意識してる。
伝わるデザイン・心地よいUI
それを作るのって大変だけど大切な事。
もっとデザインセンスと技術を磨かなければ。