Fresopiya
場所にもお金にも時間にも、何にも縛られない自由な状態になったら一体人間は何をしてどこに向かうのか。

まずはとにかく自由を目指すエンジニアのブログです。
「哲学」と「プログラミング」と「政治経済」、「ブログ」がメインになるかと。
Bootstrap

【Bootstrap】Bootstrapとは?メリット・デメリット

どうも、とがみんです。

Webサイトを制作する際に、Bootstrapというものを作成したことはあるでしょうか。

CSSでWebページの見栄えを整えたりするかと思いますが、

この記事では、それを圧倒的に効率化するためのBootstrapについて紹介します。

Bootstrapとは?

「Bootstrap」とは、Twitter社が開発したCSSのフレームワークで、これを利用すれば、簡単に整ったデザインのページを作成することができます。

通常は全てのスタイルを自分で作っていく必要がありますが、Bootstrapにはあらかじめ様々なスタイルが用意されているので、ルールに沿って利用するだけで、整ったデザインのページを作成することができます。


Bootstrapで具体的に何ができるのか

Bootstrapを使用すれば、様々なデザインを簡単に実装することができます。以下にいくつか例を紹介します。

グリッドシステム

グリッドシステムは、レイアウトを格子状に分割して配置するデザイン手法で、ブラウザの表示サイズに合わせて、そのデザインを変更することができます。

ナビゲーションバー

以下のようなナビゲーションバーが簡単に作成できます。

スライドショー

スライドショーも簡単に作成できます。

その他

他にも、階層リンクナビゲーション、ダイアログボックス、ボタン、テーブル、フォーム、アラート等様々なものが用意されています。

Bootstrapのドキュメントにたくさんまとめられています。

>Document|Bootstrap

また、以下のYouTubeの動画は、Bootstrapを利用して作られたサイトです。

Bootstrapを利用するメリット・デメリット

メリット

簡単に綺麗なページを作成することができる。

Webだけでなく、スマホにも対応したデザインを簡単に作成することができる。

デザインに疎くても、それなりのデザインを

デザインとコーディングの工数を短縮することができる。

デメリット

Bootstrapの記法を習得する必要がある。

デザインが画一的になりがち。

まとめ

Bootstrapについて紹介しました。便利なものがたくさん用意されているので、うまく使っていきたいですね(笑)。

個人的にグリッドシステムが最高。

参考文献

>Document|Bootstrap

現役クリエイターによる直接指導!Webクリエイタースクール【デジタルハリウッド STUDIO by LIG】