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

Глава 4. Этапы разработки сайта

На форуме по поиску работы:

– Всем привет! Я разработчик сайтов и в данный момент свободен для любых проектов! Если вам нужен сайт-визитка, одностраничник (лэндинг), или интернет-магазин, – пишите, – с удовольствием помогу вам с вашими проектами. Скидку гарантирую!

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

Анекдот из сети Интернет

В этой главе:

1. Предварительные этапы

2. Прототип

3. Веб-дизайн страниц

4. Дизайн мобильной версии

5. Подготовка дизайна сайта к вёрстке

6. Вёрстка и реализация сайта, наполнение контентом

7. Запуск сайта

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

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

Этапы разработки сайта:

1. Консультация со специалистом. Покупка домена.

2. Составление технического задания на сайт.

3. Изучение темы.

4. Анализ сайтов конкурентов.

5. Создание базы образцов сайтов (ссылки, скриншоты и дизайн целиком).

6. Составление структуры сайта (внутренней и внешней).

7. Прототип сайта.

8. Веб-дизайн.

9. Подготовка дизайна сайта к вёрстке.

10. Вёрстка сайта на конструкторе или передача веб-дизайна программисту.

11. Наполнение сайта контентом.

12. Проверка сайта на ошибки, запуск сайта.

1. Предварительные этапы

Консультация

Все начинается с первой бесплатной консультации, в ходе которой заказчик общается с проектировщиком сайта и задаёт вопросы о сроках, стоимости работ, составлении технического задания и выясняет, что нужно для создания сайта от клиента. Проектировщик (разработчик сайта) подробно объясняет клиенту, как будут идти работы над сайтом, какие сроки нужны для реализации проекта и что понадобится от заказчика (информация о сайте, подготовка контента, оплата этапов работы и т.д.).

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

Сбор семантики для SEO

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

Приобретение доменного имени

Что нужно от заказчика в первую очередь, еще до разработки прототипа и сайта:

Предоставить ксерокопию своего паспорта для приобретения доменного имени сайта. Клиент может купить домен сам и просто прислать его название проектировщику сайта. Но если клиент не разбирается в регистрации домена, за него это сделает разработчик сайта или веб-дизайнер. Клиент высказывает пожелания, в какой доменной зоне он хочет сайт (ru, com, org, рф, рус и т.д.), и пишет возможные названия сайта.

Разработчик сайта проверяет незанятые (свободные) доменные имена на сайте хостинга, например, webnames.ru. Из нескольких свободных имен клиент выбирает то, что более всего ему нравится, после этого разработчик сайта оформляет на него домен, в анкете домена прописав контактные данные своего клиента.

Оформление доменного имени производится на персону заказчика (физлицо) или на фирму клиента (юрлицо). Ни в коем случае не следует разработчику оформлять домен на своё лицо и потом вымогать у клиента деньги за его продление. Это в целом унижает профессию «Разработчик сайтов».

Рис.29. Проверка домена перед регистрацией

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

Проверить владельца домена можно на общедоступном сервисе проверки доменных имён whois.ru. См. рис. 31.

Рис. 30. Анкета владельца домена

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

Рис.31. Проверка сведений о домене

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

Составление технического задания (брифа)

Бриф является следующим предварительным этапом. Разработчик сайта отправляет клиенту техническое задание (не заполненное). Это необходимо для того, чтобы более точно и полно понять ожидания клиента, цели создания сайта, увидеть примеры дизайна, уточнить все детали по функционалу сайта и контенту. А клиенту надо заполнить шаблон брифа с вопросами. Его желательно заполнить как можно подробнее, – это позволит избежать досадных недоразумений на этапе проектирования и разработки сайта.

Заполненное техническое задание (бриф) даёт возможность оценить объём, срок и примерную стоимость работ. Нельзя приступать к разработке дизайна без технического задания. Иногда веб-дизайнер (или проектировщик сайта) помогает клиенту заполнить бриф. Подробнее об этом этапе будет написано в следующей главе.

После заполнения технического задания идет обсуждение деталей будущего сайта с заказчиком. Когда все вопросы решены (в том числе и по оплате работы), – следует подписание договора с двух сторон: со стороны разработчика сайта и его заказчика. Техническое задание является неотъемлемой частью договора.

Оплата идет в соответствии с договором: это может быть предварительная полная оплата, частичная предоплата и пост-оплата по факту создания сайта. Чаще всего используется вариант оплаты: 50% до начала работ, 50% – после.

Изучение темы и анализ сайтов конкурентов

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

После изучения темы сайта идёт анализ сайтов