SELF-SERVICE

最近、スタジオ佐賀の卒業制作でよく見かけるのがclassの多用。
classの設定自体は悪くないけど、省略可能なclass設定が非常に多いように思います。

例えば、
<ul class="list">
<li class="list_child"><a href="#">aaa</a></li>
<li class="list_child"><a href="#">bbb</a></li>
<li class="list_child"><a href="#">ccc</a></li>
</ul>
とある場合なら、liにかけているclass="list_child"はあまり意味がないかなと。
この場合、cssのかけ方としては、list_childにかけていたcssをul.list liに対してかければ解決します。
※ul.list li　は、「class="list"が設定されたul　の中のli」という意味ですね。

そうすると、htmlがシンプルに
<ul class="list">
<li><a href="#">aaa</a></li>
<li><a href="#">bbb</a></li>
<li><a href="#">ccc</a></li>
</ul>
で済むわけです。
こうすることで、htmlがシンプルになるので、htmlのコーディングが楽になり、修正もやりやすくなるかと思います。
classのかけ忘れでレイアウトが崩れることもないですしね。

じゃあ、どういうときにclassをかけるかというと、
<ul class="list">
<li><a href="#">aaa</a></li>
<li class="active"><a href="#">bbb</a></li>
<li><a href="#">ccc</a></li>
</ul>
のように、特定のものに対してだけ特別な設定をしたいときとか。
例えば上の例でいうと、classでactiveにしているものだけは、背景を赤にする……とか。
要素全部にclassかけていくのは面倒だし、ミスの原因にもなりそうなので避けたいところです。