Задать вопрос

Как правильно именовать классы в css?

Sorax в одном из видео говорил, что использовать конструкции типа .menu > .item > .link не есть хорошо, т.к они работают медленнее по сравнению с прямыми именами классов.

Вопросы:

1). Какие проблемы могут возникнуть если не использовать прямые классы? Страница будет дольше грузиться?

2). Как тогда именовать классы если в блоке слишком много вложенных элементов? Слишком напряжно каждой кнопке, заголовку, оберткам давать уникальные имена.

3). Я сейчас верстаю следующим способом: Глобально задаю свойства только блокам типа .post или .slide, а вложенным элементам в блоках даю простые имена типа .title, .button, .text. А сами свойства задаю локально(чтобы не было между ними конфликтов), т.е - .post > .title; .post > .text. Правильно ли так делать?
  • Вопрос задан
  • 3161 просмотр
Подписаться 4 Оценить 1 комментарий
Пригласить эксперта
Ответы на вопрос 4
swipeshot
@swipeshot
Учусь на ошибках.
Так почему нельзя просто место того чтобы .class>.class2>.class3 писать просто .class и точка?
Ответ написан
@pchelovek
HTML-верстальщик
Посмотрите в сторону MCSS. Для небольших и средних проектов подходит больше, чем БЭМ.
Ответ написан
Комментировать
1 Не грузиться, а отрисовываться.

2 Семантически.

3 Я считаю что почти. Я делаю так - пусть у нас есть title, и он бывает в post, news и art. Все общие стили title должны быть вынесеные в .title {} а следом должны идти .post .title {}, .news .title {} и т.д. и задавать они должны отличие от .title. Глобальные же блоки страницы должны иметь id и всегда лучше иметь селектор #id .class чем .class .class

А в целом забейте на селеткторы. Они просто должны быть читаемыми и простыми для изменения. Если у вас супер оптимальные селекторы, это еще не значит что вские бордеррадиусы и боксшадоу не убьют к черту вашу производительность рендеринга.
Ну и еще стоит избегать переопределения стилей.

P.S.
За всеми этими рассуждениями нет никаких объективных фактов вроде каких-либо тестов, даже "на глаз". Только здравый смысл и рассуждения общего вида.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы