HTMLを少数のクラスとIDに制限し、HTMLのサイズを低く保つのが良いですか、それとも代わりに多くのネストされたCSSを使用するのが良いですか。
これらは私が両方のために考えることができる利点です。
ネストされたCSSルールをいくつか使用する利点：
ネストされたCSSルールを多数使用する利点：
ありがとう。
私はいつでも大きなHTMLよりも大きなCSSについて議論したいと思います。CSSはキャッシュされるので、小さいHTMLを使用するとページの読み込みがはるかに速くなります。クラスが多いほど柔軟性が高くなりますが、CSSセレクターを使用してどれだけ達成できるかに驚かれることでしょう。HTMLを便利なものとしてまとめるのは、SEOの場合だけです。私が言っていることの例については、microformatsを参照してください。
正確さは決して問題ではありません（人為的ミスを考慮しても、すぐに間違いを見つけることができるはずです）。速度に関しては、パフォーマンスに影響があるとは思えません。すべてのレンダリングはクライアント側で行われるため、CSSセレクターがより複雑になるため、サーバーがこれ以上作業を行うことを心配する必要はありません。
Wex re cssキャッシングに完全に同意します（cssを増やし、htmlを減らします）
あなたの質問は
HTMLをできるだけ少数のクラスとIDに制限し、HTMLのサイズを小さく保つ方がよいですか、それともネストされたCSSルールを多く使用する方がよいでしょうか。
レンダリングパフォーマンスの観点からは、ブラウザエンジンが右から左に一致するため、フラット（1レベル）セレクターを使用する方が実際にはより有益です.list-item-first。ul li:first-childこれは、メンテナンスの観点からは管理しにくいですが、パフォーマンスがわずかに向上します。同時に、適度なサイズのスタイルシートに違いが見られることはめったにないので、それは好みの問題です。
私はあなたのcssでたくさんの入れ子を使うことに強く反対します..css入れ子の1つの問題はそれがあなたのcssコードをはるかに再利用しにくくすることです。オブジェクト指向CSS（OOCSS）の概念を説明しているこのページをご覧になることをお勧めします。これには、次の重要な概念があります。
「場所に依存するスタイルを使用することはめったにありません」。オブジェクトは、どこに置いても同じように見えるはずです。したがって、で特定のスタイルを設定する代わりに、問題を説明するクラスを作成して適用します<h2>。.myObject h2 {...}<h2><h2 class="category">.*
cssセレクターの使用が制限される理由の詳細については、こちらの回答を参照してください。