PengNote

勉強した事や行った場所の感想を書くブログ

Web製作者のためのCSS設計の教科書を読みました

CSSの設計に関してはずっと悩んでいたのですが、どうやれば良いかがよく分かる。そんな本でした。

メンテナンス性をどうやってあげるか

この本では、全体を通して書かれていることであり、この本を読むまでの僕の抱える疑問でした。

何かサイトを作るたびにこの辺もう少しうまく書けないかとかか、修正する度になんかごちゃごちゃしてくるCSS。この本にはそういったことを回避するための考え方がたくさん載っていました。

内容

この本の話はより良いCSSってなんだから始まり、じゃあその為にコンポーネント設計ができるよねってことが3章〜4章。5章ではそれをSassを使った場合どんな風にできるかをマルチクラスとシングルクラスの二種類で解説。6章ではCSSのコメントはどう使うのが良いのかなどスタイルガイドに関する事が書かれていました。

個人的には3〜5章がとても良かった

3章ではOOCSSやSMACCS、BEM、MCSSなどのアイデアについて説明されており、分かりやすくとてもいい刺激になりました。

OOCSSやSMACSSあたりはなるほど!と思えたのですが、BEMあたりからちょっと混ざってきて混乱することも… また読み直したい章です。

スタイルガイド

更にそのアイデアを使ってコンポーネントをどう作るかについて書かれているのが4章で、こういうルールを使うといいよというものからよく使うパーツの作り方など実践的な内容でより理解が深まりました。

Sassでの設計について

これまではプリプロセッサを使わない場合でしたが、5章ではSassを使った場合どんな風に創ることができるかという内容で、マルチクラスとシングルクラスでの設計について書かれていました。

個人的にはシングルクラス派かな?

読んだあとで

読んだ後は色んな方々が「CSS書き直したくなった!」と言っているのをTwitterで見かけていたんですが、実際僕も書き直したくなりました。

きっと誰もが良いCSS設計をするヒントを得られる本だと思います。CSSに触れる方はぜひ。