Методичка · заказные сайты под ключ

Сайт под ключ: от идеи до запуска

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

11
этапов — от стратегии до роста
4
фазы: подготовка · сборка · SEO и право · рост
10
типичных «граблей», на которых уже наступали

Как пользоваться курсом

1

Отмечайте пунктыКликните по строке — галочка встанет, а прогресс сохранится в браузере и синхронизируется со страницами этапов.

2

Разбирайте этапыПод каждым этапом — кнопка «Разобрать подробно»: зачем, как пошагово, пример, грабли и инструменты.

3

Не понятен термин?Внизу есть «Словарь» — все сокращения расшифрованы простыми словами.

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

1ФазаПодготовка
00

Бриф и стратегия

До единой строчки кода. Здесь решается, на что вообще будет работать сайт.

Разобраться и собрать

  • Бизнес клиента.Что продаёт, кому, средний чек, маржа, география.
  • Главное целевое действие.Заявка / звонок / оплата — всё на сайте работает на него.
  • Семантика по группам.Брендовые / узкие коммерческие / широкие конкурентные: разные сроки выхода в топ и разные страницы.
  • Конкуренты в выдаче.Что у них в топе по целевым запросам: объём текста, блоки, чего не хватает.
  • Позиционирование и тон.Например: премиум, тёмно-синий с золотом, личный бренд вместо безликого агентства.
  • Сырьё от клиента.Реальные фото/видео «с производства», цены, отзывы, частые вопросы. Живой контент бьёт стоковый всегда.
Разобрать этап подробно →
01

Структура сайта

Карта страниц и логика связей — каркас, на который сядет всё остальное.

Спроектировать

  • Карта страниц.Главная + посадочная под каждую услугу + хабовые страницы под крупные запросы + «О нас» + контакты.
  • Одна страница = один интент.Не дублировать смысл двух страниц — каннибализация просаживает обе.
  • ЧПУ-адреса.Латиница, по ключу (/tesla-shou.html, /detskiy-prazdnik.html).
  • Перелинковка.Страницы услуг ссылаются друг на друга и на хаб; хлебные крошки на подстраницах.
  • Состав каждой страницы.H1 с ключом, оффер, выгоды, программа/состав услуги, цены, FAQ, отзывы, призыв + форма.
Разобрать этап подробно →
02

Контент

Тексты и медиа решают и конверсию, и SEO. Объём — по топу выдачи, без воды.

Наполнить

  • H1 — один на страницу.С главным ключом и гео.
  • Объём коммерческой страницы.Ориентир 600–900 слов (по топу): «что входит», «для каких случаев», «где проводим», «от чего зависит цена».
  • FAQ-блок 5–8 вопросов.Каждый вопрос ловит свой длинный запрос.
  • Страница «О нас» — не отписка.Личность, история, цифры (лет на рынке, проектов). Это E-E-A-T и доверие.
  • Публиковать цены (хотя бы «от»).Без цен растут отказы.
  • Реальные фото и видео, никакого стока.Видео живых эмоций — сильнейший конверсионный элемент.
  • Закрепить первоисточник.Сразу после публикации — переобход URL + «обход по счётчикам Метрики» в Вебмастере: скорость индексации защищает авторство. (Раздел «Оригинальные тексты» Яндекс закрыл в 2020-м.)
Разобрать этап подробно →
2ФазаСборка
03

Дизайн и конверсия

Каждый экран ведёт к заявке. Мобильный — в приоритете.

Заложить в макет

  • Первый экран.Оффер + выгода + кнопка действия, видны без скролла на мобильном.
  • Мобильная версия — приоритет.70–80% трафика с телефонов. Проверять на реальном устройстве, не только в DevTools.
  • Многошаговая форма / квиз.Вместо «простыни» полей — выше конверсия.
  • Несколько каналов связи.Кликабельный телефон и форма — в первую очередь. Из мессенджеров — российские (MAX, VK Мессенджер); Telegram как дополнительный. WhatsApp в РФ — только через VPN, не делайте основным.
  • Плавающая панель / sticky-CTA.На мобильном связь всегда под рукой.
  • Элементы доверия.Отзывы, цифры, фото «как это происходит», поэтапность («от заявки до результата — 4 шага»).
  • Честный дедлайн/дефицит в оффере.«Календарь на месяц заполняется» — если это правда.
  • Декор не ломает клики.Частицы/анимации — только pointer-events:none и с проверкой на слабых телефонах.
