Как стать автором
Обновить

Процесс разработки сайта в картинках

Время на прочтение2 мин
Количество просмотров15K
Три наших персонажа: программист, дизайнер и клиент.


Шаг 1: Обсуждение

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

Шаг 2: Мозговой штурм

Подумайте о том, как вы будете разрабатывать продукт. Что важно, а что – нет? Что должно быть на каждой странице? В зависимости от размера проекта, вам может потребоваться создать визуальную карту сайта. Подготовка карты сайта важна и для правильной организации информации.

Шаг 3: Каркасы

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

Каким способом вы будете создавать каркасы – решать вам. Для небольших проектов можно сделать изображения в Photoshop или Illustrator. Для более крупных могут понадобиться каркасы в формате HTML, на которых можно проверить поведение.

Шаг 4: Планирование контента

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

Шаг 5: Первоначальный дизайн

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

Шаг 6: Отзыв клиента

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

Шаг 7: Доработка дизайна

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

Шаг 8: Согласование

Пока все довольны.

Эта цепочка «разработка – согласование – доработка» может повторяться на различных этапах проекта. Помимо подготовки информации, утверждение промежуточных результатов является еще одной функцией клиента.

Шаг 9: Дизайн дополнительных страниц и элементов

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

Шаг 10: Утверждение

И вновь все проверяется, дорабатывается и, наконец, утверждается.

Шаг 11: Создание HTML

Теперь можно приступить к созданию HTML-страниц.

Шаг 12: … и CSS

Шаг 13: Презентация

И снова обратная связь с клиентом.

Шаг 14: Тестирование

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

Шаг 15: Запуск

На картинке написано «Конец» – но, конечно, вы не возьмете чек и не скроетесь за дверью. После запуска за сайтом нужно посмотреть еще дней 10 или около того, и в случае возникновения проблем исправить их.

Перевод оригинала тут.
Оригинал тут.
Теги:
Хабы:
Всего голосов 144: ↑135 и ↓9+126
Комментарии87

Публикации

Истории

Ближайшие события

27 августа – 7 октября
Премия digital-кейсов «Проксима»
МоскваОнлайн
19 сентября
CDI Conf 2024
Москва
20 – 22 сентября
BCI Hack Moscow
Москва
24 сентября
Конференция Fin.Bot 2024
МоскваОнлайн
25 сентября
Конференция Yandex Scale 2024
МоскваОнлайн
28 – 29 сентября
Конференция E-CODE
МоскваОнлайн
28 сентября – 5 октября
О! Хакатон
Онлайн
30 сентября – 1 октября
Конференция фронтенд-разработчиков FrontendConf 2024
МоскваОнлайн
3 – 18 октября
Kokoc Hackathon 2024
Онлайн