Как правильно определить семантику через БЭМ?

Question

[EarthFM]

Привет всем, вот сижу изучаю БЭМ и решил сразу сверстать сайт. Сайт состоит из первого блока где будет расположены элементы параллакса и второго. Второй появляется при скролле там просто текст, картинки и т.д.
Вопрос в том правильно ли использовал БЭМ в данном случае. Что означает --? И когда нужно модификаторы использовать? Надо использовать префиксы или лучше без них, как практика показывает?

<div class="b-popup"></div>
	<div class="b-main">
		<div class="b-main-scroll"></div>
		<div class="b-main-content">
			<div class="b-car">
				<div class="b-car__item"></div>
			</div>
			<div class="b_footer"></div>
		</div>
	</div>

Answer 1

[Виталий Киренков]

Практика показывает - не использовать БЭМ. Ибо все их тонкости только его разработчики и знают, да и по слухам сам яндекс уходит на Stylus.

Comments

[EarthFM]

styles это же препроцессор такой же как sass и less) причём здесь методология БЭМ?

[Виталий Киренков]

При том, что он удобней )) Хотя лично я сторонник именно упомянутого вами Лесс-а.

[EarthFM]

Виталий Киренков: Я видимо, что-то не понимаю) БЭМ это методология, где показывает как обзывать классы, чтобы было проще верстать или SMACSS тоже методолия(где есть свои ), а less, sass, styles это препроцессор которым не важно как названы классы, но позволяет упростить написанию стилей, на html они же ни как не влияют)

[Виталий Киренков]

@EarthFM: То как вы назовёте классы тоже никак на хтмл не повлияет, если уж на то пошло =)) А чтоб понять как лучше обзывать классы - я бы порекоммендовал почитать забугорные сайты. Хотя по сути правил не так уж и много... Ну и если хотите делать по правилам, я бы посоветовал вам посмотреть внимательно на бутстрап, а точнее их подход на именование классов и того какие стили они используют при тех или иных наименованиях, ну а в дальнейшем этим можно маневрировать уже используя миксины, либо же как допклассы (что по сути тоже присутствует в бэм)

[EarthFM]

Виталий Киренков: Просто прочитал вот эти статьи frontender.info/starting-css и frontender.info/bem-sass-modifiers во второй сказано в привью что БЭМ набирает популярность у западных разработчиков, а также https://github.com/i0z/frontend-html-test , где сказано знания БЭМ +1 к карме)))

[Виталий Киренков]

@EarthFM: БЭМ должен быть в мозгу, то есть видеть в голове изначально хотя большую часть архитектуры того, что вы будете верстать. А касательно запада, я так понимаю что разговор идет именно о автоматической генерации, а не рукописной.

[EarthFM]

Виталий Киренков: спасибо за диалог, разобрался более менее пока с вами общался и параллельно ещё статьи читал)

[Виталий Киренков]

@EarthFM: не за что =)

Answer 2

[Андрей Ежгуров]

Никак. БЭМ нужен только для упрощения процесса изменения вёрстки с случае автоматической генерации контента (и, соответственно, автоматический же генерации имён классов в иерархии БЭМ). Руками же прописывать все эти монструозные пародии на имена - это мартышкин труд.

Comments

[EarthFM]

У меня всё простые сайты так что прописывать не много) Просто учусь обзывать классы по БЭМ)

Answer 3

[Елизавета Борисова]

Вот он результат рекомендаций изучать БЭМ всем и новичкам тоже.

Comments

[EarthFM]

Не надо его изучать или что то другое по рекомендуете?)

Answer 4

[Евгений Петров]

Воспользуйтесь bem-naming.