Разобрать этап подробно →
04

Вёрстка и техническая база

Семантика, скорость и вес медиа. Здесь закладывается производительность.

Собрать правильно

  • Семантический HTML.header / main / section / footer, иерархия заголовков H1→H2→H3.
  • Шрифты — self-hosted.woff2, отдельные subsets cyrillic/latin, не Google Fonts: быстрее и стабильнее в РФ.
  • Изображения.WebP (или ещё легче — AVIF), 60–120 КБ на фото, loading="lazy", обязательно width/height — иначе скачет вёрстка (плохой CLS).
  • Видео — пережать через ffmpeg.Минус звук -an, денойз hqdn3d, CRF 28–30, +faststart. Хиро — до 3–6 МБ; видео в контенте — preload="none" + постер + controls.
  • Хиро-видео не грузить на мобильных.Постер вместо него, видео подставлять JS-ом только на десктопе.
  • Иконки.favicon (16/32), apple-touch-icon, icon-512, site.webmanifest.
  • Формы.Валидация, понятное сообщение об успехе, доставка в надёжный основной канал (почта/CRM) + дубль в мессенджер. Мессенджер единственным каналом не делать — риск потерять заявки.
  • Чистка деплоя.Убрать неиспользуемые файлы и старые версии видео: занимают место и могут попасть в индекс по прямой ссылке.
Разобрать этап подробно →
05

Домен, хостинг, инфраструктура

Сайт переезжает в интернет: адрес, место, защищённое соединение и выбор платформы.

Развернуть инфраструктуру

  • Домен в зоне .ru.Короткий и читаемый. Доверие у российских пользователей и поиска.
  • Хостинг под задачу.Для статики — простой и быстрый; для CMS — с PHP и базой. Площадка в РФ-юрисдикции для стабильности.
  • SSL-сертификат (HTTPS).«Замочек» в адресе. Бесплатно через Let’s Encrypt. Без него браузер пишет «Не защищено».
  • Почта на домене.info@вашсайт.ru — доверие и меньше спама, чем с бесплатного ящика.
  • Осознанный выбор платформы.Не конструктор по умолчанию: для скорости и SEO лучше кастомная статика (реально собрать с ИИ, напр. в Claude дизайне). CMS — если нужны частые правки силами клиента.
  • Резервные копии (бэкапы).Автокопия сайта и базы, хранить отдельно от хостинга.
  • Доступы под контролем.2FA на домен, хостинг и почту; не раздавать рут-доступ.
Разобрать этап подробно →
3ФазаSEO, аналитика и право
06

SEO-техника (on-page)

Чтобы поисковик понял каждую страницу. Делается один раз при сборке.

На каждой странице

  • Уникальный <title>.Ключ + гео + бренд, ~50–60 символов.
  • Уникальный meta description.С выгодой и цифрами (это CTR в выдаче): «10 лет, 4000+ проектов, перезвоним за 30 минут».
  • rel="canonical".Чтобы похожие страницы не считались дублями.
  • Open Graph.og:title, og:description, og:image (картинка существует и в .jpg!), og:url.

Микроразметка Schema.org (JSON-LD)

  • LocalBusiness на главной.Адрес, телефон, гео, часы работы.
  • Service / OfferCatalog.С ценами.
  • FAQPage.На страницах с FAQ.
  • BreadcrumbList.На подстраницах.
  • VideoObject.На страницах с видео (имя, описание, постер, длительность) — даёт видео-сниппет в выдаче.
  • aggregateRating — только с реальными отзывами.На внешних площадках. Фейковый рейтинг наказуем.

