Какие способы и приемы верстки используете вы?

Каждый знает, что верстка - это самый времязатратный, нудный, креативный и ситуативный процесс. Кто-то строит кучу костылей, чтобы прям угодить в скидываемые макеты, кто-то лепит стили прямо в инлайн-свойство style, думая, что он держит и стили и верстку в одном файле, чтобы не было каши в style.css файле (при этом в style.css выносится только какие-то общие элементы); кто-то делает модульную верстку как БЭМ, например, а кто-то просто использует бутстрап и ему на верстку собственно с верхней горы (ну это пока не встретится с реальными макетами)

Что касается меня, я использую какую-то частицу БЭМ методологии --> описываю независимые блоки и элементы внутри них и затем применяю модификаторы там для изменения цвета или размеров (padding,width). Если нужно поправить положение элемента (margin,float,display и т.д.), то использую два стиля --> navbar (как общие стили для компонента) и header__navbar (где я там отрегулирую margin или ширину, если она задается в процентах)

На крайняк использую инлайн-свойство style, чтобы не плодить очень много блоков или элементов и их модификаторов.

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

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

Думаю верстать отдельные страницы, где у меня будут находиться все независимые компоненты и элементы --> например, как это делается в UI/UX дизайне (собственно, я еще и занимаюсь дизайном), там создается отдельный ArtBoard для компонентов и очень удобно работать с ними, даже когда их становится много.

Не могли бы вы поделиться своими мыслями, заготовками на этот счет? Ведь каждый повар имеет свои подходы и приемы.

Для верстки я использую двенадцать колонок (в дизайне) и эту же сетку просто беру из bootstrap (только лишь сетку)


Ответы (0 шт):