Webサイト制作におけるBootstrapを使うことのメリットが感じられないのです。

Question

この度、転職先でBootstrapをレイアウトの例えばカラム作りなどで使うので覚えてくださいと言われ、本日手をつけ出しました。しかしながら、Bootstrapのメリットがあまりにも感じられなくて、どうしよう...メリットを感じられると思ったのに感じられない私、やばいかも..??と思って居ても立っても居られないなく、質門させていただくことにしました。

メリットを感じられない理由
１. レイアウトの枠作り(グリット)にcol-sm-3とかできるのは確かに便利かもしれない。でも、flexboxを普通にcssで今まで使用していたので、メリットがいまいちわからない。
→先輩から「あたなは今までゼロベースで作ってきた人でできてるから、Bootstrapにすぐ慣れるしすぐ良さが分かると思うよ」と言われたんですが、
あえてBootstrapで枠を作るのが果たして効率がいい方法なのか、手を動かすほど疑問に思ってしまった今日でした。

2.　クラス名にtext-centerとかは確かに便利だけど、クラス名に何でもかんでも指定する感じが慣れないだけなのか、
なんかすっと入ってこない。

3.　Bootstrapにバージョンアップがあったらまたあーだこーだ対処しなければならないんですよね？なんて思うと、敢えてBootstrapで枠レイアウトを作ることの必要性が見えてこない。

1. bootstrap.min.cssを読み込んで、その後で、common.css、pc.css、sp.cssを読み込み、bootstrap.min.cssは手をつけないでって言われているんですが、こんなにもcssを分割するメリットは何でしょうか。

pc.cssの中にもメディアクエリのブレイクポイントが5個くらいあって、もうよくわからなくて。cssをいくつも開いてブラウザで該当箇所を調べて、そのcssの箇所をみて、、みたいな。cssを分割で作るメリットはどういう所にあるのでしょうか。

すみません、そういうもんだよ！とか、いや無理にBootstrapは使う必要はないよ！とか、俺は使わない派とか、なんでも構わないので、Webサイト制作に携わっていらっしゃる方々のbootstrapの見解や使用方法をお尋ねしたく、質問させていただきます。
よろしくお願いいたします。

Answer 1

bootstrap.min.cssとは別にsp.cssとか使ってるならその人達も初心者なので気にしなくていい。

bootstrapはUI部品の集まり。
PCアプリ作るならOS標準のUI部品を組み合わせて作る。これと同じ感覚。
bootstrap=webの標準UI。

標準ということは誰が使っても使い方が同じ。共通なことが最大のメリット。

自分でCSS書いて自分で使ってるだけだと分からないけど他人のCSSは死ぬほど使いにくい。
他人のめちゃくちゃなCSSに散々苦労してきた結果もうCSSなんか書くなとなった。
JavaScriptでさえ進化した現代ではCSSが一番難易度高い。
初心者ほどCSSは簡単と思ってるけど上級者になるほどCSSは書きたくないと思うようになる。

Answer 2

Bootstrapの、特に段組み部分の構築の仕組みは、
正直どんなレイアウトでも自由にCSSで組めるスキルを持った人からしたら
まどろっこしく、自由度も少なく、無駄に複雑で、HTMLも冗長になるため
デメリットでしかないように感じられると思います。
正直、私もそうです。一言で言って「('A`)ﾏﾝﾄﾞｸｾ」　です。

CSSフレームワークは誰が使うか、どんなものを作るのかが限定されていないので
可能な限り誰でも、それなりの自由度で、いろいろな場面で使えるように設計されています。
様々な場面を想定してカスタムできるようにしてあるので、自然と「無駄」も多くなってしまいます。
自由に思い通りのレイアウトを自分でCSSを書いて組み上げられる人間からしたら、
この「無駄」が気持ち悪くて仕方ないという感覚は、正常なことだと思います。

ただ、制作物から属人性を排除し、チームで永続的に一定のクオリティの制作物を作り続けるために、
ある程度の「無駄」を許容してでも、統一したルールと堅牢性を持ったCSSフレームワークを利用するということには
十分なメリットがあると言えると思います。
この場合のCSSフレームワークとは何もBootstrapに限るものではありません。
他のCSSフレームワークでも良いし、自作のCSSフレームワークでも構いません。
ただチームで制作する以上、統一したルールは多かれ少なかれ必ず必要で、
御社ではそのフレームワークにBootstrapを採用している、というだけの話です。

制作会社の中にはBootstrapは採用していないところも多くあり、
その場合しっかりしたところであれば独自のCSSフレームワークを用意したり、
かなり厳密なコーディング規約とテンプレートを用意していたり、
できるだけ統一したクオリティを担保できるように何らかの統一ルールを用意しています。

当面はBootstrapのお作法に慣れるように頑張るしか無いと思いますが、
もしどうしても「こんなのは非効率だ！」と思うなら、
会社のメンバーを納得させられるだけの新たなルールを考えて、全社に浸透させるように
啓蒙活動をするしかないと思います。

実際問題Bootstrapのメリットが最大限生かされるのは、
システムの管理画面のようなシステマティックな画面構成を主とするサイトや、
最初からBootstrap向けにデザイン・設計されたWebサイトになりますので、
毎回Bootstrapと関係なく自由にデザインされたデザインカンプを一から構築するのが主であるような
受託制作の現場なのであれば、Bootstrapを無理に使うよりシンプルな独自CSSフレームワークを用意して
そこから各案件ごとにカスタマイズしたほうが工数もかからないしクオリティも高いものになる可能性は
十分にありますしね。

Bootstrapは使わない一人コーディング現場からは以上です。

P.S.
ちなみに以前Web制作に関わる人にアンケートを取ったところ、
Bootstrap使う派・使わない派はだいたい半々くらいで、
CSSに習熟している人ほど使わない傾向が高いという結果が出ていました。
（熟練者の中で使っているのは2〜3割くらい）

Answer 3

メリット

特に会社で使うメリットとしては統一されたHTMLを量産ができることかなと思います。誰が作っても大体同じコードになるので、管理の面でCSSフレームワークは優れているかと思います。他人がゼロベースで書いたコードなどは理解するのに時間がかかったりしますし、統一させようと思ってもなかなかうまくいきません。会社ですから特定の人じゃないと...みたいな仕事はなるべく減らしたいでしょうしね（急に人が辞めたりもしますし）。

またゼロベースで作っているとありがちな、このブラウザやverなどで挙動が違うなどということはCSSフレームワークを使っているとほとんどありません。こういった点も会社で管理している以上大きなメリットだと思います。

コーディングスピードも上がりますしね。またデザインが整っている点も馬鹿にできないかと思います。

CSS分割について

これに関しては管理の問題かと思います。ページの表示速度などを考えるとCSSを読み込む数は少ないほうが好ましいですが、チームのルールとしてそうしているのかと思います。ブレイクポイントの数もある程度どの案件にも対応できるように5つと決めているんでしょうね。