🎨
フロントエンド初心者に知ってほしい、CSS運用における3つの考え方(2/2)
この記事の後編です。
- 破綻しやすいCSSは、どういうものか？
https://zenn.dev/taizo_pro/articles/750022c6f27424
この記事で学べること
- いかに少ない工数でメンテナンス効率を下げずに改修ができるか？
- CSSフレームワークを導入するべきか？
読んでほしい人
- 今までバックエンドメインで、フロントエンドはほぼ触ったことがない人
- style = '*' と、スタイルをインラインで書いている人
参考にした書籍
この2つの書籍を元にまとめました。（ほぼ要約に近い）
とてもわかり易く、まとめられているので、おすすめです。
いかに少ない工数でメンテナンス効率を下げずに改修ができるか？
- CSSのゴールは、メンテナンス効率を下げずに、少ない工数で改修ができるようにするか。
- Googleのエンジニア フィリップ・ウォルトン氏によると、以下の4つが挙げられている。
-
予測しやすい
他のルールが影響しないようにする。逆も然り。
-
再利用しやすい
機能ごとにルールを分離しておく。
-
保守しやすい
追加したルールによって、既存のルールを破壊しないようにする。
-
拡張しやすい
サイトの規模が大きくなるにつれて、拡張しやすいものかどうか。
-
これらをクリアしていれば、「良い設計のCSS」となる。
CSSフレームワークを導入するべきか？
こだわったUIにしたい、社内にデザイナーがいる場合
→フレームワークに依存しない手法を検討するべき。
それ以外の場合
→無難にフレームワークを取り入れるべき。
-
理由
- とにかく楽で早い
- デザインを考えずにそれなりにかっこいいサイトになる。
- しっかり設計されているため、メンテナンスがしやすい。
CSSフレームワーク
以下の記事にて、多数取り上げられているので、割愛します。
Discussion