Главная / Мой вордпресс / Чистый CSS “код”

Чистый CSS “код”

Чистый CSSДобрый день!
Сегодня хотел бы поговорить о наборе правил, которых стоит придерживаться при написании css стилей.

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

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

Получается, что написанный вами код, в данном случае CSS, не должен пугать, и не должен усложнять и увеличивать время для понимания, того что вы хотели сделать или сделали)

И так полетели.

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

/* Сбрасываем все элементы разметки в ноль */
* {
    margin: 0;
    padding: 0;
}

2) Читабельность кода
Данное правило подходит для любого языка разметки, разработки и т.д.
Форматирование, должно быть везде)
.class {
background: #FFF;
border: 0;
color: #252525;
float: left;
margin: 0;
padding: 0;
}
3) Пишем комментарии
/********** Заголовок **********/
Старайтесь писать комментарии в тех местах кода, где у другого, читающего со стороны человека, могут возникнуть сомнения или вопросы.
Просто поставьте его на своё место, и подумайте где бы вы хотели видеть комментарии.
4) Разделяйте код и хаки
Старайтесь не писать хаки в одном файле, где и css код.
5) Пишите код короче)
В CSS есть правила, которые можно сократить, к примеру, как margin или padding

.classname {margin: 1px 2px 4px 1px; }

6) Используйте оглавления
Данное правило относится почти ко всем случаям разработки CSS)

/*****************************************************
1. HEADER code
2. NAVIGATION code
3. CONTENT code
4. SIDEBAR code
5. FOOTER code
*****************************************************/

Сразу будет понятно, что вначале будут описаны правила для заголовка, навигации и т.д.
Часто так бывает, не хватает этого, когда редактируешь шаблон)
7) Название “переменных”
Для CSS это не очень относится название переменных, тут больше название классов или id для элементов разметки.

Хотелось бы отметить, еще один факт – не надо создавать класс, там, где он не нужен, можно просто воспользоваться вложенностью блока и прописать правило для него, а не создавать под него класс.

Ах да, самое главное правило, старайтесь так писать код или делать работу на таком уровне, что бы за результат вам стыдно не было.

Если есть чем дополнить статью, напишите в комментах.

Спасибо за внимание.

Скажите нам, что вы думаете.

Оставить комментарий

Ваш email нигде не будет показанОбязательные для заполнения поля помечены *

*