со временем я тоже стал думать о чем-то типа БЭМ. Даже на маленьких сайтах появилась привычка давать такие классы, с приставкой по их родителю. Если это логотип в хедере, то он у меня ".h-logo", или меню: ".h-nav", меню в сайдбаре ".s-nav". Я чувствовал необходимость такого подхода, но незнал как это сделать лучше. Когда узнал про БЭМ, мне эта идея очень понравилась. Насчет дилетанства в наименовании классов - бред. Такое мог сказать человек который только и делает маленькую страничку с css до 1000 строк, в таком формате: div { width: 500px; margin: ...; padding: ...; } А когда с талкиваешся с тем что нужно проапдейтить проект, а в нем все сделанно полагаясь на каскадность, как говорит предыдущий автор и ты видишь такой код: <form action="#"> <fieldset> <div class="hold-text"> <div><input type="text" /></div> </div> </fieldset> </form> .hold-text { width: ...; background: ...; ..... } .hold-text div { padding: ...; background: ...; ..... } .hold-text input { ... } И тут нужно рядом с инпутом всунуть еще блок с непростой структурой, у него внутри еще пара блоков будет то тогда приходится писать: .hold-text .message { padding: auto; float: none; margin: auto; .... } .hold-text .message .m-frame { padding: auto; float: none; margin: auto; .... } Этот минимализм оправдан разве что в примерах, когда нужно кому-то показать как что работает, поэтому быстро набросал и показал. Но к сожалению многие это примут за чистую монету, и сами тоже начинают страдать минимализмом. Вот пример спискозадротов: <div class="gallery"> <ul> <li><img src="" alt=""/></li> <li><img src="" alt=""/></li> <li><img src="" alt=""/></li> </ul> <ul class="switcher"> <li><a href="#"></a></li> <li><a href="#"></a></li> <li><a href="#"></a></li> </ul> </div> .gallery ul { padding: 0; margin: 0; list-style: none; width: ; height: ; overflow: hidden; position: relative; } .gallery li { /* тут я немного сократил, обычно пишут .gallery ul li */ position: absolute; top: 0; left: 0; width: 100%; } .gallery a { /* Это какая-то кнопочка в галлереи. тут я немного сократил, обычно пишут .gallery ul li a */ position: absolute; top: 50px; left: 50px; width: 100px; height: 30px; background: url(image.png); } .gallery .switcher { width: auto; height: auto; } .gallery .switcher li { position: static; float: left; } .gallery .switcher a { position: static; width: ..; height: ..; background: ..; } А теперь представьте что в галлее не просто картинки будут, а там еще и описание полноценное появится, и внутрь ее придется всунуть простой маркированный список. Это то с чем я часто сталкиваюсь. А вот задай классы изначально элементам, да задай им стили через эти классы, а если еще и классы не от фанаря а логично будут проставлены(а в БЭМ так и есть), сделай лучше не себе в данный момент, а тем кто потом будет поддерживать твой код, возможно даже это ты будешь. БЭМ - это не больная фантазия, это логичный результат многих часов работы.