Правила разработки сайта

Среди миллионов разработчиков сайтов встречаются такие, которые считают это - искусством. Такое отношение к работе приходит с опытом. Это когда материальная составляющая уже не на первом месте, и даже не сроки выполнения проекта, а качество и юзабилити. Имено эти две составляющие и можно назвать искусством, разумеется если вы достигли определенного уровня :)

Так каких же правил следует придерживаться?

Охватить их все в этой статье я не смогу, но на самые важные пожалуй постараюсь пролить свет.

1. Комментируйте код

Да, да. Эти мелочи порой экономят очень много времени как вам, так и тем, кто будет в вашем коде копаться. Готов поспорить, что спустя год вы и сами в нем не разберетесь сразу :) Поэтому комментировать каждую схему, функцию, блок и т.п. обязательно нужно.

2. Названия функций, стилей, блоков и т.д.

Согласитесь, что если Васю называть Олей то он будет зол? Поэтому, когда вы пишите код следует давать функциям, стилям, элементам правильные имена. Ведь если #Header вы назовете #Shapka или #Panelka08634 это мягко говоря жесть! Или в PHP назвать почтовый класс именем своего хомячка или кота...
Если функция, стиль, элемент и т.д. входят в состав логической схемы - то называть их следует согласно выполняемой ими функции. Шапка = #Header, Подвал = #Footer, и т.д.

3. Использование стандартных элементов

Стандартные элементы HTML - это структурные составляющие веб-страницы. Например, если выключить стили  в браузере то правильно сверстанная страница будет отображаться в текстовом виде, сохранив порядок контент-блоков, заголовков, изображений и т.д. Поэтому не следует забывать о тегах <h1>, <address>, <ul>, <li>, <pre> и т.д. при проектировании каркаса.
Соблюдение стандартов имеет свои плюсы, например:

1. Хорошая индексация поисковиками
2. Адаптация сайта под мобильные браузеры
3. Скорость загрузки страницы

4. Юзабилити

Это очень огромный раздел, но постараюсь вкратце расписать основные моменты. Если простыми словами, то юзабилити это нечто вроде - гармонии. Когда интерфейс удобен, контент приятно читать, ничто не отвлекает от главного, быстро найти необходимую информацию. В общем юзабилити это очень важно!
Основные составляющие хорошего юзабилити:

1. Приоритеты объектов. Располагайте объекты так, чтобы взгляд посетителя скользил по ним в нужном вам направлении. Например: Логотип - Меню - Контент. Это можно добиться путем правильно подобранных цветов и расположения элементов на странице.
2. Цветовая палитра. Она должна быть сбалансированной.
3. Отступы. Элементы нужно располагать на странице сбалансировано и рассчитывать расстояния между ними.
4. Типографика. Размеры заголовков, текста, описаний и прочего нужно делать пропорционально. Не следует использовать более двух разных шрифтов и соблюдайте междустрочный интервал.
5. Подчеркивание ссылок. Гиперссылки следует подчеркивать сплошной линией если они ведут на другую страницу, и пунктирной если действие onclick вызывает действо на текущей странице. Выделяйте ссылки цветом, отличным от основного цвета текста.
6. Медиа. Размещайте изображения, аудио, видео в виде стоп-кадров или превьюшек чтобы пользователь мог сам решать - смотреть ему крупноразмерное содержимое или нет. Никогда не вставляйте медиа с автозапуском воспроизведения!

5. Оптимизация

При завершении разработки следует оптимизировать все и вся. Изображения элементов дизайна, css файлы, js файлы и плагины. Разгоняйте загрузку сайта путем архивирования в gz и настроек сервера. Сокращайте количество GET запросов к сайту при открытии страницы, объединяйте css, js и изображения. Если у вас не очень много изображений, то лучше объединить их в одно и использовать css-спрайты. Эти простые действия значительно увеличат скорость загрузки.