Впервые я узнал о BЭM около 5 лет назад. В то время все ненавидели IE6, ждали возможности полноценно использовать CSS2 и удобно забыли о верстке таблиц.
Тогда казалось, что с исчезновением IE6 жизнь верстальщика станет интересной и беззаботной.
Именно IE6 был основной причиной костылей в верстке.
Кто бы мог подумать, что во времена HTML5 и CSS3, когда особых проблем с разработкой популярных браузеров не будет, ситуация станет еще хуже.
Недавно я обнаружил, что во многих существующих проектах уже реализован BЭM, а некоторые новые проекты требуют от верстальщика разработки в соответствии с BЭM. То есть профессиональные разработчики уже столкнулись с фактом и у них нет выбора.
Раз уж ситуация такая, попробуем разобраться во всем без рекламы и прикрас.
Сопровождаемость и повторное использование кода Очень важные показатели для любой разработки, известные нам в основном из языков программирования.
Вся суть и прелести БЭМ сводятся к этим показателям.
Если долго говорить с программистом об их важности, а потом предложить купить слона, сделка, скорее всего, состоится.
Чтобы понять, улучшает ли BЭM что-то в этом направлении, надо сначала определиться, в отношении чего мы будем проверять улучшения.
Если разложить страницу с таблицами, как это было во времена IE6, то улучшения от перехода на BЭM с такой разметки обязательно будут. Но найти проекты, которые все еще страдают от табличной компоновки, уже непросто.
Давайте лучше посмотрим на текущие практики, вытекающие из спецификации HTML/CSS. Есть только одна такая практика.
Это семантическая раскладка с разделением структуры данных и дизайна.
В течение многих лет разработчики самого HTML разрабатывали язык именно с учетом этой практики.
Концепция разделения структуры данных и дизайна содержит одну очень важную идею об удобстве сопровождения.
Разметка HTML создана таким образом, что любые последующие изменения можно вносить, изменяя только код CSS. Эта концепция очень элегантно решает все проблемы ремонтопригодности.
В результате, если BЭM и улучшает что-то с точки зрения ремонтопригодности, то явно не в отношении семантической компоновки.
BЭM значительно облегчил жизнь разработчикам Яндекса Много раз я видел что-то вроде этой фразы как убедительный аргумент в пользу БЭМ.
Проверить качество жизни разработчиков в Яндексе после перехода на БЭМ будет непросто.
Но вы можете увидеть код их проектов.
Так что это очень похоже на правду.
Ведь в верстке некоторых проектов Яндекса до сих пор используются некоторые приемы верстки таблиц.
Например, чтобы разместить логотип и горизонтальное меню сбоку от него, один из разработчиков Яндекса создает одну общую таблицу.
Неудивительно, что БЭМ улучшает жизнь в Яндексе, ведь единственное, что хуже БЭМ, — это табличная вёрстка.
Проблема в том, что эта компания распространила свою борьбу с таблицами по всему Рунету под видом какой-то эффективной методики.
Теперь даже новые проекты, разработчики которых даже не знают о верстке таблиц, вынуждены использовать эту неуклюжую практику работы с таблицами.
Вам нужно разобраться с версткой таблицы, если проблема где-то все еще существует. Только не меняйте одни костыли на другие.
Есть хорошие готовые практики, которые уже давно решают все проблемы ремонтопригодности.
И уж точно не стоит выгонять с Хабра всех, кто высказывается против использования методологии BЭM. Если бы БЭМ был так прекрасен, как описывают авторы, не было бы никакой суеты.
Каков результат? БЭМ — это жесткий и очень неуклюжий свод правил, не имеющий никакого практического применения, если не учитывать проблемы устаревшей верстки таблиц.
БЭМ уродует код и уничтожает все прекрасное, что есть в процессе верстки.
Любой контакт с БЭМ напоминает бессмысленное и утомительное подвешивание костылей.
Прежде чем внедрять BЭM, вам следует несколько раз подумать, прочитать спецификацию HTML/CSS и изучить другие практики.
Только после реального понимания практической полезности разных практик и различий между ними можно принять решение в пользу использования БЭМ, но лучше в этот момент еще раз подумать.
В противном случае вы можете стать жертвой агрессивного маркетинга и соучастником распространения дерьмового кода.
Теги: #семантическая верстка #табличная верстка #бам #дерьмовый код #костыли #разработка веб-сайтов #CSS #HTML
-
Готовим Drp — Не Забываем Учесть Метеорит
19 Oct, 24 -
Ваша Социальная Загробная Жизнь
19 Oct, 24 -
Soft-Skills Успешного Тестировщика
19 Oct, 24 -
14 Постулатов Воплощения Качества.
19 Oct, 24
