Какие знаешь методологии в HTML

«Какие знаешь методологии в HTML» — вопрос из категории HTML, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

  • БЭМ (Блок-Элемент-Модификатор) — методология для создания переиспользуемых компонентов. Блок — независимый компонент, Элемент — часть блока, Модификатор — вариация блока/элемента.
    Пример:
    <div class="menu">
      <button class="menu__item menu__item--active">Home</button>
    </div>
  • SMACSS (Scalable Modular Architecture CSS) — разделение стилей на категории: Base, Layout, Module, State, Theme. Упрощает поддержку больших проектов.

  • OOCSS (Object-Oriented CSS) — разделение структуры и оформления. Пример:

    <div class="box rounded"></div>
Где `.box` — структура, `.rounded` — оформление.
  • Atomic CSS — стилизация через атомарные классы (например, margin-10). Подходит для быстрой разработки, но усложняет читаемость.

  • ITCSS (Inverted Triangle CSS) — слоистая структура стилей (от общих к частным): Settings, Tools, Generic, Elements, Objects, Components, Utilities.

Выбор зависит от масштаба проекта и предпочтений команды.