Этапы создания сайта: что происходит на каждом и сколько это занимает

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

Короткий ответ: шесть этапов, и первый не дизайн

Большинство студий начинают с вопроса «какой дизайн вам нравится?». Мы начинаем по-другому. Потому что сайт, сделанный без исследования спроса, похож на магазин с красивой витриной, но на улице без прохожих.

Вот все шесть шагов по порядку:

1. Исследование спроса. Что ищут ваши клиенты, сколько запросов, какие из них стоят отдельной страницы.
2. Структура. Карта сайта: какие разделы, какие страницы, как они связаны между собой.
3. Прототип и дизайн. Черновые макеты блоков, потом визуальное оформление.
4. Вёрстка и техническая настройка. Код, скорость загрузки, адаптация под телефон, SSL.
5. Контент. Тексты, фотографии, карточки услуг.
6. Запуск. Подключение аналитики, регистрация в Яндекс Вебмастере, первые замеры.

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

Этап 1: исследование спроса, а не бонус в конце

Первый этап отвечает на вопрос: «Что ваши клиенты ищут в Яндексе прямо сейчас?» И сколько раз в месяц они это делают.

Мы собираем запросы через Яндекс Вордстат (бесплатный инструмент Яндекса, который показывает частоту поисковых запросов). Для одного автосервиса, например, выгружаем 200–400 запросов: «замена масла», «ремонт подвески», «развал-схождение», «замена ГРМ» и ещё полторы сотни вариантов.

Потом группируем похожие запросы в кластеры. Кластер, если просто, это пачка запросов, на которую отвечает одна страница. «Замена масла цена», «поменять масло в двигателе», «сколько стоит замена масла» попадут в один кластер. Одна страница, один заголовок, один ответ.

Сколько занимает: от 3 до 7 рабочих дней. Зависит от количества услуг.

Что получаете на выходе: таблицу «запрос, частота, кластер, будущая страница». Можно открыть и посмотреть самому, что за сайт будет.

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

Этап 2: структура, страница на каждый кластер

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

Принцип простой: один кластер запросов равно одна страница. Если у вас 25 кластеров, в структуре будет 25 страниц плюс главная, контакты и «о компании». Итого 28–30.

Каждая страница получает свой заголовок (из реального запроса, а не «из головы»), свой URL и своё место в меню. Мы рисуем древовидную схему: главная сверху, разделы ниже, страницы услуг ещё ниже.

Здесь же решаем, какие страницы ссылаются друг на друга. Это называется перелинковка. Яндекс учитывает ссылки внутри сайта при ранжировании, поэтому продумываем их заранее, а не после запуска.

Сколько занимает: 2–3 рабочих дня.

Что получаете на выходе: карту сайта в виде таблицы или схемы. Каждая строчка: URL, заголовок H1, какие запросы закрывает. Можно пройтись глазами и увидеть весь будущий сайт.

Для бизнеса с десятками услуг (автосервис, медцентр, стоматология) структура определяет всё. Одна детейлинг-студия пришла к нам с одностраничником. За два месяца выстроили структуру, написали контент, и в поиске оказались 65 страниц. Каждая отвечала на свой запрос и приводила своего клиента.

Этап 3: прототип и дизайн, где здесь экономят

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

Зачем он нужен? Чтобы до дизайна договориться о содержании. Если заказчик скажет «а давайте добавим блок с отзывами и передвинем прайс наверх», переделывать серый прототип в десять раз дешевле, чем готовый дизайн.

Где экономят. Прототип делают для 2–3 шаблонов: главная, страница услуги, страница «о компании». Остальные страницы повторяют один из шаблонов. Отрисовывать 30 уникальных макетов нет смысла.

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

Сколько занимает: прототип 3–5 дней, дизайн 5–7 дней. Итого около двух недель, если без долгих согласований.

Скажу честно: самые затяжные проекты буксуют именно на дизайне. Заказчик неделю думает, потом просит «сделать как у конкурента», потом передумывает. Если хотите уложиться в сроки, дайте подрядчику референсы (примеры сайтов, которые нравятся) ещё до начала этапа. И выделите одного человека на согласование, а не пятерых.

Этап 4: вёрстка и техническая настройка

Вёрстка превращает картинку-макет в работающий сайт. Верстальщик (или фронтенд-разработчик) берёт утверждённый дизайн и пишет код: HTML, CSS, JavaScript.

На этом же этапе настраивают технические вещи, которые влияют на позиции в поиске:

• Адаптация под телефон. Больше половины людей ищут услуги с мобильного. Если сайт криво выглядит на телефоне, Яндекс понижает его в выдаче. Проверить можно бесплатно в PageSpeed Insights от Google.
• Скорость загрузки. Тяжёлые картинки, лишние скрипты, неоптимизированный код. Всё это тормозит сайт. Пользователь ждёт три секунды и уходит к конкуренту.
• SSL-сертификат. Замочек в адресной строке браузера. Без него Яндекс и Google помечают сайт как «небезопасный». Получить можно бесплатно через Let's Encrypt.
• Метатеги. Title и description для каждой страницы. Сниппет в поиске формируется из них. Если метатеги пустые, Яндекс выдёргивает случайный кусок текста со страницы, и выглядит это некрасиво.
• Разметка schema.org. Специальный код, который объясняет роботу, где на странице цена, адрес, часы работы, рейтинг. Благодаря ему в поиске появляются звёздочки, цены и расширенные описания.

Сколько занимает: 5–10 рабочих дней. Сложные сайты с калькуляторами и личными кабинетами, понятно, дольше.

Мы несколько раз видели обидную картину: дизайн отличный, а после вёрстки всё «поплыло». Кнопки налезают на текст, картинки грузятся по 10 секунд, на телефоне вообще каша. Проверяйте промежуточный результат на тестовом сервере, а не после запуска.

