БЕМ или "БЕЕЕМ"

Общее
1

Суть вопроса одновеременно и простая и сложная.

Допустим, у нас есть блок навигации (говорим за деcктоп версию, т.е. без адаптивки).

<nav class='page-navigation'>
  <div class='page-navigation__wrapper'>
    <ul class='page-navigation__list'>
      <li class='page-navigation__item'>
        <a href='#' class='page-navigation__link'>some text</a>
      </li>
      <li class='page-navigation__item'>
        <a href='#' class='page-navigation__link'>some text</a>
      </li>
      <li class='page-navigation__item'>
        <a href='#' class='page-navigation__link'>some text</a>
      </li>
    </ul>
  </div>
</nav>

С точки зрения методологии, а точнее ее правил нейминга - код абсолютно верен. НО. Мне, лично, удобнее писать в нижеизложенном варианте, т.к. “самодокументируемости” больше, но раздуваются классы. Когда я на проекте верстаю один - без проблем, но коллеги жалуются, что им неудобно. Выскажите пожалуйста свое мнение.

<nav class='page-navigation'>
      <div class='page-navigation__wrapper'>
        <ul class='page-navigation__list'>
          <li class='page-navigation__list-item'>
            <a href='#' class='page-navigation__list-item-link'>some text</a>
          </li>
          <li class='page-navigation__list-item'>
            <a href='#' class='page-navigation__list-item-link'>some text</a>
          </li>
          <li class='page-navigation__list-item'>
            <a href='#' class='page-navigation__list-item-link'>some text</a>
          </li>
        </ul>
      </div>
    </nav>
2

Апать - это плохо. Но тема актуальна)

3

Второй вариант жуткий, особенно если представить, что у ссылки будет не один класс. И самодокументированности не вижу, скорее неоправданное дублирование.