Служебные файлы

  • robots.txt.Доступ открыт, ссылка на sitemap.
  • sitemap.xml.Все страницы и актуальные lastmod — обновлять при каждом изменении страниц!
  • .htaccess.301 http→https, www→без www, HSTS, X-Content-Type-Options, X-Frame-Options, Referrer-Policy, кэширование статики (год для картинок/шрифтов).
Разобрать этап подробно →
07

Аналитика и сервисы поисковиков

Без счётчиков и целей реклама — деньги вслепую. Ставится до запуска трафика.

Подключить и настроить

  • Яндекс Метрика.Счётчик + вебвизор + карта кликов.
  • Цели в Метрике.Отправка формы (lead_submit), открытие формы, клик по телефону, клики по мессенджерам.
  • Яндекс Вебмастер.Добавить сайт, подтвердить права (DNS-запись — самый чистый способ), подать sitemap.
  • Google Search Console.То же самое. Но учтите: Google Ads в РФ недоступен — Google остаётся только органическим каналом.
  • Переобход после правок.В Вебмастере по изменённым URL — после запуска и крупных правок.
  • UTM-метки на все внешние ссылки.Соцсети, Авито, рассылки — иначе не понять, что приносит заявки.
  • Коллтрекинг при масштабировании.Подменные номера, чтобы атрибутировать звонки.
Разобрать этап подробно →
08

Юридический контур

Для коммерческого сайта в РФ. Закладывается в смету проекта сразу.

Оформить

  • Договор-оферта на сайте.Для физлиц: оферта + оплата = акцепт. Внутри: предмет, бронь/предоплата, переносы/отмены, ответственность, форс-мажор, требования к заказчику.
  • Политика обработки ПДн + согласие.Чекбокс согласия у форм (152-ФЗ).
  • Реквизиты ИП/ООО в подвале.Обязательный элемент доверия и закона.
  • Онлайн-касса (54-ФЗ).Приём денег от физлиц: для выездных/онлайн-услуг — облачная касса + оплата по ссылке/QR СБП, чек уходит автоматически. Переводы «на карту» — нарушение.
  • С юрлицами — другой комплект.Счёт → оплата на р/с → акт (касса не нужна). Подготовить договор, счёт, акт.
  • Уведомление в Роскомнадзор об обработке ПДн.Любой сайт с формой = оператор ПДн. С 30.05.2025 за неподачу — штраф 100–300 тыс. ₽ для ИП/юрлиц. Чекбокса с политикой недостаточно — нужно подать уведомление в РКН.
  • Защита базы заявок от утечек.С 30.05.2025 за утечку ПДн — до 15 млн ₽ (повторно — до 3% выручки), уведомить РКН за 24 часа. Не хранить базу где попало; доступы — под контролем.
Цена ошибки Приём оплат от физлиц без кассы — штраф до 30% от каждого расчёта. Кассу закладывают в смету проекта сразу, а не «потом разберёмся».
Разобрать этап подробно →
4ФазаЗапуск и рост
09

Запуск

Финальная проверка боем перед тем, как открыть сайт миру.

Проверить и выкатить

  • Скорость.PageSpeed / Метрика, цель — быстрый первый экран на мобильном.
  • Боевые отправки форм.Проверить все формы и цели Метрики реальными заявками.
  • Редиректы и карточка.301, https, отображение og-карточки (поделиться ссылкой в мессенджер).
  • Залить и заявить.Подать sitemap, запросить переобход.
  • Индексация через неделю.site:домен в Яндексе и Google, диагностика в Вебмастере («Ошибок нет»).
Разобрать этап подробно →
10

Трафик и рост

Сайт начинает работать после запуска: площадки, реклама, экономика, контент.

