実務でＩＤとclassの使い分け方法

質問

現在ＣＳＳを勉強中です。
classセレクタを使うとＣＳＳの指定が同じタグでもそれぞれ違う
デザインが指定できて非常に使えるなぁと思ってます。
例えば、一方のＨ１タグの文字の色を青にしてもう一方のＨ１タグの
色を赤にしたりすることが可能です。

しかし、ＭｄＮを見てみるとよく外部ＣＳＳファイルに「＃○○」、
bodyタグ内にＩＤを指定してデザインを適用する使い方が多くを
占めていました。
このＩＤを使うときは、ページが縦に長いときに印をつけて、ページ内の指定位置へリンクするという使い方だけだと私は思っていました。

classではなくＩＤをよく使う理由はなんなのでしょうか？？
みなさまよろしくお願い申し上げます。

回答No.2

papipu01 · ベストアンサー

class　は何度も利用する属性として使い、
ID は固有の属性に使っています。

利用目的は、ソースコードを見やすくするためです。

同一ＨＴＭＬ内にＩＤは一度しか登場させませんが、
classは、何度も使いまわしします。

具体的には、
IDの例
container : サイト全体をつつむ。
footer : サイト下部のフッター情報をつつむ。

Classの例
box ：　商品の画像、価格等の要素をつつむ。

上記を見て分かるように、１つのＨＴＭＬにcontainerやfooterは２回は利用しません。それでID属性を利用します。
そして、１商品の体裁を整えるものはClassで処理します。

複数のサイトを管理するようになると、大体、ソース内で利用するID名やClass名は統一されてきます。
特にIDについては、多くの人が同じような名前を利用しますので、誰が見てもどれがどんな役割を果たしているかが、ソースにコメントがなくても分かります。

ですので、ヘッダー、フッター、メインナビゲーション、右カラム、左カラムくらいはＩＤにすると良いと思います。

参考URL：

http://www.tg.rim.or.jp/~hexane/ach/awht/awht07.htm

お礼

回答ありがとうございます。
なるほど具体的に教えていただき非常に理解が進みました。
大変参考になりました。
どうもありがとうございました。

回答No.4

quads

検索すればいくらか有効な答えが見つかります。
※よりシビアな内容ですが、今年の3月に議論が交わされました。
※ http://www.akatsukinishisu.net/wiki.cgi?class%C2%B0%C0%AD%A4%C8id%C2%B0%C0%AD%A4%CB%B4%D8%A4%B9%A4%EB%B5%C4%CF%C0%A5%EA%A5%F3%A5%AF%BD%B8

「classではなくidを使う」という発想では答えが出ません。
classを、同一要素でも箇所によって区別するためのセレクタのマークとしてしか見ていないのであれば、classもidも変わりません。
# idが一意であること、個別性の違いはここでは本質でない。

もっと広い観点から、「class属性がなぜ与えられているのか」を評価したときに違いが生じます。

Tips/WebPage/class と id の違いとは？ - outsider reflex
http://deztec.jp/x/01/tips/page/p0045.html
こちらを閲覧されれば理解できるかもしれません。

厳密な表現をすると理解に障るので敢えて曖昧な表現にしています（語弊があるかもしれない）。

お礼

回答ありがとうございます。
なんだか難しいですね、、、
リンクを参考にして勉強させて頂きます。
どうもありがとうございました。

回答No.3

noname#56851

指定位置へのリンクはname指定で、cssのidとは違うと思います。
idは内容的に意味のあるかたまりに使うものと理解しています、たとえばヘッダーとかメインとかナビゲーターとか。
classはページのどこにでも存在しうる物、たとえば文字の強調とか、説明のpopupとか、画像のfloatとかです。
こんな使い分けをしています。
とりあえず、idは同じページ内に一回のみ使用、を守れば後は自分で分かりやすいルールを決めて、idとclassを使い分けるのが良いかなと思っています。

お礼

回答ありがとうございます。
そうですね、まずはおっしゃる通りＩＤは一回のみという形で
使用してみたいと思います。
どうもありがとうございました。

回答No.1

naokita

id　そのページに１回しか使えませんし
決定している事項（不変の事、絶対事項）しか使いません。

idとclassの違いで検索して下さい。詳しく載っています。

全てclassで指定してもいいようですが、
自分の場合は、classが沢山あるよりも
idが多少あったほうが、管理しやすいから。

お礼

回答ありがとうございます。
なるほど、管理しやすくなるからですか。
確かに見やすい気がします。
どうもありがとうございました。