2009-04-16 10:53 pm

idとclassの使い分け方 編集

以前大学の研究室などで何度かHTML講習会を開いたことがある。文章構造云々の話しをするのだけど、その時に決まって聞かれるid属性とclass属性。人によって色々だろうけど、自分なりのやり方をまとめておきます。

意味を考える

HTMLなどで文章構造を定義するときに重要なのは、キチンと意味を考えること。文章の意味を考えた上で、使うタグや属性を決める。そして、それと同じことがidとclassにも言える。id(identity)とclassには

class
(人・物の)分類,種類( kind )
id(identity)
身元,正体,独自性,固有性,主体性

といった意味がある。そして、それを考えてidを使うか、classを使うかを決める。

具体例

上のことを踏まえて、具体例を挙げてみる。

idの場合

idの場合は特定の範囲に固有の名前を付ける

ウチのサイトでいくと、headerや、content、footerなどがそれにあたりる。そうすることで、「ココからココまではheader、ココからはcontent」という具合に名前をつける感じ。

classの場合

classの場合はその範囲を他と区別するために使う。誤解を恐れずに言えば、ボキャブラリを増やす感じになるかな。

例えば、HTMLでは時間を表す、<date>のようなタグはない。なのでclass="date"としてやることで、擬似的にHTMLのボキャブラリを増やしてやる。

とまぁ、こんな感じッス。まぁ、場合によっては妥協しなければならない場面も多々あるけど、それでもなるべく最善のマークアップを心がけたいと思います。