Разгонять

  • Яндекс Бизнес / Карты + 2ГИС.Полная карточка (категория, услуги, цены, фото), реальные отзывы — в локальных нишах обгоняет органику.
  • Каталоги и справочники ниши.Упоминания + ссылки.
  • Яндекс Директ.Старт с Поиска, узкие коммерческие ключи, жёсткие минус-слова (отсечь омонимы бренда!), точное гео, стратегия «оплата за конверсии», тестовый бюджет, через 2–3 недели — чистка по стоимости лида.
  • Ретаргетинг в РСЯ.На аудитории Метрики (был на сайте / открыл форму, но не отправил).
  • Юнит-экономика до рекламы.CPC ÷ конверсия сайта = цена заявки; ÷ конверсия в продажу = цена клиента; сравнить с прибылью. Не сходится — чинить конверсию, не лить бюджет.
  • Контентный план.Дожимать тонкие страницы до 600+ слов, по одной в неделю, с самых маржинальных запросов.
  • Ежемесячный аудит.Позиции, Вебмастер (ошибки/рекомендации), вебвизор (где стопорятся), обновление lastmod при правках.
  • Маркировка рекламы (erid/ОРД).Директ маркирует сам, но посевы у блогеров и платные размещения — ваша ответственность: регистрация в ОРД и пометка «Реклама» + erid. Плюс с 2025 — сбор 3% с доходов от интернет-рекламы.
Разобрать этап подробно →

!Грабли, на которые уже наступали

Дорого выученные уроки. Держать перед глазами на каждом запуске — это не задачи, а предупреждения.

01

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

02

Дубли страниц под один интентКаннибализируют друг друга — разводить по смыслу.

03

Аудио в фоновом видеоМёртвый вес в мегабайтах — всегда -an.

04

og:image в .webpМожет не подхватиться мессенджерами — держать .jpg.

05

Забытые старые файлы в деплоеЧистить перед заливкой.

06

«Топ-1 за неделю» не бываетБренд — сразу, узкие ключи — 1–2 мес, конкурентные — 3–6+ мес. Озвучивать честные сроки сразу.

07

Фейковые рейтинги в SchemaРиск санкций. Сначала реальные отзывы.

08

Реклама без целей в МетрикеДеньги в никуда. Цели — до первого рубля бюджета.

09

Sitemap с устаревшим lastmodПосле правок поисковик не спешит переобходить.

10

Приём оплат от физлиц без кассыШтраф до 30% от каждого расчёта. Закладывать кассу в смету сразу.

ИИ в работе над сайтом

Сегодня сайт можно не просто «ускорить» нейросетью, а собрать целиком — от макета до кода — и потом отдать ИИ на аудит. Эта методичка и сайт, для которого она написана, собраны именно так — в Claude дизайне. ИИ помогает на каждом из 11 этапов: внутри уроков ищите пометку «ИИ на этом этапе».

01

Весь сайт — в ИИ

Не только тексты: макет, вёрстка, код, формы и анимации собираются в Claude дизайне в одиночку, без команды разработчиков. Полноценный коммерческий сайт — реально.

02

Аудит и оптимизация

Готовый сайт отдают ИИ на проверку: он находит ошибки, узкие места по скорости и SEO, спорные мета-теги и битые ссылки — и предлагает правки. Этот курс правился ровно так.

03

Помощь на каждом этапе

От брифа и семантики до микроразметки и контент-плана — ИИ снимает рутину на всех этапах. В каждом уроке отмечено, чем именно он помогает.

04

Тексты: черновик ИИ, доводка руками

ИИ быстро даёт структуру и черновик. Но факты, цены и кейсы — ваши, а финальная вычитка обязательна: текст без правки рискует попасть под фильтр малополезного контента.

05

FAQ из реальных вопросов

Дайте ИИ настоящие вопросы клиентов — он соберёт чёткие ответы, которые ловят живые длинные запросы. Не выдумывать вопросы за клиента.

06

«Нулевые клики» растут

ИИ-ответы в выдаче забирают часть переходов — тем важнее карточки в Яндекс Бизнес/Картах и заявки прямо оттуда.

Принципы важнее чек-листа

01

Цель важнее красоты

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

02

Сначала спросить, потом делать

