FeelGood
@FeelGood

Что делать когда кончаются названия для class/id

Каждый раз при работе над большим проектом, когда счет строчек кода давно идет на тысячи, возникает одна и та же проблема: в какой-то момент становится очень сложно придумать название для класса.

Как решить? где взять «вдохновение»?
  • Вопрос задан
  • 3897 просмотров
Решения вопроса 1
@egorinsk
Вообще, это очень важное и редкое умение, давать имена/названия объектам в программировании. Я часто трачу время именно на то, чтобы подобрать правильное и понятное название (и даже гуглю как аналогичные штуки называют другие разработчики, а также ищу переводы слов), а не написать сам код.

Что касается вдохновения, тут лучше поменять систему наименований. Например, сделать уникальный класс для блока, а внутри использовать классы с префиксом (по типу предложенной яндексоидами системы БЭМ), вроде:

.b-news-teaser (внутри b-new-teaser-header, b-new-teaser-list, b-news-teaser-item, b-news-teaser-sticky-flag и так далее), рядом .b-top-comments (внутри классы с таким же префиксом), потом .b-top-articles и так далее. То есть уникальные имена только у блока, а внутренние классы используют префикс.

Это, кстати, даст верстке определенные свойства «железобетонности» — вы сможете перенести блок с одной страницы на другую, и ничего не сломается. А изменения CSS-стилей в одном блоке новостей не сломают верстку форума (так как у всех блоков используются уникальные имена классов).

Естественно, вышеописанные свойства у вашей верстки будут только при соблюдении адекватного подхода (а то бывают товарищи, пишущие что-нибудь вроде p { font:… }, или даже * { color: black; } ну дуракам как известно, ничем уже не поможешь).

Что касается id — их надо избегать или использовать умные именования. Представьте, вы сверстали форму логина на странице, в которой есть field-username и field-password, а завтра вам понадобилось добавить такую же форму внизу (и у вас клик по лейблу в нижней форме начинает прокручивать страницу вверх). Или открыть в попапе. Или еще что-нибудь. Надо либо отказываться от id, либо, если никак, добавлять к ним уникальные префиксы (например #top-form-field-username и #popup-form-field-username).
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
@skvot
Я не верстальщик, но стараюсь давать элементам «говорящие» классы и идентификаторы, которые следуют из назначения. Соответственно, если у вас есть элемент, которому вы хотите дать класс, который занят, значит у вас с структурой начинаются проблемы.
Ответ написан
Комментировать
IkaR49
@IkaR49
У меня конечно куда скромнее замахи в вёрстке, сотен 5 строк от силы, но id стараюсь присваивать лишь действительно важным элементам, которые взаимодействуют со сценариями или являются якорями. А с именами классов совсем не парюсь, главное чтобы они отображали суть, а если хотят — пусть повторяются, так как в css использую правила вложенности, то есть:
.header {}
.element-1 .header {}
.element-2 .header {}
Ответ написан
Комментировать
leMar
@leMar
Придумайте свою классификацию.
Ответ написан
Комментировать
Делаю так:

— Все названия классов и идентификаторов — это полные английские слова, существительные. Для функций и методов — глаголы. Никаких сокращений и транслитерации.
— Использую иерархию по вложенности. Например, «inventory_weapon» — id контейнера оружия, находящегося в контейнере инвентаря.
— При необходимости использую одинаковые названия классов и идентификаторов.
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы