Мой блог весит 5KB на главной, CSS уместился в одном файле, JavaScript почти отсутствует. Google это замечает - и это не случайность.
Проблема
Среднестатистический сайт весит больше двух с половиной мегабайт - по данным HTTP Archive. WordPress-блог добавляет к этому скрипты, шрифты, трекеры - и общий вес страницы легко уходит за три мегабайта. Next.js-блог тянет React runtime, hydration, chunk-файлы - даже если на странице только текст и пара ссылок. Каждая лишняя секунда загрузки отталкивает пользователей: люди уходят раньше, чем видят контент.
Core Web Vitals - три метрики Google: LCP (когда загружается главный контент), INP (как быстро страница отвечает на взаимодействие), CLS (прыгает ли контент при загрузке). Они напрямую влияют на ранжирование. Значительная часть сайтов их не проходит.
Есть ещё одна проблема. Многие современные сайты невидимы для AI-поиска - ChatGPT, Claude, Perplexity. Причина простая: контент спрятан в JavaScript. Эти инструменты не рендерят JS - они читают HTML. Если твой value proposition грузится клиентским скриптом, для AI-краулера тебя не существует.
Почему минимальный HTML/CSS работает для SEO
Браузер строит цепочку: HTML → DOM → CSS → CSSOM → Render Tree. CSS блокирует отрисовку. Пока файл не загружен полностью, первый пиксель не появится. Большой CSS с сотнями неиспользуемых правил тормозит всё - и на каждом этапе можно потерять время.
У меня 213 строк CSS в одном файле. Без Tailwind, без Bootstrap, без сброса стилей на несколько экранов. Системный шрифт - браузер берёт его из операционной системы, никаких запросов к Google Fonts. Max-width 640px, mobile-first.
Googlebot обрабатывает первые два мегабайта сырого HTML. Всё что за этой границей - ссылки, структурированные данные, footer - может быть обрезано. Для Hugo-блога это не проблема: страница весит десятки килобайт. Для WordPress или Next.js с десятком chunk-файлов - уже актуально.
JavaScript добавляет отдельный слой сложности. Google умеет его читать через headless Chromium - но ресурсы ограничены. Страницы стоят в очереди на рендеринг, и не все проходят её в разумные сроки. Soft 404 в SPA, контент за lazy-load без разметки, shadow DOM в Web Components - реальные случаи, когда контент индексируется частично.
Мой блог работает иначе: HTML содержит весь контент сразу, и Googlebot получает полный текст статьи в первом ответе сервера.
Конкретные решения
Семантический HTML. Не div-суп, а структурная семантика: <header>, <nav>, <main>, <article>, <footer> - каждый элемент несёт смысл. Одна <h1> на странице, ссылки через <a href> вместо <div onclick>. Google читает отрендеренный HTML - если React-компонент <Header> выводит <div>, поисковик видит div.
Минимальный CSS. Мой файл покрывает типографику, навигацию, блоки кода и несколько служебных классов. Браузерные дефолты неплохие - CSS нужен чтобы добавить читаемость, не починить сломанное.
Я отказался от тёмной темы через JavaScript - это убрало целый класс проблем. Тёмный режим работает через одну строку:
html { color-scheme: light dark; }
Браузер сам выбирает цветовую схему по системным настройкам. Никакого localStorage, никаких event listener, никакого мигания при загрузке. Минус примерно 45 строк CSS и один JS-файл из сборки.
Static Site Generation. Hugo собирает блог менее чем за секунду. Деплой через Docker с nginx:alpine - лёгкий контейнер, минимум поверхности атаки. TTFB стабильный, серверного кода нет, базы данных нет.
Структурированные данные. JSON-LD для BlogPosting прямо в HTML - без JavaScript, без отложенной загрузки. Google видит схему в первом ответе.
Аналитика. Umami с атрибутом defer - единственный JS на сайте. Загружается после отрисовки, ничего не блокирует.
Мифы, с которыми сталкиваешься
“Google не может читать JavaScript.” Устаревший миф. Google рендерит JS через Chromium. Но практические ограничения остались: очередь рендеринга, таймауты, проблемы с fragment routing. Консенсус среди SEO-специалистов - server-side rendering надёжнее.
“Статический сайт - это скучно.” Christian Praß описал в своём блоге переход с React и TailwindCSS на минимальный HTML. Результат - Lighthouse 100 и страница в несколько килобайт. Это не девяностые, это осознанный выбор 2024 года.
“Нужна интерактивность.” Большинство блогов не нуждаются в сложной интерактивности для основного контента. CSS умеет :hover, :focus, :checked для переключателей, анимации, даже примитивный accordion. Нужно больше - vanilla JavaScript в несколько строк. Ещё больше - framework island на конкретный компонент. Основной контент при этом остаётся статичным HTML.
“Без фреймворка нельзя поддерживать CSS.” Типичная ситуация: проект использует Bootstrap или Tailwind, а реально задействует малую часть доступных классов. Современный CSS с Grid и Flexbox сокращает объём стилей - и код становится понятнее, не сложнее.
Next.js для блога - как грузовик для поездки за хлебом. Мощный инструмент, но задача не требует этой мощности. Тяжёлый стек часто отражает не сложность задачи, а привычку.
Что это даёт
Хорошие Core Web Vitals - прямое следствие лёгкой страницы. LCP низкий потому что нечего грузить. INP низкий потому что нет тяжёлых обработчиков событий. CLS нулевой потому что нет динамически вставляемых блоков.
Полная видимость для AI-поиска - сразу, без дополнительных усилий. Контент в HTML читают не только Googlebot, но и все AI-краулеры.
Мой блог ifonin.ru - практическая проверка этих принципов. Homepage 5KB, ноль запросов к внешним шрифтам, один CSS-файл. Метрики стабильны, поддержка минимальна.
Если хочешь попробовать: Hugo строится из одного бинарника, GitHub Pages хостит бесплатно, Umami - опционально. Сложно не техническое. Сложно выбросить привычку тянуть фреймворк туда, где достаточно двух тегов и трёх строк CSS.