Проверка соотношения кода и текста на странице

Соотношение кода и текста: почему это сигнал качества

Code-to-text ratio — процент видимого текста относительно общего объёма HTML-кода страницы. Напрямую метрика не входит в факторы ранжирования Google или Яндекса, но косвенно говорит о многом: достаточно ли на странице контента, не раздута ли вёрстка, быстро ли загрузится страница. Низкое соотношение — частый симптом страниц, которые плохо ранжируются не сами по себе, а из-за вытекающих проблем.

Нормальные значения

Здоровый диапазон — 15–25%. Это ориентир для контентных страниц: блоги, статьи, описания товаров и услуг. Лендинги и главные страницы часто имеют меньше — 8–12% — и это нормально, если там много визуала и мало текста по задумке. Значение ниже 10% на контентной странице — тревожный сигнал: либо слишком тонкий контент (thin content), либо вёрстка перегружена лишним кодом.

Чем грозит низкое соотношение

Раздутый HTML увеличивает размер страницы и время до первого байта (TTFB), ухудшает показатели Core Web Vitals — LCP, INP, CLS. Google учитывает скорость загрузки в ранжировании, особенно на мобильных. Низкое соотношение также означает, что поисковому роботу нужно разбирать больше кода ради того же объёма полезного текста — это неэффективно с точки зрения краулингового бюджета.

Основные причины раздувания

• Inline-атрибуты style на элементах и inline-скрипты прямо в разметке
• Устаревшая табличная вёрстка или избыточные обёртки <div>
• Лишние пробелы, переносы строк и комментарии в продакшн-коде
• Тяжёлые SVG-иконки, встраиваемые в HTML вместо подключения через спрайт
• Трекинг-пиксели и рекламные скрипты, дублированные по странице

Как улучшить ratio

Первое — минификация HTML, CSS и JS на продакшне: убирает лишние пробелы и комментарии. Вынесите стили и скрипты во внешние файлы — браузер закеширует их между переходами. Сократите число оболочек: современный CSS (Flex, Grid) решает большинство задач без пяти уровней <div>. Проверьте тяжёлые трекеры через DevTools → Network — часть из них можно загружать лениво после первого взаимодействия.

Когда низкий ratio — норма

Для SPA-приложений и интерактивных дашбордов низкое соотношение естественно: контент рендерится на стороне клиента через JavaScript после загрузки. В этом случае показатель не репрезентативен — важнее проверять, что поисковики видят финальный рендер. Используйте URL Inspection в Search Console или серверный рендеринг (SSR) для критичных страниц.

Чек-лист: что проверить

• Ratio выше 15% на контентных страницах (блог, статьи, карточки товаров)
• HTML минифицирован на продакшне — без комментариев, без лишних пробелов
• Нет inline-атрибутов style и inline-JS в <script> прямо в разметке
• Стили и скрипты вынесены во внешние файлы и закешированы
• Основной контент обёрнут в семантические теги: <main>, <article>, <section>
• Размер HTML-документа — не больше 100–150 КБ
• Тяжёлые трекеры и рекламные скрипты загружаются лениво, а не в первом рендере