仕事&求人ジョブボード掲載、料金についてヘルプMOONGIFTについてヘルプTwitter(MOONGIFT)Facebook(MOONGIFT)新規登録ID/PWでログインTwitterでログインFacebookでログインマイページ現在のポイントポイント購入ログアウトITエンジニア/デザイナ向けにオープンソースを毎日紹介Bootstrapの善し悪し2014/01/30特集HTML5,BootstrapTwitterが開発したHTML5テンプレートBootstrapをMOONGIFTで紹介したのは2011年9月1日です。今ではバージョン3系となってさらなる進化を遂げていますが、それでもコンセプトは初期の頃から大きく変化はしていません。Bootstrapを使った、または一緒に使うソフトウェアも数多くリリースされており、それだけで開発者およびデザイナーの注目を集めたというのが容易にうかがい知れます。Bootstrapといえばこんな感じですよねMOONGIFTは2011年末に現在のデザインに変更しましたが、これはBootstrapをベースにしています。今でこそBootstrapベースのWebサイトは増えていますが、当時としてはかなり早い段階でBootstrapをカスタマイズして導入していたと思われます。そこでBootstrapベースにデザインを組む場合の利点、欠点を紹介します。利点1:追加要件に容易に対応できるWebデザインは一度決めたらそれ以後まったく機能追加をしない訳ではありません。運用していく中で新しい要件が出てくるものだと考えています。そのためスクラッチで組んでいると要件以上のデザインがなく、常に追加修正が発生してしまいます。それに対してBootstrapをベースにしておくと、ある程度まではBootstrapオリジナルのスタイルで対応が可能になります。利点2:全体のバランスが崩れないアイコンが特にそうですが、色々なところから拾ってきた素材を貼付けていると全体のバランスが崩れてしまいます。あるところには赤系、あるところは黄色系、そして別な場所はポップなデザイン...などとその時々に気分的に行っているとどんどんちぐはぐな印象になってしまうでしょう。Bootstrapを使っていて、その作法に則って進めている限りは全体のバランスは崩れづらいのが利点です。Awesomeのような代替アイコン集を使うのが良いでしょう。利点3:レスポンシブに正しく対応しているレスポンシブサイトを組む際に最も大事なのがグリッドです。デスクトップ、タブレット、スマートフォンといった3種類に対応しておけば良いと思われがちなレスポンシブWebデザインですが、実際にはそうではありません。幅指定に範囲があるように、どの幅に対しても適切な対応が求められます。シンプルな例でいうとスマートフォンを横向きにした時にデザインが崩れる、または適切な表示とは言いがたい状態になるサイトを見かけることがあります。Bootstrapは適切に計算されたグリッドレイアウトが実装されていますので、その部分だけでも使う価値があると感じています。欠点1:Bootstrap臭があるBootstrapのデザインは我が強く、Bootstrapを使っているなとすぐに感じられてしまいます。これを嫌うデザイナーはとても多いです。WEBデザイナーの憂鬱という記事を読み、グリッドだけ採用するというのはやはりありなのだと気付かされました。1.x系を使っているのですが、すでに本家は3.x系です。後方互換性はあまり考慮されていません...。多少なりともカスタマイズして導入している場合、単純な入れ替えは失敗するでしょう。古いものを使い続けると参考情報が減っていき、カスタマイズも容易ではなくなります。これはオープンソース・ソフトウェア全般に言えることですが、人気のあるソフトウェアは開発が活発で進化も速く、その結果使っているプログラマーはバージョンアップと互換性維持に大きなコストを払うようになるのです。言いつつもBootstrapは良いフレームワークです。海外ではBootstrapテーマの販売を行っていたり、関連ライブラリの開発も活発に行われています。Bootstrapという共通の枠組みの中であれば日本人であってもデザイン力、開発力で勝負できるのではないでしょうか。Bootstrap次はMOONGIFTの情報収集法について。:OSSコミュニティ進化論(小山哲志氏)2013年までの人気ソフトウェアまとめ特集HTML5,BootstrapMOONGIFTの関連記事${article.post_title}{{/each}}もっと見るコメントプレミアムでしか読めない記事が722あります。blockworks。