Как создать сайт с помощью ИИ: бесплатно, по шагам и где нейросеть ломается

Создать сайт с помощью ИИ можно без знания кода: вы описываете словами, что нужно, конструктор вроде Lovable или Bolt.new собирает страницу и публикует её по ссылке. Лендинг или визитка получаются за вечер. Трудности начинаются с формами, базой данных и оплатой: там агент чаще ошибается, а вам сложнее понять, что сломалось.

Какой сайт реально собрать без кода?

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

Мне как-то нужно было провести собеседование с дата-аналитиком. Вместо того чтобы искать песочницу для задачки на SQL, я сделал свою за 15 минут в Replit. Маленькая задача, понятный результат, никаких жёстких требований: идеальный случай.

А веб-версию старого стартапа на готовом бэкенде я с агентом мучил примерно 10 дней, и багов всё равно хватало. Разница в сложности задачи, и её стоит оценить до старта.

Конструктор или агент на компьютере?

Первый сайт собирайте в конструкторе: он работает в браузере и ставить ничего не нужно. Агентов вроде Claude Code или Codex, которые работают на вашем компьютере, оставьте на потом. Чем они отличаются и сколько стоят, я свёл в одну таблицу в сравнении ИИ для вайбкодинга.

Как создать сайт с помощью ИИ: по шагам

1. Решите, что это за сайт

До задания ответьте себе: кто зайдёт на сайт, что он должен сделать (позвонить, записаться, оставить заявку) и какие нужны разделы. Эту часть нейросеть за вас не сделает. Если вы не знаете, чего хотите, агент придумает сам, и придумает не то.

2. Напишите задание, которое можно проверить

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

Сделай одностраничный сайт барбершопа «Борода» в Казани.

Блоки сверху вниз:
1. Первый экран: название, слоган «Стрижка за 40 минут», кнопка «Записаться».
2. Услуги: стрижка 1500 руб., борода 900 руб., комплекс 2200 руб.
3. Мастера: три карточки с фото, именем и стажем.
4. Отзывы: три коротких отзыва.
5. Контакты: адрес, телефон, карта.

Кнопка «Записаться» открывает чат с администратором в Telegram: t.me/boroda_kazan.
Стиль: тёмный фон, светлый текст, один акцентный цвет, без градиентов.
Сайт должен нормально выглядеть на телефоне.
Не добавляй регистрацию, личный кабинет и базу пользователей.

Запись через ссылку на мессенджер, а не через форму, тут не случайна. Форме нужно куда-то складывать заявки, а это уже база данных и сложная часть, о ней ниже. Для первого сайта ссылки хватает.

Последняя строчка задания тоже нужна. Агенты любят делать то, чего не просили. У меня агент на фронтовом приложении завёл свою базу данных и локальную авторизацию, хотя в требованиях их не было. Из-за этого падала сборка, и человек не из разработки вряд ли понял бы почему.

3. Правьте по одному изменению

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

4. Пройдите сайт как посетитель

Откройте сайт с телефона и нажмите всё, что нажимается. «Записаться» должна открыть именно ваш Telegram, телефон должен звонить, карта показывать ваш адрес, а не офис в Москве из примера.

5. Опубликуйте

В Lovable это кнопка Publish справа вверху: сервис даёт адрес вида название.lovable.app, а следующие правки выкладываются через Publish changes. Для визитки на старте такого адреса хватит. Свой домен подключается в Project Settings, раздел Domains, и требует платного тарифа, в Bolt.new тоже.

Можно ли создать сайт с помощью ИИ бесплатно?

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

Что делать, когда агент ходит по кругу

Вот ситуации, в которые новичок попадает в конструкторе чаще всего, и что писать агенту.

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

Появилась красная ошибка. Скопируйте её текст целиком и отправьте с фразой: «вот ошибка, объясни простыми словами, в чём причина, и только потом исправляй».

Правка сломала то, что работало. Напишите: «верни сайт к версии до последней правки», а потом повторите правку меньшим куском.

Агент добавил то, чего не просили: вход, личный кабинет, базу. Напишите: «убери регистрацию и базу, сайт должен работать без них». И добавьте эту строчку в исходное задание, чтобы не повторилось.

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

Тридцать сообщений об одной ошибке подряд почти всегда значат, что задача сложнее, чем кажется. Остановитесь и разбейте её на шаги поменьше.

Когда без кода уже не хватает

Вы упёрлись в потолок, если:

• нужна запись с базой и админкой, где видно все заявки;
• нужна оплата на сайте;
• на борьбу с ошибками уходит больше времени, чем на сам сайт.

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

Вывод

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