Хороший бриф экономит недели. Не уверен — уточняй, а не угадывай.

03

Мобильный — главный

Проверяй каждую правку на телефоне. Там сидит большинство клиентов.

04

Честные сроки и цифры

Никаких «топ за неделю» и фейковых рейтингов. Доверие дороже.

05

Запуск — это старт, не финиш

Сайт начинает работать после запуска: отзывы, контент, аналитика, рост.

06

Считать экономику

Реклама — только когда сходится юнит-экономика. Иначе сначала чинить конверсию.

Словарь: термины простыми словами

Если в чек-листе встретилось незнакомое слово — расшифровка здесь, без занудства.

Открыть словарьтермины
Лид / заявка
Обращение потенциального клиента: отправленная форма, звонок, сообщение в мессенджер.
Конверсия
Доля посетителей, оставивших заявку. Зашло 100, написали 3 — конверсия 3%.
Оффер
Суть предложения и главная выгода — то, что цепляет на первом экране.
CTA
Призыв к действию: кнопка «Оставить заявку», «Рассчитать», «Позвонить».
Семантика / ядро
Список реальных запросов, по которым клиенты ищут услугу в поиске.
Интент
Что человек на самом деле хочет, вводя запрос. Одна страница — один интент.
Лендинг / посадочная
Страница под одну услугу или один запрос, заточенная на заявку.
Хаб
Страница-сборник: коротко обо всём + ссылки на узкие подстраницы.
ЧПУ
«Человекопонятный» адрес: /tesla-shou вместо /page?id=12.
H1, H2, H3
Уровни заголовков на странице. H1 — главный, он один на страницу.
Title / Description
Заголовок и описание страницы, которые видно в результатах поиска.
Canonical
Пометка «вот главная версия страницы», чтобы похожие не считались дублями.
Микроразметка (Schema)
Спец-код, по которому поиск показывает звёзды, цены и вопросы прямо в выдаче.
Sitemap / robots.txt
Карта сайта и инструкция для поисковых роботов: что и где индексировать.
WebP
Современный формат картинок: то же качество, но в разы меньше вес.
CLS
«Прыжки» вёрстки при загрузке. Чем их меньше — тем выше оценка сайта.
Self-hosted
Файлы (например, шрифты) лежат на своём сервере, а не грузятся со стороны.
E-E-A-T
Как поиск оценивает качество: опыт, экспертность, авторитет, доверие.
Метрика / Вебмастер
Бесплатные сервисы Яндекса: аналитика посетителей и контроль индексации.
РСЯ
Рекламная сеть Яндекса — объявления на сайтах-партнёрах.
СБП
Система быстрых платежей — оплата по QR-коду или ссылке.
Коллтрекинг
Технология, которая показывает, с какой рекламы пришёл звонок.
Юнит-экономика
Расчёт: сколько стоит привести клиента и сколько он приносит. Должно сходиться.
SSL / HTTPS
Защищённое соединение, «замочек» в адресе. Без него браузер пишет «Не защищено».
Core Web Vitals
Метрики качества страницы: скорость первого экрана (LCP), отзывчивость (INP), стабильность вёрстки (CLS).
AVIF
Формат картинок ещё легче WebP, с уже массовой поддержкой в браузерах.
Оператор ПДн
Любой, кто собирает персональные данные — даже имя и телефон из формы. Обязан подать уведомление в Роскомнадзор.
ОРД / erid
Оператор рекламных данных и метка-идентификатор erid для маркировки платной интернет-рекламы.
Бэкап
Резервная копия сайта и базы, чтобы восстановиться после сбоя или ошибки.
MAX / VK Мессенджер
Российские мессенджеры — приоритетные каналы связи на сайте (стабильнее, чем заблокированные).

Забрали методичку? Идём дальше

Разборы, шаблоны и чек-листы — каждую неделю

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

Методичка проекта spectrumshow.ru

* Instagram принадлежит Meta, признанной экстремистской и запрещённой в РФ. Основные точки входа лучше делать в Telegram и VK.