Size: a a a

2021 March 11

M

Michael in БЭМ
Prikolist Начрэл
Напомните сайт, на котором компании публикуют стэк технлогий с которыми работают. Хочу погуглить там БЭМ, стало интересно про количество не яндексовских людей любящих БЭМ. Я слышал что его используют в гугле, но глубоко не копал
А разве в шмугл не angular с polymer?
источник

Р

Роман in БЭМ
Prikolist Начрэл
Напомните сайт, на котором компании публикуют стэк технлогий с которыми работают. Хочу погуглить там БЭМ, стало интересно про количество не яндексовских людей любящих БЭМ. Я слышал что его используют в гугле, но глубоко не копал
источник

Prikolist Начрэл... in БЭМ
Michael
А разве в шмугл не angular с polymer?
Ну во всех нормальных крупных компаниях одновременно используются разные технологии, у каждой команды могут быть свои предпочтения и видение. Да, полимер гугловская тема. Но вот рандомная статья из какого-то блога гугла с упоминанием БЭМ, которую я нагуглил за 30 секунд https://developers.google.com/web/fundamentals/performance/rendering/reduce-the-scope-and-complexity-of-style-calculations
источник

yW

yarastqt World in БЭМ
Michael
А разве в шмугл не angular с polymer?
Анугляр это реализация, а бэм это методология, никто не запрещает использовать и то и то)
источник
2021 March 12

ЮГ

Юра Гвоздев... in БЭМ
Привет. Можете подсказать как лучше в данном макете назвать классы и сделать структуру html? Интересует именно вся часть где основной контент (где белый фон). Не могу сообразить как лучше по смыслу придумать имена классов
источник

ЮГ

Юра Гвоздев... in БЭМ
источник

Р

Роман in БЭМ
.page
 .page__header
 .page__section.page__section_view_intro
   …
 .page__section.page__section_view_about
   …
 .page__section.page__section_view_news
   …
 .page__section.page__section_view_*
   …
 .page__footer
источник

ЮГ

Юра Гвоздев... in БЭМ
Роман
.page
 .page__header
 .page__section.page__section_view_intro
   …
 .page__section.page__section_view_about
   …
 .page__section.page__section_view_news
   …
 .page__section.page__section_view_*
   …
 .page__footer
а вот этот кусок как лучше сверстать по бэму? http://joxi.ru/D2PMp0kuJVVqyA
источник

Prikolist Начрэл... in БЭМ
Было бы удобно разместить на какой-нибудь странице БЭМа, ссылку на какой-то репозиторий с словарём терминов популярных сущностей.

Типо "карточка", "хэдер", "хлебные крошки" и т.п.

Возможно это люди и ищут когда спрашивают о сайтах свёрстанных по БЭМ. Ищут слова, которыми можно назвать сущности в их макетах
источник

SB

Sergey Berezhnoy in БЭМ
Prikolist Начрэл
Было бы удобно разместить на какой-нибудь странице БЭМа, ссылку на какой-то репозиторий с словарём терминов популярных сущностей.

Типо "карточка", "хэдер", "хлебные крошки" и т.п.

Возможно это люди и ищут когда спрашивают о сайтах свёрстанных по БЭМ. Ищут слова, которыми можно назвать сущности в их макетах
источник

Р

Роман in БЭМ
Зависит от уже имеющихся блоков. Тут все компоненты претендуют на самостоятельный блок: heading, image, paragraph. Остаётся только расположить их внутри, например, .page__examples:

.page__examples
 .heading.heading_size_l.heading_level_3
 .page__examples-image.image
   .image__description
   .image__location
 .page__examples-heading.heading.heading_size_m.heading_level_4
 .page__examples-paragraph.paragraph
 .page__examples-action.button
источник

ЮГ

Юра Гвоздев... in БЭМ
Роман
Зависит от уже имеющихся блоков. Тут все компоненты претендуют на самостоятельный блок: heading, image, paragraph. Остаётся только расположить их внутри, например, .page__examples:

.page__examples
 .heading.heading_size_l.heading_level_3
 .page__examples-image.image
   .image__description
   .image__location
 .page__examples-heading.heading.heading_size_m.heading_level_4
 .page__examples-paragraph.paragraph
 .page__examples-action.button
