GLANZ. CREATIVE WORKS

CSS

CSSを保守しやすく、機能的に、一貫して書くためのガイドライン

ガイドラインの目的

CSS ガイドラインは、次の 3 つを主な目的として規定しています。

  • 保守性
    影響範囲が明瞭であること、確実に場所を特定して追加・変更ができることを目指します。
  • 機能性
    命名規則が機能的でその機能が予測し易くあること、プロジェクトにヘルプアサインされてもほとんどが判断がつくことを重視しています。
  • 一貫性
    一貫した汎用ルールがあることでプロジェクト独自ルールの氾濫を避けられること、プロジェクトをまたいでも混乱することがないことを目的としています。

基本ルール

  • CSS のみでスタイリングする
    CSS ファイル内では、基本的に CSS のスタイリングのみを記述します。
    HTML の構造や JavaScript の処理は分離し、CSS の可読性と保守性を高めます。
  • クラスセレクタを優先して使用する
    スタイリングにはクラスセレクタ(.class-name)を優先して使用します。
    ID セレクタや要素セレクタは避け、影響範囲を明確にします。
  • インラインスタイルは避ける
    HTML の style 属性での直接スタイリングは避けてください。
    外部 CSS ファイルで管理することで、スタイルの一元管理と再利用性を確保します。