гайд · 5 шагов

Автор: placeholder agencyобновлено 21 августа 2026

Свой сайт за вечер — просто поговори с ИИ.

Одной перепиской в ChatGPT или Claude соберёшь простой сайт: без кода, без Claude Code и без единого коннектора.

✦ опиши, какой сайт ты хочешь…
Начать
что можно так собрать

Что можнособрать

Тем же способом (описал словами → получил HTML → выложил) собирается что угодно простое:

Визитка / портфолио

Всё о вас по одной ссылке — с проектами и контактами.

Лендинг

Одна страница под пет-проект, услугу или ивент.

Дашборд

Показать метрики и кейс — удобно на собеседовании.

Инструмент

Калькулятор, конвертер, чек-лист или таймер.

Мини-игра

Викторина или угадайка — потренироваться нестрашно.

Начать »
ChatGPT или Claude · бесплатной версии хватит Браузер 30–60 минут Свои картинки · по желанию
поехали

За 5сообщений

Каждый шаг — это просто ещё одна реплика в чате. Вот как выглядит разговор.

01

Опиши идею — и дай ИИ её разогнать

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

Хочу простой сайт-визитку про себя. Я продуктовый дизайнер, ищу работу за рубежом. Нужно: имя, короткое описание, навыки, пара проектов и кнопка «связаться». Предложи, что ещё добавить и как выстроить структуру.
✦
Отличная база! Добавил бы блок «обо мне», ссылки на соцсети и короткие кейсы с результатом. Порядок предложу такой: герой → о себе → навыки → проекты → контакты. Собираем?
02

Собери финальный промпт

Возьми подсказки ИИ, добавь своё, лишнее убери. И добавь одну важную фразу — именно она делает всё простым.

Собери всё одним самодостаточным HTML-файлом: HTML и CSS в одном месте, без фреймворков и сборщиков, чтобы просто открывался в браузере.
✦
Готово. Собрал один файл index.html — открывается двойным кликом, ничего устанавливать не нужно.
Один файл = никаких библиотек, коннекторов и настроек. Он сразу работает.
03

Покажи стиль, который нравится

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

Свежий зелёный стиль, мягкий градиент, белые скруглённые карточки, крупные заголовки. Много воздуха.скриншот-референс
✦
Считал стиль по картинке — зелёная палитра, градиентный фон, светлые карточки и крупные заголовки. Переношу на твой сайт.
!

Про картинки. ИИ вставит фото и иконки, которые ты дашь, но нарисовать уникальную иллюстрацию внутри кода не сможет. И просто ссылку на сайт он часто не открывает — референсы лучше кидать картинками.

04

Посмотри в превью, поправь, почисти

Во многих чатах (Claude, режим Canvas у ChatGPT) сайт сразу виден рядом с кодом. Смотри результат там же и правь обычными фразами — картинка обновляется на глазах.

Сделай заголовки крупнее, добавь блок с проектами и усиль зелёный акцент.
✦
Обновил: заголовки крупнее, добавил секцию проектов, зелёный акцент ярче. Глянь превью.
Отлично. Теперь почисти код: убери всё лишнее и отдай готовый файл на скачивание.
✦
Готово. Вот чистый index.html — лёгкий и аккуратный. Нажимай «Скачать».
05

Выложи в интернет через Netlify

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

1

Открой app.netlify.com

2

Перетащи файл index.html прямо в окно

3

Готово — сайт в интернете, тебе сразу выдадут бесплатную ссылку. Кидай её в резюме, LinkedIn или рекрутеру.

на заметку

Парасоветов

Держись одного файла

Один index.html проще всего править и выкладывать.

Сломалось — не паникуй

Верни код в чат и напиши, что не так. ИИ починит.

Не усложняй

Одной страницы хватит, чтобы начать. Улучшить успеешь.

Картинки — свои

ИИ их вставит, но не нарисует. Готовь визуал заранее.

✦
Навайбкодить простую страницу ты теперь умеешь.

Нужен сайт посерьёзнее?

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

Написать нам