Создаем

Этапы проектирования

Этапы проектирования

  1. Структура сайта (архитектура страниц);
  2. Создание макета;
  3. Разработка сайта;

Создаем базовую структуру

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

Также сами страницы, разделы и подразделы лучше придумать заранее, чтобы не мучить разработчиков и верстальщиков по ходу развития проекта.

Можно создать интеллект-карту с корректной визуализацией получившейся структуры. Допустим, мы делаем сайт, посвященный электрогитарам и музыке в целом. Примерная схема контента может выглядеть так:

  • Меню с основными секциями сайта, где расположен ключевой контент, за которым приходят посетители.
  • Секция с инструкциями. Здесь могут быть статьи по теме настройки или выбора инструмента (с ссылками на покупку соответствующих товаров, если мы занимаемся торговлей и имеем онлайн-магазин).
  • Секция с обзорами. Сюда можно поместить материалы аналогичного характера.
  • Утилитарные разделы. Здесь расположены пользовательские соглашения и политика конфиденциальности.
  • Секция с описаниями. Тут хранится информация о бренде, контакты и т.п.

Создание макета один из главных

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

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

Разработка сайта

Как только мы перейдем на этап разработки, у нас на руках должен быть макет дизайна сайта, все необходимые дополнительные материалы, такие как текстуры, нестандартные шрифты, изображения, тексты. Имея эти материалы мы отдаем макеты на нарезку и верстку верстальщику который в свою очередь превращает макеты в html шаблон.

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

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

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