Шаблон SEO-аудита JavaScript

Проверьте страницы с JS-рендерингом, чтобы Googlebot мог надёжно сканировать, рендерить и индексировать ваш контент, ссылки и метаданные.

JavaScript позволяет создавать отличные интерфейсы, но поисковые системы ранжируют только то, что могут отрендерить и прочитать. Этот шаблон проведёт вас через аудит того, как Googlebot видит ваши страницы с JS-рендерингом, чтобы контент, ссылки и метаданные уцелели после рендеринга. Пройдите каждую проверку и фиксируйте, что на самом деле содержит отрендеренный DOM, а не только то, что есть в исходном коде.

6 готовых вариантов

Проверка рендеринга: сырой HTML против отрендеренного DOM

Подтвердите, что видит Googlebot после выполнения JavaScript, а не только начальный ответ сервера.

Сравните исходный код с отрендеренным DOM

Google сначала получает ваш сырой HTML, а затем рендерит страницу в headless-браузере перед индексацией. Поскольку рендеринг отложенный и ресурсоёмкий, он может отставать от сканирования, поэтому для индексации в конечном счёте важен именно отрендеренный результат.

Начните с просмотра сырого HTML-ответа (кода, который возвращает сервер) и отметьте, какой контент, ссылки и метаданные присутствуют до выполнения любого JavaScript. Затем осмотрите отрендеренный DOM после выполнения скриптов и сравните оба варианта.

[URL страницы] проверен
Присутствует ли ключевой контент тела в сыром HTML?
Присутствуют ли заголовки, текст и данные о товарах в отрендеренном DOM?
Присутствуют ли навигация и внутренние ссылки после рендеринга?
Присутствуют ли title, meta description и canonical после рендеринга?

Отмечайте всё, что появляется только после выполнения JavaScript. Такой контент полностью зависит от успешного рендеринга, поэтому несёт наибольший риск. Фиксируйте каждое расхождение между сырым HTML и отрендеренным DOM как проблему, которую нужно исправить.

Сканируемый контент и ссылки

Убедитесь, что основной контент и навигация используют настоящие сканируемые ссылки, присутствующие в DOM.

Используйте настоящие ссылки и контент, присутствующий в DOM

Поисковые системы переходят по ссылкам через стандартные элементы <a> с атрибутом href, ведущим на реальный URL. Ссылки, срабатывающие только через обработчик onclick, кнопку или span, обнаруживаются ненадёжно, поэтому важные страницы могут остаться несканированными.

Пройдите свои ключевые шаблоны и убедитесь, что каждая навигационная и контекстная ссылка является настоящим якорем со сканируемым href.

Главная навигация использует ссылки [a href]
Пагинация и фильтры открывают сканируемые URL
Связанные и внутренние ссылки — настоящие якоря, а не onclick
Основной контент рендерится в DOM, а не скрыт за взаимодействиями

Не полагайтесь на события клика, бесконечную прокрутку без пагинированных URL или контент, который загружается только после действий пользователя, которые Googlebot не выполняет. Если для появления контента нужно нажатие или прокрутка, считайте его рискованным и обеспечьте к нему сканируемый путь. Зафиксируйте, какие ссылки и разделы проходят проверку, а каким нужен настоящий href или присутствие в DOM.

Индексируемость: метаданные после рендеринга

Выявляйте внедрённые через JS noindex, canonical или robots, которые блокируют или ошибочно направляют индексацию.

Проверяйте отрендеренные метаданные, а не только исходный код

Директивы индексации считываются из отрендеренного HTML, поэтому JavaScript, который их внедряет или изменяет, может незаметно повлиять на индексацию страницы. Чистый исходный код всё равно может отдать noindex или неверный canonical после выполнения скриптов.

Для каждого шаблона осмотрите отрендеренный DOM и убедитесь, что сигналы индексации соответствуют вашему замыслу.

Robots meta в отрендеренном DOM: [index/noindex]
Canonical присутствует один раз и указывает на нужный URL
Нет JavaScript, подменяющего canonical на другой URL
Title и meta description принимают правильные значения после рендеринга
Hreflang и структурированные данные присутствуют там, где ожидается