а такой вариант пойдет?
section.main-section.main-section1
                   h2.main-section__title.main-section1__title
                   .main-section1__card
                       img(src="", alt="").main-section1__card-photo1
                       h3.main-section1__card-first-name
                       h3.main-section1__card-location
                   .main-section1__block
                       h4.main-section1__block-title
                       .main-section1__block-text

                   .main-section1__card
                       img(src="", alt="").main-section1__card-photo2
                       h3.main-section1__card-first-name
                       h3.main-section1__card-location
                   .main-section1__block
                       h4.main-section1__block-title
                       .main-section1__block-text
                   .main-section1__card
                       img(src="", alt="").main-section1__card-photo3
                       h3.main-section1__card-first-name
                       h3.main-section1__card-location
источник

Р

Роман in БЭМ
Юра Гвоздев
а такой вариант пойдет?
section.main-section.main-section1
                   h2.main-section__title.main-section1__title
                   .main-section1__card
                       img(src="", alt="").main-section1__card-photo1
                       h3.main-section1__card-first-name
                       h3.main-section1__card-location
                   .main-section1__block
                       h4.main-section1__block-title
                       .main-section1__block-text

                   .main-section1__card
                       img(src="", alt="").main-section1__card-photo2
                       h3.main-section1__card-first-name
                       h3.main-section1__card-location
                   .main-section1__block
                       h4.main-section1__block-title
                       .main-section1__block-text
                   .main-section1__card
                       img(src="", alt="").main-section1__card-photo3
                       h3.main-section1__card-first-name
                       h3.main-section1__card-location
Это вы должны спрашивать не у меня, а у коллег. Я бы точно такое не одобрил, т. к. не вижу смысла в main-section1. В остальном вроде то же самое, что я описал, кроме того, что у меня сущности заголовков, картинок, кнопок и т. д. переиспользуют свойства уже имеющихся блоков (heading, image, button), а элементы-миксы служат лишь для позиционирования.
источник

ЮГ

Юра Гвоздев... in БЭМ
Роман
Это вы должны спрашивать не у меня, а у коллег. Я бы точно такое не одобрил, т. к. не вижу смысла в main-section1. В остальном вроде то же самое, что я описал, кроме того, что у меня сущности заголовков, картинок, кнопок и т. д. переиспользуют свойства уже имеющихся блоков (heading, image, button), а элементы-миксы служат лишь для позиционирования.
я просто тренируюсь для себя)
источник

Prikolist Начрэл... in БЭМ
Да, отличный репозиторий. Мне кажется было бы полезно добавить его куда-нибудь на сайт. Например сделать раздел "полезные ссылки" на главной и периодически добавлять туда ссылки на то, о чём часто спрашивают в чате. Что бы можно было ссылаться прямо на этот раздел/пункт в нём, а может даже и ответить на вопросы заранее для самых внимательных
источник

ЮГ

Юра Гвоздев... in БЭМ
Роман
Это вы должны спрашивать не у меня, а у коллег. Я бы точно такое не одобрил, т. к. не вижу смысла в main-section1. В остальном вроде то же самое, что я описал, кроме того, что у меня сущности заголовков, картинок, кнопок и т. д. переиспользуют свойства уже имеющихся блоков (heading, image, button), а элементы-миксы служат лишь для позиционирования.
main section1 это для гридов
источник

Р

Роман in БЭМ
Юра Гвоздев
main section1 это для гридов
Всё равно не вижу смысла.
источник

ЮГ

Юра Гвоздев... in БЭМ
Роман
Всё равно не вижу смысла.
там ведь у каждой такой секции разное расположение блоков, если бы там была одинаковая сетка, то да, можно было бы один класс общий для всех секций. А так как тогда сделать сетку как в макете?
источник

Р

Роман in БЭМ
Юра Гвоздев
там ведь у каждой такой секции разное расположение блоков, если бы там была одинаковая сетка, то да, можно было бы один класс общий для всех секций. А так как тогда сделать сетку как в макете?
Это вообще не сетка, это

.block {
 columns: 2 4em;
}
источник

Prikolist Начрэл... in БЭМ
Prikolist Начрэл
Да, отличный репозиторий. Мне кажется было бы полезно добавить его куда-нибудь на сайт. Например сделать раздел "полезные ссылки" на главной и периодически добавлять туда ссылки на то, о чём часто спрашивают в чате. Что бы можно было ссылаться прямо на этот раздел/пункт в нём, а может даже и ответить на вопросы заранее для самых внимательных
Там же можно было бы опубликовать ссылку на какой-то список известных независимых сайтов свёрстанных по БЭМ. Может быть даже с возможностью туда попасть. Думаю это могло бы даже стимулировать людей верстать по БЭМу, что бы получить ссылку и дополнительный трафик на сайт
источник