作業ノート

様々なまとめ、雑感など

社内用ツールとBootstrap

仕事で時々、社内用のツールを作る。目的は様々。 ここ最近も作ったのだが、作り始めた頃にBootstrap3のRCが出た。

せっかくなので、Bootstrap2を試したが、思った以上に使いやすく、そして効果的だった。(3はRCだったので見送った)

社内用なのでページの見栄えにこだわる必要はない。しかし、最低限の機能的なデザインは必要。 例えば、処理完了時の通知メッセージの表示。色や通知場所、通知方法など。

そのための設計と実装が必要で、HTML、CSS、JavaScriptを書くことになる。 今回その労力がBootstrapによってかなり軽減された。

必要な機能をすべて作り上げた後、本家のドキュメントを見ながらスタイルを段階的に適用。

対象は、

  • ページレイアウト
  • 通知メッセージの文字色、背景色
  • 入力フォーム
  • 一覧・詳細表示のためのテーブル

など。これらに必要なタグを追加し、該当するCSSのclassを適用した。

今回作った範囲では、全てのデザインをBootstrapでまかなった。JavaScriptでの機能実装ではjQueryを使用した。

今までは自分でCSSを書いて各ページに適用していたが、全体のレイアウト、ページへの適用方法などを考えること、 それらを共通化して利用することに毎回手間取っていた。 今回はBootstrapによって、そういう手間がほとんどなくなったのが大きかった。

一般的なサイトでは、Bootsrapの適用で結果的に似たり寄ったりのサイトになってしまい、そのことを気にする人もいるそうだが、 社内用ならその点を気にする必要はない。場合によっては、デザインの統一感がメリットになるのではないか。

ただ気になるとしたらIEでの表示。これはIE側の問題によるところが多いので、Bootstrapは全然悪くないのだが。