Марина, репетитор, потратила вечер в конструкторе: шаблон «не про неё», форма так и не подключилась. Скачала Cursor после обещания «лендинг за 15 минут», открыла программу – и зависла: Agent или Chat, React или HTML, куда жать дальше. Итог знаком многим: красивый код, белая страница без стилей, на телефоне всё уехало влево, а ссылку в интернет некуда вставить. Ниже – один вечер, простые файлы index.html + css, рабочая форма и публичный URL без команды разработчиков.
Cursor – это редактор, где вы описываете страницу словами, а не правите теги руками. Для первого лендинга берите только HTML и один CSS-файл, без npm и React. Правила проекта храните в `.cursor/rules/landing.mdc`, а не в устаревшем `.cursorrules` – иначе Agent их проигнорирует. Черновик по свежим гайдам занимает 15–30 минут, доведение до заявок – ещё 2–6 часов. Публикация бесплатно: Vercel Drop (перетащить папку) или GitHub Pages.
Запрос «создать лендинг ии» – 136 показов в месяц в Яндекс Вордстате, «cursor ai сайт» – 179. Люди ищут не студию за 80 000 ₽ и не Tilda за 1 500 ₽/мес, а способ быстро проверить оффер. Cursor на тарифе Hobby бесплатен: ограниченный Agent и Tab, без карты. Этого хватит на каркас страницы и пару правок, если не гоняться за идеальным дизайном в первую ночь.
Соберите бриф: оффер, пять блоков и критерий «готово»
Типичная ошибка – открыть Agent с фразой «сделай красивый лендинг». ИИ выберет React, Tailwind и package.json – а вам нужна одна страница, которая открывается двойным кликом по index.html. На практике десять минут брифа экономят час переделок.
Запишите в блокнот:
- оффер в одном предложении (кому и что даёте);
- аудитория (возраст, город, боль);
- пять блоков: hero, проблема, решение, отзыв или цифра, форма;
- текст кнопки («Записаться», «Оставить заявку»);
- критерий готово: публичный URL + тестовая заявка на почту.
Делайте: один документ на русском, без «сделай как Apple». Не делайте: просить «современный стек» – Agent утащит в Next.js.
Установите Cursor и зафиксируйте правила в .cursor/rules
Скачайте Cursor с cursor.com, выберите план Hobby. Создайте пустую папку, например `my-landing`, и откройте её через File → Open Folder. Сюда же попадут все файлы страницы – вы владеете ими, в отличие от закрытого конструктора.
Surprising, но важный момент из официальной справки Cursor (2026): файл `.cursorrules` в корне помечен как legacy. В Agent-режиме ограничения надёжнее писать в `.cursor/rules/landing.mdc` с `alwaysApply: true`. На форуме пользователи подтверждают: правила в корне Agent Chat часто не читает.
Пример содержания landing.mdc (скопируйте смысл, Agent поможет оформить файл):
Правила лендинга:
Только plain HTML5 + один файл styles.css. Без React, Vue, npm, package.json, Tailwind CDN. Русский язык. Адаптив: meta viewport, кнопки min-height 44px. Структура: hero, проблема, решение, отзыв, форма.
Дублируйте эти же ограничения в первом промпте – двойная страховка для новичка.
Сгенерируйте каркас через Agent Mode без npm
Agent (режим агента) – это когда Cursor сам создаёт и правит несколько файлов по вашему заданию. Chat только советует текстом; для первого лендинга нужен именно Agent или Composer (Cmd+I / Ctrl+I). Откройте Agent и вставьте промпт со структурой из брифа плюс фраза «Do NOT add package.json or npm scripts».
Схема первого вечера:
Бриф в блокноте → Open Folder → правила в .cursor/rules → промпт в Agent → принять diff → открыть index.html в браузере → правки plain language → повтор
- Шаг 1: Убедитесь, что в папке только `.cursor` и будущие html/css – без node_modules.
- Шаг 2: Запустите Agent, вставьте бриф и список блоков.
- Шаг 3: Примите изменения по файлам index.html и styles.css.
- Шаг 4: Откройте index.html в Chrome или Edge (правый клик → Open with).
- Шаг 5: Если страница белая – проверьте, не добавил ли Agent React; удалите лишнее и повторите промпт с запретом фреймворков.
- Шаг 6: Второй промпт: «замени lorem на тексты из брифа, добавь meta viewport».
На форуме Cursor non-dev пользователь собрал сайт за ~8 часов с обучением. Реалистично: каркас за вечер, полировка – на следующий день.
| Критерий | Cursor AI (HTML/CSS) | Tilda / конструктор |
|---|---|---|
| Владение файлами | Папка на диске, можно перенести куда угодно | Страница живёт внутри сервиса |
| Стоимость старта | Hobby $0, хостинг Vercel Drop $0 | Бесплатный тариф с брендингом или от ~1 500 ₽/мес |
| Порог входа | Нужен текстовый бриф и терпение к diff | Drag-and-drop, но формы и домен часто платные |
| Мобилка | Нужен отдельный промпт и ручная проверка 375px | Шаблоны часто адаптивны из коробки |
Итоговый вердикт: Tilda быстрее для «красиво сразу». Cursor выгоден, если нужен свой HTML, бесплатный хостинг вне экосистемы и привычка описывать правки словами – как в гайде по Cursor для автоматизации.
Подключите форму заявки без backend и программиста
Форма – главная точка, где ломаются новички. HTML сам по себе не отправляет письма на сервер: нужен action. Три простых пути:
- Formspree – регистрируетесь, получаете URL вида formspree.io/f/xxxx, вставляете в action формы;
- Netlify Forms – если деплоите через Netlify;
- mailto: – временный вариант, хуже для аналитики, но работает за минуту.
Попросите Agent: «Добавь form с method POST, action на Formspree, поля имя, телефон, labels на русском». Отправьте тестовую заявку и проверьте папку «Спам». Делайте: тест сразу после генерации. Не делайте: кнопку без action – она красивая, но мёртвая.
Проверьте превью, мобилку и мини-SEO перед публикацией
Локальный просмотр – двойной клик по index.html, не localhost с npm run dev. Plain HTML не теряет стили, в отличие от React/Tailwind без сборки.
Чек-лист мобилки (DevTools → Toggle device toolbar → ширина 375px):
- текст не обрезан, кнопки нажимаются пальцем;
- нет горизонтальной прокрутки;
- контакты и оффер видны без десяти скроллов.
Мини-SEO: один title, meta description, один H1, alt у картинок. Подробнее – в материале про GEO-оптимизацию сайта.
Опубликуйте бесплатно: Vercel Drop или GitHub Pages
Цель – ссылка вида https://ваш-проект.vercel.app, а не localhost. Самый простой путь для новичка – Vercel Drop на vercel.com/drop: перетащите папку с index.html и styles.css, получите URL за минуту. Без Git, без терминала.
- Шаг 1: Убедитесь, что index.html лежит в корне папки, css подключён относительным путём.
- Шаг 2: Откройте Vercel Drop, перетащите папку.
- Шаг 3: Дождитесь деплоя, откройте выданный URL в режиме инкognito.
- Шаг 4: Отправьте ссылку себе в Telegram и откройте с телефона.
- Шаг 5: Альтернатива – GitHub Pages: залить файлы в репозиторий, включить Pages в настройках.
Можно попросить Agent подготовить папку под Vercel Drop. GitHub-шаблоны напоминают: без проверки 375px мобилка развалится.
Запустите чек-лист: скорость, UTM и что делать дальше
Критерий успеха простой: в браузере по публичной ссылке видны оффер, блоки услуги, кнопка «Оставить заявку», форма шлёт данные, на телефоне читаемо. Пройдите финальный чек-лист:
- форма – тестовая заявка пришла;
- мобилка – 375px без «уехало влево»;
- скорость – сжатые картинки, без тяжёлых видео на фоне;
- контакты и короткая политика конфиденциальности;
- UTM-метки на кнопках для рекламы (?utm_source=vk&utm_medium=ads).
Hobby Cursor хватит на сессию «каркас» и «правки». Pro – $20/мес, если планируете серию страниц.
Что дальше: подключите аналитику (Яндекс Метрика), протестируйте оффер на узкой аудитории, затем масштабируйте через автоматизацию. Если хотите связать Cursor с Make.com и контент-воронкой – загляните на курс Make.com и вайбкодинг (159+ уроков, первые занятия для новичков). Образец SEO-статьи под блог – в разборе SEO-формата (B01, href после публикации на mayai.ru).
Материал проверен: Артур Хорошев (CEO Maya AI, автор курса по Make.com и вайбкодингу).
Достоверность данных: тарифы Hobby/Pro и правила `.cursor/rules` сверены с cursor.com/pricing и cursor.com/help/customization/rules; Vercel Drop – с vercel.com/docs/deployments; сроки черновика 15–30 мин и доработки 2–6 ч – vc.ru/ai/2944503; частотность «создать лендинг ии» (136) и «cursor ai сайт» (179) – Яндекс Вордстат, 18.06.2026.
Частые вопросы
Как создать лендинг самому бесплатно с ИИ?
Установите Cursor (Hobby), соберите HTML/CSS в Agent, подключите Formspree, опубликуйте папку через Vercel Drop. Домен можно подключить позже – для теста гипотезы хватит бесплатного URL.
Cursor AI как пользоваться бесплатно для сайта?
Тариф Hobby без карты: ограниченный Agent и Tab. Одной-двух сессий хватает на одностраничник, если держать стек простым и не просить сложные фреймворки.
Чем Cursor отличается от Tilda для первого лендинга?
Tilda быстрее визуально, но страница живёт в сервисе. Cursor даёт файлы на диске и бесплатный статический хостинг – удобно, если нужен контроль и переносимость.
Почему страница белая без стилей?
Часто Agent добавил React/Tailwind и вы открыли проект через npm run dev без сборки. Вернитесь к plain HTML + один css, открывайте index.html напрямую в браузере.
Нужно ли знать HTML, чтобы править тексты?
Нет. Описывайте правки в Agent plain language: «замени заголовок hero на …», «увеличь кнопку на мобилке». Код правит Cursor, вы проверяете результат в браузере.
Куда уходят заявки с формы?
На email через Formspree или Netlify Forms – настройте action в форме и отправьте тест. Без action кнопка ничего не отправит.
Сколько времени до первых заявок?
Черновик – 15–30 минут, публикация и мобилка – ещё 2–6 часов по честным оценкам рынка. Трафик и заявки зависят от оффера и рекламы, не только от сборки страницы.
