Chapter 10

オブジェクト指向CSSを使う目的

Arisa Fukuzaki
Arisa Fukuzaki
2020.10.16に更新

オブジェクト指向CSS(OOCSS)が、どういうものなのか、ということについては、本書のチャプター1で学習しましたね。

再利用でき、無駄がないclassを設計することです。

では、オブジェクト指向CSS(OOCSS)を使用する目的はなんでしょうか?

オブジェクト指向CSS(OOCSS)を取り入れることにより、コンポーネント(パーツ)の再利用性が高まることは、いくつか例を見てきた通りです。

実は、オブジェクト指向CSS(OOCSS)を取り入れる目的は、もう1つ重要なものがあります。

それは、メンテナンス性です。

少し先の話になりますが、ここでは、なぜメンテナンス性も、コンポーネントの再利用性の高さに加えて重要なのかを説明します。

メンテナンス性の重要性

メンテナンス性が上がることによって、得られるメリットは以下です。

  1. チーム開発がスムーズになる
  2. 大きなプロジェクトでも、管理、状況把握がしやすくなる
  3. 個人開発の管理とメンテナンスの負担が軽くなる
  4. コードに統一性が保てる
  5. CSS全体のセレクタの数を最小限にでき、CSSをコンパクトに保てる

メンテナンス、要するにプロジェクトの維持と管理がしやすければ、開発がしやすくなることが、最も大きなメリットと言えるでしょう。

そして、開発の形態にも、個人開発とチーム開発などの形態がありますが、そのどちらでもメンテナンス性が上がるほど、プロジェクトの規模にかかわらず、管理と状況の把握がしやすくなります。

チーム開発の場合には、メンバーにより、書くコードのスタイルが違うことで、解読や修正(修正することをリファクタリングと言います)の追加工程が出てきてしまうこともなくなります。

個人開発の場合には、少し時間が経って維持管理をしなければならないプロジェクトでも、負担が軽くなります。

CSS自体のコードも、コンパクトに統一性のあるコード保てますので、エラーが発生しても、特定しやすくなります。

オブジェクト指向CSS(OOCSS)を使用する2つの目的が理解でき、使えるようになることで、このようなメリットが得られます。

オブジェクト指向CSS(OOCSS)を使う目的まとめ

  1. コンポーネントの再利用性の高さ
  2. メンテナンス性の向上