Этап 5: контент, кто его пишет и сколько это занимает

Контент в данном случае означает тексты, фотографии, иконки, видео. Всё, чем наполняются страницы сайта.

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

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

Фотографии. Свои лучше стоковых. Реальные фото мастерской, кабинета, команды вызывают больше доверия, чем улыбающиеся модели с фотобанка. Яндекс это тоже учитывает: уникальные фото индексируются лучше.

Сколько занимает: параллельно с вёрсткой, 1–2 недели. Если тексты пишете вы сами, закладывайте больше. По нашему опыту, владельцы бизнеса тянут с текстами дольше всего. Понять можно: у вас и без сайта дел хватает.

Этап 6: запуск, Вебмастер, замеры

Сайт готов, проверен на ошибки, загружен на хостинг (сервер, где он будет жить). Домен подключен, SSL работает. Дальше:

1. Регистрация в Яндекс Вебмастере. Это бесплатный инструмент Яндекса, который показывает, какие страницы вашего сайта попали в поиск, есть ли ошибки и какие запросы приводят людей. Без него вы слепой: не видите, что происходит.
2. Отправка карты сайта (sitemap.xml). Файл-указатель для роботов. В нём перечислены все страницы, которые нужно проиндексировать. Робот Яндекса читает этот файл и знает, куда заглянуть.
3. Подключение Яндекс Метрики. Бесплатный счётчик: сколько людей зашло, откуда пришли, что делали на сайте. Без метрики невозможно понять, работает сайт или нет.
4. Первый замер. Через 2–4 недели после запуска смотрим, сколько страниц попало в поиск. По каким запросам сайт показывается. Какие страницы получают переходы.

Сколько занимает: сам запуск 1–2 дня. Ожидание индексации (когда Яндекс заберёт страницы в свою базу) от одной до четырёх недель. Это зависит от Яндекса, ускорить нельзя. Можно только ничего не сломать.

На одном нашем проекте детейлинг-студия после запуска за два месяца набрала 65 страниц в поиске и более 10 000 показов. Но первые две недели казалось, что ничего не происходит. Нормальная ситуация: Яндексу нужно время, чтобы «присмотреться» к новому сайту.

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

Что должно быть зафиксировано на бумаге до старта

По нашему опыту, 80% конфликтов между заказчиком и подрядчиком случаются из-за того, что «мы по-разному это понимали». Поэтому до начала работы стоит прописать:

• Количество страниц с перечнем тем. Если в договоре написано «сайт», а не «сайт из 28 страниц по списку», возможно всё.
• Этапы с промежуточными сроками. Не «сайт за 2 месяца», а «исследование к 15-му числу, прототип к 25-му, дизайн к 5-му следующего месяца».
• Формат сдачи каждого этапа. Исследование: таблица запросов. Прототип: ссылка на макет в Figma. Вёрстка: тестовый сервер, где можно кликать. Так вы понимаете, что именно принимаете.
• Кто пишет тексты. Если подрядчик, то на основе чего: бриф, интервью, запись разговора? Если вы, то к какой дате и в каком формате?
• Кто готовит фотографии. Свои фото? Фотобанк? Если нужна съёмка, это отдельная строка бюджета.
• Порядок правок. Сколько итераций правок входит в стоимость. Что считается правкой, а что «новым дизайном».

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

Что нельзя писать в договоре: конкретные позиции к дате

«Гарантируем выход в топ-3 Яндекса по 10 запросам к 1 марта». Такие обещания встречаются в коммерческих предложениях, и выглядят они убедительно. Проблема: это обман.

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

Добросовестный подрядчик может гарантировать объём работ: «сделаем 30 страниц, каждая оптимизирована под свой кластер запросов, структура и метатеги по стандартам Яндекса». Результат зависит от качества работы, но конкретную позицию к конкретной дате гарантировать нельзя. Никто не может.

Если подрядчик обещает «топ-1 за месяц», он либо не понимает, как работает поиск, либо понимает, но говорит то, что вы хотите услышать. Оба варианта одинаково опасны.

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

Частые вопросы

• Сколько этапов в создании сайта?

  Шесть основных: исследование спроса, проектирование структуры, прототип и дизайн, вёрстка и техническая настройка, написание контента, запуск и подключение аналитики. Первый этап (исследование) часто пропускают, а именно он определяет, будет ли сайт приносить клиентов из поиска.
• Сколько времени занимает создание сайта?

  Для небольшого бизнеса (до 30–40 страниц) от 4 до 8 недель. Около недели уходит на исследование и структуру, неделя на прототип, неделя-две на дизайн и вёрстку, параллельно пишется контент. Запуск и настройка аналитики занимают пару дней.
• Что должно быть в договоре на создание сайта?

  Количество страниц с перечнем тем, этапы с промежуточными сроками, формат сдачи каждого этапа (мокап, тестовый сервер), кто пишет тексты, кто готовит фотографии, порядок правок. Главное: никаких гарантий конкретных позиций к конкретной дате.
• Можно ли пропустить этап исследования спроса?

  Технически можно, но тогда сайт рискует остаться без посетителей из поиска. Без исследования спроса нельзя понять, какие страницы нужны, какие заголовки использовать и на какие запросы отвечать. Результат: красивый сайт, на который никто не приходит.
• Кто должен писать тексты для сайта?

  Два варианта. Первый: подрядчик пишет сам на основе брифа и интервью с владельцем бизнеса. Второй: владелец пишет черновики, а подрядчик дорабатывает под поиск. Первый вариант быстрее, второй точнее по деталям услуг.
• Можно ли гарантировать выход в топ Яндекса?

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