Внедрённые через JS изменения noindex или canonical рискованны, потому что Google может действовать на основе отрендеренного значения. Особенно осторожно относитесь к фреймворкам или менеджерам тегов, которые переписывают элементы head. Если директива может меняться между сырым и отрендеренным состоянием, считайте это дефектом и задавайте её на стороне сервера. Регистрируйте отрендеренные директивы каждой страницы и любые расхождения.

Стратегия рендеринга: CSR против SSR против SSG

Выберите подход к рендерингу, который делает контент надёжно доступным для сканеров.

Выберите стратегию рендеринга, способствующую сканированию

Способ рендеринга определяет, насколько надёжно контент доходит до поисковых систем. Поскольку рендеринг у Google отложенный, стратегии, отдающие контент в начальном HTML, снижают риск.

Клиентский рендеринг (CSR): браузер строит страницу из JavaScript. Контент полностью зависит от успешного рендеринга, поэтому несёт наибольший риск индексации.
Серверный рендеринг (SSR): сервер возвращает полностью сформированный HTML на каждый запрос. Контент, ссылки и метаданные присутствуют сразу.
Статическая генерация сайта (SSG) или пререндеринг: HTML строится заранее или отдаётся из пререндер-слоя, что делает контент надёжно доступным с высокой производительностью.

Для важных для SEO страниц отдавайте предпочтение SSR, SSG или пререндерингу, чтобы контент был в начальном HTML. Оставьте тяжёлый CSR для областей за аутентификацией или с низкой SEO-ценностью.

Задокументируйте текущий подход для каждого шаблона, создаваемые им пробелы и целевую стратегию.

Шаблон: [название]
Текущий против целевого метода рендеринга

Влияние JavaScript на производительность

Уменьшите вес и стоимость выполнения JS, чтобы страницы рендерились быстро для пользователей и сканеров.

Сократите стоимость JavaScript

Тяжёлый JavaScript замедляет рендеринг для пользователей и добавляет работы, которую должны выполнить поисковые системы, чтобы отрендерить ваши страницы. Поскольку рендеринг ресурсоёмкий, более лёгкие страницы рендерятся надёжнее и загружаются быстрее, что поддерживает и удобство, и индексацию.

Проверьте, сколько скриптов отдаёт каждый ключевой шаблон и что они блокируют.

Выявлены большие или неиспользуемые бандлы JavaScript
Скрипты, блокирующие рендеринг, отложены или разделены, где возможно
Критичный контент не заблокирован за медленным выполнением скриптов
Сторонние скрипты проверены на вес и необходимость
Core Web Vitals проверены на ключевых шаблонах

Отдавайте предпочтение разделению кода, удалению неиспользуемого кода и более позднему подключению некритичных скриптов, чтобы основной контент появлялся быстро. Никогда не блокируйте файлы JavaScript или CSS в robots.txt, так как это мешает Google рендерить страницу так, как её видят пользователи. Зафиксируйте размеры бандлов, блокирующие ресурсы и исправления, которые планируете для каждого проверенного шаблона.

Тестирование и мониторинг

Проверяйте рендеринг реальными инструментами и следите за ним через Search Console со временем.

Протестируйте отрендеренную страницу и следите за ней

Проверяйте свои исправления на том, что Google действительно рендерит. Инструмент проверки URL в Search Console показывает отрендеренный HTML и скриншот просканированной страницы, позволяя подтвердить наличие контента, ссылок и метаданных после рендеринга.

Пропустите каждый ключевой шаблон через проверку и зафиксируйте результаты.

Отрендеренный HTML в проверке URL содержит основной контент
Скриншот рендеринга показывает ожидаемый макет
Навигация и внутренние ссылки присутствуют в отрендеренном HTML
Директивы индексации корректны в отрендеренном результате
Во время рендеринга не сообщено об ошибках

Затем перейдите от разовых проверок к постоянному мониторингу.

Отслеживайте отчёты о покрытии и индексации в Search Console
Повторно проверяйте после значительных изменений фреймворка или шаблона
Следите за страницами, выпадающими из индекса

Регистрируйте каждый протестированный URL [URL], его статус рендеринга и любые дальнейшие действия, чтобы проблемы выявлялись рано, а не после падения позиций.

Как использовать этот шаблон

