Правильным способом названия с помощью методологии БЭМ (Block Element Modifier) для сайдбара и основного контента (обычно называемого "main") будет следующее:
1. Для сайдбара:
- Блок: sidebar
или sidebar-block
- Элемент: если внутри сайдбара есть элемент, например, список элементов, то можно назвать их, например, sidebar__list
- Модификатор: если у сайдбара есть модификация, например, его цвет, можно назвать его, например, sidebar--dark
Пример HTML разметки:
<div class="sidebar sidebar--dark"> <ul class="sidebar__list"> <li class="sidebar__item">Элемент 1</li> <li class="sidebar__item">Элемент 2</li> </ul> </div>
2. Для основного контента (main):
- Блок: content
или main-content
- Элемент: если внутри основного контента есть элементы, их можно назвать, например, content__section
- Модификатор: например, если у контента есть разные секции, их можно модифицировать, например, content--full-width
Пример HTML разметки:
<main class="content"> <section class="content__section"> <h2 class="section__title">Заголовок секции</h2> <p class="section__text">Текст секции</p> </section> </main>
Соблюдение методологии БЭМ поможет организовать структуру вашего HTML кода, делая его более понятным и удобным для себя и других разработчиков.