Раз вы читали про БЭМ, то особо вдаваться в теорию не буду и притяну пример за уши и опишу как бы я думал и именовал HTML-элементы на примере логотипа.
Каждый сам выбирает по какой системе понимать: где блок, где элемент, а где модификатор. Как это делают в Яндексе описано в
документации по БЭМ, я придержусь этого способа именования
Классы стоит присваивать после того как вы определились: это блок или элемент? А может вообще модификатор.
Расписываю на примере лого:
Сначала я бы понял, что это блок в системе ценностей БЭМ и именовал класс так "
logo" (блок -- самодостаточный элемент).
Допустим, потом мне бы потребовалось на каких-либо страницах сайта флетовое (flat) лого. Получается, что я буду делать модификацию логотипа. Поняв, что это модификатор я бы добавил следующие классы: "
logo logo_flat" -- класс блока "
logo" и соответственно, класс модификатора "
logo_flat"
Далее, если бы мне потребовалось в логотипе разместить текст (название фирмы, слоган и т.п.). То я бы сначала разобрался -- это блок, это элемент или модификатор? Явно не модификатор (никакой CSS-модификации в существующие элементы не добавляется), значит блок или элемент. Согласно БЭМ-методологии, блок -- самодостаточная единица, а элемент не может существовать вне блока. Соответственно, текст внутри лого это элемент. Я бы в блоке лого разместил текст в HTML-элементе и присвоил класс "
logo__company-name" (класс элемента включает в себя в качестве префикса название блока. Это связано с тем, что элемент может существовать только в контексте блока)
