divでまとめる時の基準

Question

前提・実現したいこと

例えば

div class="lesson-wrapper"

で囲み、その次に

div class="lesson-contener"

で囲まれている場合
contenerが必要な理由やwrapperが必要な理由がわかりません。

cssを書いていて、後に「囲んでおけば良かったな」とはなるのはわかるのですが、
htmlを記述している時点ではどこまでdivで細かく囲む必要があるのかがわかりません。
見出し(h1やh2など)だけをdivで囲んでいたりするものもあり、逆に囲んでいないものも見かけます。
どういう基準でdivを作っているのかご教示いただけますでしょうか。

Comments

[m.ts10806]

contener
ではなく
containerでは？

[m.ts10806]

あと
lesson-wrapper　や　lesson-contener
などのクラス、およびアプリケーションの設計次第なのでこの内容だけで応えられるものってないと思います。
ラッパーやコンテナの役割が知りたいと言うこと？
質問したいことをもっと具体的にされたほうが良いような

[m.ts10806]

なぜ退会

Answer 1

質問の意図がわかりかねますが、構造的にグルーピングしておいたほうが有利な場合はdivでラップしたりしますね。排他的に範囲内だけにCSSを適用したいとか、同じような要素が並列であるものをまとめたりとか。
もちろんグルーピングは論理的なclassや属性(カスタムデータなど)でもできますので絶対にラップしなくてはいけないということもないですが、パーツとして管理するには有利かもしれません。

Answer 2

意味論的に不要であれば、まとめないのがベストだと考えています。
原則として、ラッパー要素は「仕方がないので」という必要悪で使っています。