SassやCompassを使っていて、最近あまりCSSを直接書くという機会は減りましたが、CSSを書くという目的自体は変わらない！ということで、CSSの書き方云々ではなく、設計についての書籍が出たということでKindle版を購入してみました。
と、いうわけで、発売日に斜め読みした感想をまとめてみました。

 

やっぱり設計ですよね


﹁ヒャッホー！これCSSだけで実装できたぜー！﹂みたいな脳汁あふれるCSSコーディングは確かに楽しいのですが、やっぱり設計がきちんとしていないとですね・・・。という問題は様々な場所で出てくるかと思います。
似たような記述が散見されたり、わけがわからないおかげで後々の更新で﹁!important﹂を乱発する羽目になったり・・・。
せめて自分でコーディングする場合だけでも綺麗にしておきたいのです。
 

本書におけるCSS設計の目的



●予測しやすい
●再利用しやすい
●保守しやすい
●拡張しやすい

の4つを目的として、CSSを書くために、どうすればいいかということが軸になっています。
わかりやすい方法論を通して、ウォーターフォール型ではなく、アジャイル型のWEBサイト構築のワークフローになりつつある中で、どんな設計をすれば良いのか、ということを提案しているのです。
 

プログラミングと違ってスコープが存在しないCSSを、どう書くか


基本的には、より安全でシンプルなセレクタを用いて、コンポーネント設計を行い、既存のCSSフレームワークから学ぶものは踏襲しつつ、運用フェーズまで考えた上で書く。
ざっとまとめるとこんな感じです。
最終的には、SASSなどのCSSプリプロセッサ言語を使ったイマドキな開発での開発と運用、Web Componentsの可能性として、

●Templates
●Custom Elements
●Shadow DOM
●HTML Imports

を利用したマークアップ方法まで解説されています。
 

綺麗で読みやすいコードは、CSSに限らず永遠のテーマですよね


DRY︵Don’t Repeat Yourself︶なコードとか言われても、ピンとこない人。
制作フェーズより、運用フェーズで泣かされている人。
ただただCSSを綺麗に書きたい人。︵綺麗の基準は人それぞれですが・・・︶
こんな感じの人にはおすすめできる内容だと思います。
CSSの小手先のテクニックなどが載っているわけではないので、こんなことができれば！！！というよりも、ワークフローを考えるディレクション担当者︵というかプレイングマネージャー的な立場の人︶が読むべき本かなあという気がしました。
Sassもmixinとextend地獄に陥りがちな人が、安易にBootstrapのテーマなどにいかず、スクラッチでもCSSを綺麗に書けるためのコツが決して多くないページ数にきっちりまとまっていました。
お陰で、次のプロジェクトからもう少し綺麗に書けそうな気がする・・・。