Кейс: этот сайт — лендинг за 2 дня

разбор

Задача и рамки

Мне нужен был сайт, который продаёт услуги разработки и сам служит доказательством: открывается за доли секунды и свёрстан без шаблонов. Рамки жёсткие: два дня от идеи до работающего продакшена, без конструкторов и готовых шаблонов, на проверенных open-source инструментах.

День первый: дизайн и вёрстка с нуля

Первым делом текст: структура страницы — это маршрут посетителя от боли («фрилансер пропал, агентство дорого») до заявки. Дизайн собран на собственной системе токенов: тёплая палитра вместо типового «тёмного сайта разработчика», характерная типографика (Unbounded для заголовков, Onest для текста), базовая сетка с ритмом отступов. Без Bootstrap и UI-китов — чистый CSS на переменных, поэтому весь сайт позже перекрасился в светлую тему одним блоком токенов.

День второй: бэкенд формы, SEO и запуск

Форма заявок работает на собственном мини-бэкенде: Fastify в Docker на VPS, валидация, защита от спама honeypot-полем, заявки приходят в мессенджер. SEO-обвязка с первого дня: Schema.org (Person, Service, FAQPage), sitemap, Open Graph, аналитика с согласием на cookie. Вечером второго дня сайт уже отвечал по своему домену.

Почему он быстрый: цифры и методика

Сайт — чистая статика на Astro: HTML собирается заранее, браузеру не нужно ждать рендеринга на сервере или тяжёлого JS-фреймворка.

• ~0,1 секунды — ответ сервера (TTFB): медиана пяти замеров curl с холодным соединением.
• ~0,4 секунды — до отрисовки первого экрана (LCP), сдвигов вёрстки при загрузке нет. Замер вашего собственного визита показан выше — цифра не с моих слов.
• Шрифты хостятся на своём сервере с preload критичных начертаний — без обращения к сторонним CDN, которые в РФ бывают медленными.
• Изображения в WebP с fallback, ленивая загрузка ниже первого экрана.

Анимации написаны на CSS, плавный скролл добавляет Lenis — 5 КБ. Без JavaScript контент остаётся на месте: это важно и для поисковых роботов, и для доступности.

Что этот кейс говорит о работе со мной

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