一期一会 株式会社webtech 執行役員 川邊英之の公式ブログ

株式会社webtechのべーやんこと川邊英之が日々の想いを綴る公式ブログ

Bootstrap

EC-CUBEも採用したBootstrapってそもそも何者?

昨日書いたエントリでも少し触れたのですが、Bootstrapのお話を少々。
先に述べさせて頂きますと、私このBootstrap嫌いです(笑)。
ただ、今後CSSのフレームワークにおいて、標準化されるかもしれません。っていうか一部では、標準化の動きがあり、EC-CUBEのように採用されていたりします。

元々このBootstrapを作ったのは、みなさんご存知のTwitter。なので、昔はTwitter Bootstrapと呼ばれていた事もあります。
では、そもそもBootstrapを使う事でどういう利点があるのか。簡単に説明させて頂きます。

Bootstrapは、現在主流になっているレスポンシブWebデザインに対応しており、グリッドシステムを定義してくれているので、そのまま対応したclass名をHTMLに使用すれば、動いてくれるという便利なものです。
具体的に言いますと、グリッドシステムとは、横幅全体を12にまたは24に分割。どちらかに分割した場合、全体を100として、それを何分割させるかって感じに区分けします。
簡単な図にしたみましたので、これを見ていただいた方がわかりやすいかもしれません。

col1
col1
col1
col1
col1
col1
col1
col1
col1
col1
col1
col1
col8
col4
col4
col4
col4

こういう風に見ていただければお解り頂けたのでしょうか?
デザインを構築する上で、ちゃんと理論的に組み上げてもらえれば、かなり使えるのですが、そうでないデザインが採用された場合、微調整が必要になるので、それが非常に面倒。この場合、確かに考え方とすればそんな微調整が必要なデザインを作成する方が悪いんですけどね(笑)。

最初に述べましたが、私このBootstrapが嫌いですと。ただ、便利なフレームワークである事には違いはありません。要は慣れですね。
これがこれからのコーディングにおいての標準化になるのであれば、私も嫌いだとか言っている場合ではないので、使いこなせるように頑張ります(笑)。
この業界は、常に進化しているので、頑張っていきます(汗)

NEWS

政治経済芸能など様々な時事ネタを取り上げたカテゴリ

記事一覧

WEB

webtechが制作したホームページや制作時に苦労した内容を記述するカテゴリ

記事一覧

FASHION

実際に自分が購入したアイテムや注目しているアイテムを紹介するカテゴリ

記事一覧

NOTES

プライベートな内容を雑記的に記述したカテゴリ

記事一覧