Гайд · сайт своими руками

Как сделать сайт с нейросетью: пошагово и с файлами для ИИ

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

Claude Code · Codex · ChatGPT · Claude программировать не нужно бесплатно

Скачать перед стартом

Пакет для нейросети: SAYT.md и справочники

Главный файл — SAYT.md: по нему нейросеть ведёт проект от первого вопроса до готового сайта. Остальные десять файлов она открывает на своих шагах: дизайн, SEO, проверка, юридические документы. Распакуйте архив в папку проекта и напишите агенту Работай по SAYT.md

Скачать пакет, ZIP Только SAYT.md

• SAYT.mdГлавный файл: интервью, конкуренты, клиенты, спрос, структура, дизайн, тексты, сборка, проверка
• 02-antislop-dizayn.mdСтоп-лист «нейрослопа» в дизайне и самопроверка перед показом макета
• 03-process-dizayna.mdДизайн в четыре шага с промптами: прототип в дизайн-сервисе или картинки отдельных блоков
• 04-tz-na-dizayn-bloga.mdТЗ на дизайн блога: промпт для дизайн-нейросети и перенос макета в проект
• 05-chek-list-sborki.mdЧек-лист сборки и приёмки по девяти группам и частые грабли
• 06-seo-trebovaniya-i-razmetka.mdSEO-требования к шаблону: canonical, адреса, заголовки, скорость, микроразметка
• 07-vykat-indeksaciya.mdВыкладка на домен, проверка первого дня и подача в индекс
• 08-semantika-i-kokon.mdКак группировать запросы и связывать страницы блога вокруг разделов
• 09-yur-obraztsy.mdСогласие на обработку данных, структура политики и оферты, юридический чек-лист
• 10-geo-aeo.mdКак попадать в ответы ИИ-поиска: четыре принципа
• 00-README.mdКак пользоваться пакетом и какой файл к какому шагу

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

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

Что вообще получается у нейросети и где она ошибается, разобрано в статье «Сайт с помощью нейросети», а сколько стоит каждый путь — в «Сколько стоит создать сайт». Здесь — сам процесс и файлы для него.

01Что понадобится

Что	Зачем	Обязательно?
Нейросеть-агент: Claude Code или Codex	Проходит весь путь сама: открывает сайты конкурентов, складывает результаты файлами в папку проекта, собирает сайт и показывает его в браузере	Да, если хотите получить готовый сайт
Или чат: ChatGPT, Claude в браузере	Разведка, структура, ТЗ и готовые тексты по блокам. Сайт из них собирают в конструкторе или отдают разработчику	Вместо агента, с включённым поиском в интернете
Ключи XMLRiver и Wordstat API	Нейросеть сама снимает топ-10 Яндекса и Google и частотность запросов. Без ключей вы вбиваете запросы руками и присылаете ей результаты	Нет, ускоряют в разы
Ваши материалы	Цены или вилка цен, фото работ, документы и лицензии, адреса карточек с отзывами, частые вопросы клиентов из переписок и звонков	Да: без них нейросеть поставит заглушки
Домен и хостинг	Понадобятся на последнем шаге. До выкладки сайт живёт у вас на компьютере или на закрытом стенде	К запуску

Как получить ключи XMLRiver и Wordstat и куда их положить — в гайде SAYT.md, пошагово со скриншотами — в Wordstat API за 15 минут.

02Старт: папка проекта и интервью

1. Создайте пустую папку проекта. Для редизайна — папку с кодом действующего сайта.
2. Распакуйте в неё пакет. Ключи, если есть, впишите в файл .env в той же папке.
3. Откройте в папке Claude Code или Codex и напишите Работай по SAYT.md В чате: новый диалог, приложите SAYT.md, включите поиск в интернете и напишите Начинай

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

Самое ценное, что можно дать, — частые вопросы клиентов из переписок и звонков. Из них потом вырастут заголовки, порядок блоков и статьи блога.

