@MyQuestion

Как с точки зрения БЭМ размечать внутренние страницы сайта?

Как с точки зрения БЭМ размечать внутренние страницы сайта?

Нужно ли везде указывать, что это за страница? Например inner-page__services или price-page__quality-assurance

Допустим у меня есть внутренняя страница сайта, раздел которой, в принципе может быть описан как services. Там есть список услуг и цены на них, а так же список брендовой продукции, который гарантирует качество оказываемых услуг.
Но привычно, services, мелькает где-то на главной странице лендинга. И тут я зашёл в тупик. Ведь services этот блок, который может повторятся и на других страницах сайта, и при этом, будет выглядеть по другому. В моём случае, такого раздела на главной нет. Но, ему там ничего не мешает появиться, со временем.

Конечно, если полностью следовать БЭМ, должна появиться и такая же структура файлов. Но если мне необходимо все стили запихать в один css? Тогда, стоит ли как-то выделять контент внутренних страниц? Или нужно избегать повторения в именование классов?
  • Вопрос задан
  • 222 просмотра
Решения вопроса 1
SkiperX
@SkiperX Куратор тега HTML
Структура для всех страниц:
.page
    .page__header
      .header
    .page__wrapper
      .page__block1
        .block1  // это блок страницы, замените на свое название
      .page__block2 
        .block2 
  .page__footer
      .footer


Нужно ли везде указывать, что это за страница?

Базовый шаблон, который есть на всех страницах (шапка, футер) обычно при интегрировании верстки выносят в отдельный файл. Поэтому вешать на каждую страницу свой класс без надобности не надо.

Ведь services этот блок, который может повторятся и на других страницах сайта, и при этом, будет выглядеть по другому.

Назовите его по-другому .main-service или .last-service

Конечно, если полностью следовать БЭМ, должна появиться и такая же структура файлов. Но если мне необходимо все стили запихать в один css?

В беме у каждого блока свой файл стилей. Собирать итоговый css можно как угодно, например, используйте sass include.

Или нужно избегать повторения в именование классов?

Нужно избегать повторений в именах блоков.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Born2Lose
@Born2Lose
Frontend developer
Ведь services этот блок, который может повторятся и на других страницах сайта, и при этом, будет выглядеть по другому

Для этого можете воспользоваться миксом. Например, у вас есть блок services и вы хотите его использовать на главной и на любой другой странице, тогда именование это блока на главной будет такое - class="main__services services" где по селектору main__services вы описываете расположение элементов внутри блока services для главной страницы. Теперь для другой страницы можно сделать тоже самое class="another-page__services services"
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы