Web制作者のためのCSS設計の教科書 モダンWeb開発に欠かせない「修正しやすいCSS」の設計手法

著者 : 谷拓樹

• インプレス (2014年7月24日発売)

作品紹介・あらすじ

予測しやすい、保守しやすい、最利用しやすい、拡張しやすい-コンポーネントやCSSプリプロセッサを意識した設計・管理の実践など、「ちゃんとCSSを書く」ためのプロの考え方を徹底解説!

感想・レビュー・書評

[parsecmonkeyさんの感想 · 2021年6月21日]

CSSを書く際に活かせる情報満載です。
次からは、きっと見やすいコードが書けるはず......

[hatsuさんの感想 · 2020年2月28日]

CSS設計の基本となる考え方について勉強できたのでよかった。
以下のような事柄について書かれている。
### 良いCSS設計の特性
- 予測しやすい
- 再利用しやすい
- 保守しやすい
- 拡張しやすい
の特性を持つこと。

### 破綻しやすいCSS
- HTMLの構造に依存している
- article h1 { color: red; }とか。
- スタイルを取り消している
- 一度定義したルールを `0`や `none` などでリセットしているとか
- 絶対値を多用している

詳細度
1. !important
2. インライン記述(style属性)
3. IDセレクタ
4. クラスセレクタ・属性セレクタ・擬似クラス
5. 要素セレクタ・擬似要素
6. ユニバーサル・セレクタ

コンポーネント設計のアイデア
- OOCSS(Object Oriented CSS)
- SMACSS(Scalable and Modular Architecture For CSS)
- BEM(Block, Element, Modifier=変更)
- FLOCSS(フロックス)

[よーへいさんの感想 · 2019年4月29日]

CSSを触ることがある人は必読。今後自分でサービスを作るにしても、組織にジョインするにしても、それぞれ何かしらこの本で紹介されているCSS設計がベースになっているはず。OOCSSはどの設計においてもベースになっているし、BEMに関しては命名規則としてその地位を築いている。多少の違いはあれど、基礎は押さえておくべき。この本はその紹介をわかりやすくしており、理解しやすい。CSS初学者よりも、毎日CSSを書くベテランの人こそ目を通しておくべきである。書かれた当時はそうではなかったが、Ch7のWebコンポーネントに関しては、すでに実現されているので軽く流すくらいで良いだろう。Ch3が肝である

[tonyfactoryさんの感想 · 2015年3月10日]

CSSを実装するにあたって、いくつかの方法論を学ぶ上で非常に役に立った。ある程度、HTML、CSS、Javascriptを書けるようになったら、読んでおくと、変なCSS書かずに済むので、オススメ。

個人的にサーバーサイドやる人がたまにフロント触る羽目になった時に読んでおくとすごい捗ると思う。

[1000chさんの感想 · 2014年10月17日]

大規模Webサイトの運用に耐えるCSS、ハイパフォーマンスなCSSを目指すのであれば必読書。

[ミズゴロウさんの感想 · 2022年1月24日]

CSS設計について、調べても断片的知識しか得られていない感覚があったため、体系的に学習したく購入。様々な設計方、設計に係る考え方が非常にわかりやすく学習出来ました。
Sassのファイル設計についても学習したいので、別の著書も購入しようと思います。

[めちゃくちゃゆかさんの感想 · 2022年1月19日]

詳細度やBEMなどしれてよかった

[50keiさんの感想 · 2020年11月21日]

web作成を趣味としているが、cssがどうしても冗長化したり、スパゲティになってしまうことが多々あった。この本は、そんな悩みに指針を与えてくれる。cssをある程度使っていて、キレイなコードを書きたい人にオススメの本。

[usausa01さんの感想 · 2020年9月25日]

ツイッターでフォローしている方が読んでいたので読んだ。　

何度も読み返し。インデックスから

css書いている人は読んだほうがいいと思う。

>直下に書く。

フロントエンドのことも載っていた。

[yondayo2020さんの感想 · 2020年2月12日]

今までなんとなくで書いていたFLOCSSについての理解を深めることができた。

3回同じパターンが来たらコンポーネントを考えるを基準にCSSの設計をしていこうと思う。

CSSガイドラインを作る時にとても役に立つ知識
繰り返し読む