CSSで対象を指定するセレクタの書き方に物申す！

明確な理由がないのにタグで指定しない

なにがダメなのか
これは、タグで指定してしまうと他の場所で使う際に困るから
他の場所で違うスタイルを適用したい場合、上書きしていくことになる
ので基本的にCSSで装飾する場合には、タグの使用は避けた方が吉

idで指定しない

特に意図せず使う場合は、あとあと非常にメンドクサイことになるかも
はじめにあげた「#systemWrap section」
これは遭遇したサイトのほぼ全てのページに適用されます
で、そこに書いてあるのはこんな感じ

CSS

これ、デザインが全ページで統一されているなら問題にはならないかもしれませんが
今回のサイトではページの内容によってデザインが大きく異なる為、
毎回当然のように上書きしなければなりません。
が、idに振ってある為詳細度が高く、さらに詳細度をあげないと上書きできません。
これを繰り返すと、ページの表示速度に影響してきますので、
理由がない場合はidで指定しない。

階層構造を列挙しない

無駄に階層構造を書かない
ul li とかどう考えても書く必要がない。
CSSのセレクタは指定すればするほどページを表示するまでの速度が遅くなります。
ブラウザはセレクタの最後の要素から順番に適用先を探しにいきます。
はじめにあげたような書き方をすると、
まず、pを探して見つけたら親要素にliがあるかさらにulがあるか…
と全て総当たりで探していくので書けば書くほど遅くなる。