Агент заводит в папке план проекта со статусами фаз. Оборвалась сессия — новая начинается словами продолжай по docs/План-сайта.md, и работа идёт с того же места.

03Разведка: конкуренты, клиенты, спрос

Этот шаг пропускают чаще всего, и именно он отличает сайт, который растёт, от аккуратной визитки. Между остановками нейросеть работает сама.

Топ-10 конкурентов

Нейросеть составляет 4–6 денежных запросов — тех, что вводят, когда готовы купить: «услуга + город», «цена», «заказать». Снимает топ-10 Яндекса и Google по каждому, отбрасывает маркетплейсы и агрегаторы и выбирает 3–5 эталонов вашего класса. Их денежные страницы она разбирает экран за экраном: какой блок, что внутри, какой тип контента, зачем он здесь. У каждой строки — адрес страницы, где это видно.

Клиенты: отзывы и портреты

Дальше 80–150 отзывов о конкурентах и о вашем бизнесе, минимум треть отрицательных: похвала у всех одинаковая, а в претензиях написано, чего человек боялся. Из них — дословные цитаты, возражения по частоте и 3–5 портретов клиентов. В каждом портрете: что случилось за день до поиска, чего человек боится (цитатой из отзыва), что должен увидеть за десять секунд и что заставит его закрыть вкладку.

Главный результат шага — порядок вопросов клиента на пути к покупке: «Это про мой случай? → Мне подойдёт? → Сколько будет стоить у меня? → Кто делает? → Покажите результат». Порядок блоков страницы потом повторяет этот порядок.

Спрос

Два набора запросов: коммерческие — под денежные страницы, информационные («как», «какой выбрать», «что такое») — под блог. Нейросеть снимает частотность с учётом региона и группирует запросы по смыслу. Правило одно: одна группа запросов — один тип страницы. Если смешать, статья начнёт забирать запрос у страницы услуги, и просядут обе.

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

04Структура сайта и каркас денежной страницы

Из разведки складывается архитектура. Нейросеть собирает:

• карту сайта: разделы, адреса латиницей через дефис, у каждой денежной страницы — главный запрос и целевое действие;
• матрицу блоков: какие блоки есть у скольких эталонов. Блок есть у большинства — обязательный, его туда поставили люди, уже проверившие выдачу деньгами;
• каркас главной денежной страницы: первый экран отвечает, что это, для кого и что сделать; дальше блоки в порядке вопросов клиента;
• дыры: чего нет ни у кого из топа — цен, калькулятора, ответа на главный страх. Через них и обгоняют;
• чего сознательно не делаем — с цифрами спроса;
• очередь первых 10–20 страниц: сначала там, где спрос есть, а топ слабый.

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

На этом же шаге нейросеть готовит два отдельных ТЗ: на сборку (страницы, блоки, мета-теги, разметка) и на дизайн. Зачем раздельно и что в каждом — в гайде Сайт с нуля с ИИ-агентом. В пакете лежит готовое ТЗ на дизайн — нейросеть заполнит его под ваш проект.

05Дизайн: как избежать «нейрослопа»

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

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

Порядок работы с дизайном:

1. Нейросеть предлагает 2–3 направления словами: на какие реальные сайты ниши похоже, палитра с ролями цветов, пара шрифтов, характер.
2. Если есть генератор картинок — рисует по одному блоку: первый экран и один денежный блок, отдельно для компьютера и телефона.
3. Вы выбираете направление. После выбора палитра и шрифты не меняются.

06Тексты и проверка портретами клиентов

Перед каждой страницей нейросеть пишет одну фразу: «эта страница помогает [кому] [что сделать]». Тексты строятся на фактах и цифрах, заголовки — из дословных цитат клиентов. Нет факта — в тексте стоит заглушка {{нет данных}}, и вы видите, что нужно дописать. Выдуманная цифра так и доехала бы до сайта.