Составьте список важных для SEO шаблонов (главная, категория, товар, статья) и выберите по одному репрезентативному URL каждого для аудита.
Просмотрите сырой HTML-ответ для каждого URL и отметьте, какие контент, ссылки, title, meta description и canonical присутствуют до выполнения JavaScript.
Осмотрите отрендеренный DOM после выполнения скриптов и сравните его с сырым HTML, отмечая всё, что появляется только после рендеринга.
Убедитесь, что основной контент есть в DOM и каждая навигационная и контекстная ссылка является настоящим якорем со сканируемым href, а не обработчиком onclick.
Проверьте отрендеренные метаданные для каждой страницы, подтвердив директиву robots, единственный правильный canonical и отсутствие JavaScript, внедряющего сюрпризы с noindex или canonical.
Просмотрите стратегию рендеринга для каждого шаблона (CSR, SSR, SSG или пререндер) и отдавайте предпочтение серверному или пререндеренному HTML для важных для SEO страниц.
Пропустите каждый URL через инструмент проверки URL в Search Console и просмотрите отрендеренный HTML и скриншот, чтобы подтвердить наличие контента, ссылок и директив.
Зафиксируйте выводы и исправления для каждого шаблона, убедитесь, что robots.txt не блокирует JavaScript или CSS, и настройте мониторинг в Search Console для повторной проверки после изменений.

Советы

Считайте отрендеренный DOM источником истины для SEO, потому что Google индексирует отрендеренную страницу, а не только сырой HTML, который ваш сервер возвращает сначала.
Задавайте критичные сигналы индексации, такие как canonical и директивы robots, на стороне сервера, поскольку JavaScript, который внедряет или изменяет их после рендеринга, рискован и в нём легко ошибиться.
Никогда не запрещайте файлы JavaScript или CSS в robots.txt, иначе Google не сможет отрендерить ваши страницы так, как их видят пользователи, и контент может быть пропущен.
Повторно запускайте проверку URL на ключевых шаблонах после любого обновления фреймворка или изменения шаблона, поскольку поведение рендеринга может измениться и незаметно сломать индексацию.

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

Может ли Google индексировать контент, отрендеренный с помощью JavaScript?

Да. Google может выполнять JavaScript и индексировать контент, появляющийся в отрендеренном DOM. Однако рендеринг отложенный и ресурсоёмкий, поэтому может произойти позже сканирования. Всё, что появляется только после выполнения JavaScript, зависит от успешного рендеринга, поэтому серверный или пререндеренный HTML надёжнее для важного для SEO контента.

В чём разница между сырым HTML и отрендеренным DOM?

Сырой HTML — это начальный ответ, который возвращает ваш сервер до выполнения любого JavaScript. Отрендеренный DOM — это страница после того, как скрипты выполнились и изменили её. Googlebot получает сырой HTML, затем рендерит страницу и индексирует то, что видит в отрендеренном результате. Аудит означает сравнение обоих, чтобы вы знали, какой контент действительно доходит до индекса.

Почему мои ссылки должны быть настоящими тегами якоря?

Поисковые системы обнаруживают URL и переходят по ним через стандартные элементы якоря, содержащие href, ведущий на реальный URL. Ссылки, работающие только через обработчик onclick, кнопку или span, сканируются ненадёжно, поэтому страницы за ними могут так и не найтись. Всегда делайте важные навигационные и контентные ссылки настоящими сканируемыми якорями в DOM.

Почему внедрённые через JavaScript теги noindex или canonical могут быть проблемой?

Google считывает директивы индексации из отрендеренного HTML, поэтому директива, добавленная или изменённая JavaScript, может вступить в силу, даже если исходный код выглядит нормально. Скрипт, внедряющий noindex или переписывающий canonical на неверный URL, может деиндексировать или ошибочно направить страницу. Задание этих сигналов на стороне сервера избегает сюрпризов между сырым и отрендеренным состояниями.

Какая стратегия рендеринга лучше всего для SEO?

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

Как подтвердить, что именно рендерит Googlebot?

Используйте инструмент проверки URL в Google Search Console. Он показывает отрендеренный HTML и скриншот того, как Google просканировал страницу, поэтому вы можете убедиться, что контент, внутренние ссылки и директивы индексации присутствуют после рендеринга. Также убедитесь, что robots.txt не блокирует JavaScript или CSS, и повторно проверяйте страницы после изменений шаблона или фреймворка.