Как правильно выстроить структуру по БЭМу?

Question

[eugenedrvnk]

В одном видеоролике увидел следующий пример :

<section class="section-header">
  <div class="section-inner">
    <div class="section-header-logo"></div>
    <div class="section-header-content">
      <div class="section-header-wrapper">
        <div class="section-header-wrapper__title"></div>
        <div class="section-header-wrapper__subtitle"></div>
      </div>
    </div>
  </div>
</section>

Здесь есть много блоков и лишь начиная с блока header-wrapper появляются элементы - section-header-wrapper__title и section-header-wrapper__subtitle. Правильный ли такой подход? Или по логике вещей весь section-header должен идти главным блоком, а остальные div'ы - его элементами.

<section class="section-header">
  <div class="section-header__inner">
    <div class="section-header__logo"></div>
    <div class="section-header__content">
      <div class="section-header__wrapper">
        <div class="section-header__wrapper-title"></div>
        <div class="section-header__wrapper-subtitle"></div>
      </div>
    </div>
  </div>
</section>

Comments

[Алекс Глебов]

Cекции страницы делай блоком, внутри элементы. То, что надо переиспользовать в других местах, выделяй в блоки.

Answer 1

[xdevelx]

Тут больше напрашивается что то такое

<header class="header">
  <div class="header__inner">
    <div class="header__logo"></div>
    <nav class="header__nav"></nav>
  </div>
</header>
<section class="intro">
  <div class="intro__wrapper">
    <h1 class="intro__title"></h1>
    <div class="intro__subtitle"></div>
  </div>
</section>