相対命名ルール

Minimal, tiny, small, medium, large, huge, gargantuan, enormous, and maximal.。

スケールしていく変数のバリエーションを作る際の命名規則を変えていた。今まではalphaから始めて下にどんどん増やせるようにしていたのだけど、調整コストがかかる。plus1やminus3などとすると無限にスケールできそうだが読みづらい。下に3レベル、上に5レベルくらいまででだいたい足りそうな気がするので、全部で9レベルまで作った。

  1. Minimal
  2. Tiny
  3. Small
  4. (Medium)
  5. Large
  6. Huge
  7. Gargantuan
  8. Enormous
  9. Maximal

Mediumは省略するかDefaultにする。下に3レベル、上に5レベルというのは、タイプフェイスのウェイトにおけるバリエーション(100から900)を参考にしている。


こういう相対的な命名は一般に悪だと考えられている。実際コーディングにおいて、多くの場合はその通りだ。しかしビジュアル・デザインをコントロールすることになるCSSでだけは事情が変わってくる。えてして「ここはあそこより非常に大きく」や「ここはあそこより少し小さく」などという指示に終わり、それが本質であるととらえることができるからだ。

CSS(とHTML)のみではコンポーネントのクラス名という、俗にセマンティックなクラス名という単位で帰結し、そういった相対的なニュアンスという文脈は埋もれることになるが、CSSプリプロセッサーではそういった曖昧な相対的なニュアンスを変数として定義することが可能であり、かつ必須だろう。

そういった相対的なスケーリングを表現するための一貫した命名規則は重要であるわけだが、多くは場当たり的にlargeだとかgrandeだとかminiだとか付けるくらいで終わる。実際には色定義の命名くらい気を使っても良い部分なのではないだろうか。