BtoBなWeb開発雑記

エンタープライズ開発における今さら感あるフロントエンド系技術ブログ

第一回:とりあえずBootstrap3仕込んでそれっぽく

記念すべき第一回は、Bootstrapについて紹介しようかと思います。


そもそもBootstrapとは、Wikipediaによると

BootstrapはWebサイトやWebアプリケーションを作成するフリーソフトウェアツール集である。 タイポグラフィ、フォーム、ボタン、ナビゲーション、その他構成要素やJavaScript用拡張などがHTML及びCSSベースのデザインテンプレートとして用意されている。
GitHubで最も人気があり、アメリカ航空宇宙局MSNBCなどに採用されている。

Bootstrap - Wikipedia

とあります。


フリーのhtml/cssデザインテンプレートライブラリといえばそれまでなのですが、
これの便利なところは、

  • 標準のCSSクラスを仕込むだけでそれっぽいデザインになる。
  • jquery.js、bootstrap.css、bootstrap.jsだけ突っ込めばとりあえず使える。
  • MITライセンスのため、利用しやすい。
  • IE8くらいまでならそこそこ動く(最重要)

と、エンタープライズ開発(WEB)においては
非常にありがたい代物となっているわけです。


「画面デザインなんてWEBデザイナーに依頼して、開発側は取り込むだけの作業では?」
なんて声もあるかと思いますが、そこはエンタープライズ開発の悲しいところで、
WEBデザインに予算回してくれるような案件は残念ながら地方では少ないものです。
クラサバ全盛期はデザインなんてほぼなかったですし。
その癖、「あのサイトみたいな表示/動きにしろ」など無理難題を
押し付けられることも多々あります。


と、話が脱線してしまったため、Bootstrapの話に戻しますが、
いわゆるjspやaspx/cshtml等、動的テンプレートページくらいしか触ったことのない
サーバーサイド開発者にも多少はましなデザインを実現できる
素敵なライブラリかと思います。


特にBootstrap3はフラットデザインがベースのため、
非常にそれっぽくなることこの上ないです。
興味のある同業者は、ぜひ一度試してみてはいかがでしょうか?


【公式ページ】
getbootstrap.com

【日本語リファレンス】
bootstrap3.cyberlab.info



次回も引き続きBootstrapを使用例含め説明したいと思います。