CSSフレームワークと出会った(ホムつく)

テキスト文書を簡単に書き起こしたり編集し、なおかつある程度の見栄えでWebページを生成するという、「こうじのがく書庫」に必要な要件はWikiの採用で解決しました。 しかし、Webアプリケーションを作るときには、CSSと戦うことになりました。

古い人と新しい人

プログラミングと再会した僕はPHPを使ってWebアプリケーションを作っていました。 CSSを覚えた事は絶大な効果がありましたが、それにも拘わらずWebページをデザインするのは大変です。 僕にはやはり美的センスがありません。

Webのない頃からプログラマーだった僕がデザインセンスに失望した時代がありましたが、それから長い年月が経ち、しばらくプログラムからなれて再びプログラミングと出会った現在、状況は変わってきました。

CSSというWebページの見栄えを制御する仕組みが、体系的に整備され、さらにはフロントエンドエンジニアなる人たちが増えてプログラマーがWebページ側に進出してきています。 この新しい人たちによってGoogle,Facebook,Twitterなどの優れたWebユーザーインターフェースが作られています。

CSSフレームワークの登場

フロントエンドエンジニアはCSSやJavascriptを駆使して、見栄えと使い勝手の良いユーザーインターフェースを開発する人たちです。 しかし彼らは、自分たちの為にユーザーインターフェースを作るだけではなく、みんなのためにCSSフレームワークなる物を作ってくれました。 そのお陰で美的センスのない人間でもある程度見栄えのするWebページを、ある程度簡単に作れるようになりました。

CSSフレームワークとは

  • Webページのデザインの作法を体系的に決めてしまう(何でもありを許さない)
  • 作法にのっとっていれば、整ったデザインが自ずと実現できる
  • 直書きでは大変な表現を簡素に記述できる -　統一感のある部品がたくさん用意されている
  • 画面のサイズが違っても自動的に辻褄が合うようにしてくれる(または簡単に設定できる)
    • ※レスポンシブWebデザインっていいます

ざくっとこんなところです。

Bootstrap

僕が最初に使い始めたCSSフレームワークはTwitter社が公開しているBootstrapです。 その他たくさんあります。

挙げたら限がないのですが、実際に僕が使い物になると思ったのは、”Bootstrap”と”Foundation”で、実際にこの2つだけを使っています。

フレームワーク敬遠の風潮

フロントエンドエンジニアの方々にとってはこんなフレームワークに縛られない方がずっと楽だと感じるでしょう。

CSSフレームワークで作ったWebページはどれも同じようでダサいとか、Bootstrapはありきたりすぎていやだという話も良く見かけます。 みんな自分で出来てるんでしょうか? 僕は自力でデザインできないから頼るしかないのですが。

一方で未だにフレームワークの存在を知らないかまたは理解できず、野暮ったいWebページをしこしこ作っている人たちがいるのも現実です。 美術の知識を持ったWebデザイナーさんたちは当然フレームワークなんて使わず見事なWebページデザインを出してきます。 プロがやる仕事のやり方が正しいと思ってしまうのは仕方がありませんが、自分がプロのようには出来ない事も学ぶべきだと思います。

またデザインをプロに外注して、そのHTMLとCSSを加工しながらWebアプリケーションに組み込むとなれば、CSSフレームワークの登場する余地はありません。 プログラムをまったく考慮していないデザインをプログラムに当てはめるのって地獄の作業なんですよね。やらざるを得ないからやりますが(笑)

そして別のページも似たデザインで作ってくれと言われたって出来るわけないでしょ! プログラマーが突っ返したから、仕方なく自前で作ったって、むちゃくちゃな物が出来上がります。 ほんの少しの修正でもちゃんとデザイナーさんに高いお金を払って作ってもらうしかないんだと理解してほしいなぁ。