出版社内容情報
CSS設計は多くの現場で導入されていますが、いまだに悩みがつきません。プロジェクトの大小や性質によって最適解も変わってきます。
そこで本書は、CSSのさまざまな設計手法を紹介しつつ、考え方や実践のポイントを明確化します。そのうえでボタン、ラベル、カード、テーブル…といったウェブの定番的なモジュールを網羅的に取り上げ、さらにはそれらの組み合わせ方まで、実践的なコードを紹介します。
代表的な設計手法である「BEM」と、著者が開発した設計手法「PRECSS」によって対比的な解説を加えており、思考をなぞることで最適解が炙り出されることでしょう。
駆け出しのウェブ開発者、フロントエンドエンジニアの方に、ぜひ読んでいただきたい1冊です。
内容説明
SMACSS、BEM、PRECSSなどさまざまな手法の考え方がわかる。ボタン、ラベル、カード、テーブル…実例コードを多数掲載。CSSの理解を深め、8つのポイントで設計!
目次
CSSの歴史と問題点
CSS設計の基本と実践
さまざまな設計手法
レイアウトの設計
CSS設計モジュール集(最小モジュール;複合モジュール;モジュールの再利用)
CSS設計をより活かすためのスタイルガイド
CSS開発に役立つその他の技術
著者等紹介
半田惇志[ハンダアツシ]
株式会社24‐7/テクニカルディレクター・株式会社パンセ/シニアエンジニア(本データはこの書籍が刊行された当時に掲載されていたものです)
※書籍に掲載されている著者及び編者、訳者、監修者、イラストレーターなどの紹介情報です。
感想・レビュー
※以下の感想・レビューは、株式会社ブックウォーカーの提供する「読書メーター」によるものです。
たいそ
6
2020年。自分はWeb屋さんではないが、HTML5でちょっとWebアプリを作ることがある。CSSも少しずつ使うようになったが、いきあたりばったりで右に寄せたり、空白を広げたりしているので後でわけがわからなくなりがちだった。この本でセレクタをどう指定するかとか、命名ルールとか知ることができた。classを複数指定できるの知らなかった。「来るべき日のために、小さなプロジェクトからでも中規模以上のWebサイトを意識してCSS設計を練習しておきましょう」「CSS設計のやり過ぎがちょうどいい」くらい。2020/08/01
mopinfish
1
特に「Chapter 6 CSSモジュール集②」がサンプルとしてとても参考になります。ここ最近業務でフロントのコーディングする機会が多いので度々参考にさせていただいてます。BEMやPRECSSといったいくつか流儀があるCSS設計方針も最初に丁寧に解説されており、サンプルコードもBEMとPRECSSの両方で書かれていて、それぞれの違いも具体的に説明されている。完全ガイドという名の通り、諸学者が中級者にレベルアップするための良いガイド本という感想を持ちました。。2023/05/15
yyhhyy
1
メジャーなCSS設計の紹介が前半あり、後半はBEMと著者オリジナルなCSS設計の作例。初心者向けで丁寧。2021/07/18
monotony
1
CSSの基礎と設計のポイントを押さえてからOOCSS、SMACSS、BEM、PRECCSといった各種設計手法が丁寧に解説されている。後半の実践的モジュール集ではBEMと著者の提唱するPRECCSの2通りのコードが記載されており、単に独自の方法論を押しつけるだけではない良心的な本。CSSがカオスになってきたな(なりそうだな)と思ったら早めに一回読んでおくといいかも。2021/03/28
ゆこぅ
1
CSSオタクによる細かすぎる話って感じで実用的です2020/07/19