Денежные страницы проходят проверку портретами — это фокус-группа из клиентов, описанных на шаге разведки. Каждый портрет читает страницу и отвечает от первого лица: о чём она, узнал ли себя, где споткнулся, три возражения, что сделает сейчас и насколько готов оставить заявку по шкале от 0 до 10. Нейросеть правит текст по конкретным претензиям, не больше трёх кругов.

07Сборка и проверка по чек-листу

Агент собирает сайт по этапам: одна страница → показал → дальше. Для сайта, который должен расти в поиске, по умолчанию берётся статическая генерация (Next.js или Astro): страница отдаётся готовым HTML, быстро и понятно поисковому роботу. Если вы уже на конструкторе или CMS — нейросеть работает в них. Тексты и данные лежат отдельно от кода, чтобы их можно было править без программиста.

Формы — минимум полей, понятно, что будет после отправки, две отдельные галочки согласий (обработка данных и реклама), ни одна не отмечена заранее. Тестовая заявка обязана дойти до почты, CRM или мессенджера: проверяется настоящей отправкой.

Перед показом нейросеть проходит чек-лист и отчитывается таблицей «пункт → да / нет / почему». Главное из него:

• первый экран за пять секунд отвечает: что это, для кого, что сделать;
• на телефоне главная кнопка видна без прокрутки, на ширине 360 px ничего не обрезано;
• ни одного выдуманного отзыва, цифры, кейса или логотипа клиента;
• цена одна и та же на витрине, в карточке и в разметке;
• у каждой страницы свой title и description, один H1, канонический адрес на себя;
• sitemap.xml и robots.txt отдаются, микроразметка по типам страниц;
• политика конфиденциальности и согласие на обработку данных на месте;
• счётчик аналитики стоит, цели «заявка» и «звонок» заведены до запуска.

Полный чек-лист и SEO-требования к шаблону — в пакете.

08Запуск: домен, поисковики, доступность

1. Домен и хостинг. Для статического сайта хватит недорогого хостинга или своего сервера. Агент сам подготовит инструкцию выкладки под выбранный вариант.
2. Редизайн — переадресации. Если сайт переезжает со старых адресов, перед переключением проверьте переадресацию живыми запросами. Иначе страницы, которые уже были в поиске, выпадут.
3. Вебмастер и Search Console. Добавьте сайт в Яндекс.Вебмастер и Google Search Console, отправьте sitemap.xml. Как получить к ним доступ для агента — в гайде API поисковиков.
4. Доступность. Если сайт на российском сервере, часть посетителей из-за рубежа и с VPN будет видеть его медленно. Что с этим делать — CDN для сайта.
5. Ответы нейросетей. Чтобы сайт попадал в ответы ChatGPT, AI Overviews и Яндекс Нейро — GEO-оптимизация.

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

Частые ошибки

Ошибка	Что получается	Как правильно
Начать с «сделай красивый сайт»	Визитка, которую не находит поиск и не дочитывает покупатель	Сначала конкуренты, клиенты и спрос, потом структура
Порядок блоков «о компании → услуги → контакты»	Клиент не находит ответ на свой первый вопрос и уходит	Блоки в порядке вопросов клиента
Одна страница под всё: и услуга, и статья	Страницы забирают запросы друг у друга, просядут обе	Одна группа запросов — один тип страницы
Разрешить нейросети «додумать» отзывы и цифры	Подделка на сайте и вопросы от клиентов и закона	Заглушка {{нет данных}} до настоящего факта
Дизайн по умолчанию	Градиенты и стеклянные карточки, сайт выглядит как шаблон	Стоп-лист из пакета и 2–3 направления на выбор
«Форма показала „спасибо“»	Заявки уходят в никуда, а вы узнаёте об этом через месяц	Тестовая заявка до почты или CRM перед запуском

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

Читать дальше

Все гайды рабочие: каждый — то, что реально крутится у меня, а не пересказ документации.