(要素に) 名前をつけてやる

いわゆるヘッダやフッタなど、ページを構成する主要なブロックをマークアップする際、div 要素に id 属性で名前をつけることが多い。<div id="header"> とか。なぜ class ではなく id なのか? その理由としておそらく最も多いのが、「ページ内で唯一のものだから」。HTML を解説した本やなんかを読むと、「複数出現する (またはその可能性のある) 要素は class で、唯一の要素は id で」なんて書いてあることがよくある。

僕も長いことそうしてたんだけど、どうも違うんじゃないか、と最近は考えてる。今しっくりくるのは、「id 属性は唯一の要素に名前をつけるためのものではなく、要素に一意の (unique) 名前をつけるためのもの」って考え方。つまり、その要素がドキュメントにいくつ出現するかってことじゃなくて、他の要素と識別されるべき要素かどうか。

実際のマークアップ手順としては、まず要素の「役割」や「種別」、「所属」のようなものをもとに class 属性を付与。で、もし「一意の名前」が必要であれば id 属性も付与、って感じ。

そのため、class 属性の値はいわゆる「文脈的」というか「構造的」というか、その要素の役割が理解されやすいキーワードであるべきなのに対し、id 属性の値はあくまで「識別子」なので、ほかとかぶりさえしなければどんな意味不明の文字列でも一向にかまわないはずだ。とはいえ、id 属性を持つ要素はすなわち URI を持つことになるわけで、そのへんは意識して名前を考えたほうがいいかなとも思う。