Сайт cortexit.ru: от контент-стратегии до собственного деплоя, без конструкторов

TL;DR. Сайт, который вы читаете. Собран не на конструкторе: контент-стратегия и исследование аудитории, затем дизайн-система, вёрстка на Next.js с TypeScript в строгом режиме, разметка Schema.org под AI-поисковики и деплой на собственный Ubuntu VPS через Docker и Caddy.

Ситуация: подрядчика проверяют до первого разговора

Лицо, принимающее решение, после первого касания идёт искать подрядчика в поиске. Если сайта нет или он собран на конструкторе за вечер, шанс попасть в шорт-лист падает — особенно когда предмет разговора это разработка.

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

Задача

1. Сделать сайт доказательством компетенции, а не витриной.
2. Пройти полный цикл самостоятельно: от исследования аудитории до сервера.
3. Заложить разметку, по которой сайт разбирают не только поисковые роботы, но и языковые модели.
4. Не зависеть от платформы: код и сервер под собственным контролем.

Что сделали

Работа шла фазами, каждая с собственным артефактом.

Исследование. Персоны, голос клиента, позиционирование, инвентарь доказательств — отдельные документы, а не догадки на ходу. На их основе собран мастер-план структуры страниц.

Копирайт. Полный текст, микрокопия интерфейса и раздел частых вопросов написаны до вёрстки — так структура страницы следует за содержанием, а не наоборот.

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

Вёрстка и инженерия. Next.js с React, TypeScript в строгом режиме, Tailwind, компоненты shadcn/ui. Кейсы вынесены в MDX. Формы на react-hook-form и zod с проверкой на сервере и согласием на обработку персональных данных. Тяжёлые секции подгружаются лениво.

Поисковая и AI-видимость. Разметка Schema.org для организации, персоны и статей кейсов, карта сайта, правила для роботов с явным допуском краулеров AI-поисковиков, генерация превью для соцсетей.

Деплой. Docker, systemd и Caddy на Ubuntu VPS. Своя инфраструктура, а не платформа-хостинг.

Результат

• Живой сайт на собственном коде и собственном сервере — не Tilda, не конструктор, не одноразовая генерация по промпту.
• Полный цикл пройден внутри: исследование, копирайт, дизайн-система, вёрстка, инфраструктура.
• Разметка Schema.org и правила для роботов позволяют разбирать сайт AI-поисковикам, а не только классическому поиску.
• Дизайн меняется правкой одного файла токенов — вёрстка при смене оформления не переписывается.

Ключевые технические решения

1. Токены вместо литералов в компонентах. Ни одного цвета или отступа числом внутри разметки. Смена оформления — это правка файла токенов, а не обход всех компонентов. Решение принято до вёрстки, иначе оно не работает.
2. Дизайн отложен до рабочего URL. Сначала страницы собраны на стандартных токенах и задеплоены, оформление зафиксировано после. Обсуждать дизайн на живой странице содержательнее, чем на абстрактных примерах.
3. Кейсы в MDX, а не в базе. Кейс — это текст, который редактируют. Он лежит файлом в репозитории, проходит ревью в pull request и версионируется вместе с кодом.
4. Строгий TypeScript и проверка форм на сервере. Проверка на клиенте — удобство для пользователя, а не защита. Данные формы валидируются на сервере, согласие на обработку обязательно.

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

Почему не сделать сайт на конструкторе?

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

Что даёт разметка Schema.org для AI-поиска?

Разметка описывает сущности страницы машиночитаемо: кто автор, что за организация, о чём кейс. Она не гарантирует цитирование в AI-ответах, но убирает неоднозначность при разборе страницы и остаётся основой для расширенных результатов в классическом поиске.

Что было бы дальше

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

Если вам нужна автоматизация процесса, а не сайт, — обсудим за 30 минут.