CSSで見やすくメンテナンスしやすいコードを記述するための自己流ルール【その２】

2006-05-15T13:49:21+09:00

前回のエントリーで仕様書の出現順などと書いてみたものの、どうも不完全燃焼感が漂っていました。先日、友人の結婚パーティのあとに Web 業界な人と飲み会があり、プロパティに関して雑談をしていたところ、

アルファベット順で書く
好きなプロパティ順で書く

なるほどいろいろやりかたがあるのだなー、と参考にしつつ、また悶々と考えながらいろいろなところを巡回。

一般にスタイルの設計は、広域的なスタイルから小さなブロックのスタイルへ、集合的な要素型から個別の要素へという具合に、広く汎用的なところから始めて順次対象を絞り込みながら細かな規則を加えていくと、効率的でメンテナンスしやすいものとなります。これをセレクタの使い方に当てはめると、

全体に共通する要素型セレクタ（および擬似要素、擬似クラスセレクタ）による定義を行い、

文書の大きな機能ブロックを表す要素型やIDセレクタ（場合によってはクラスセレクタ）のスタイル規則を定義し、

各機能ブロック内のサブブロックのスタイル規則を子孫セレクタを利用して定義していく。

といったステップが考えられます。

The Web KANZAKI CSS2.1(仮) 2.3.5 機能ブロックとセレクタ

なかなか自分の中でいい結論がでないまま、仕様書順でガイドラインの草案をつくりはじめてしまったわけですが、現場で衝突をしながらよい方法にしていけばいいなと思いながら、試行錯誤は続くのであります。