MAX

Обратный звонок

Оставьте номер — свяжемся с вами и обсудим задачу.

SEO / Google / JavaScriptВремя чтения: 10 мин

Как проверить, видит ли Google JavaScript-контент сайта

Вы открываете страницу и видите описание услуги, товары, цены и отзывы. Но получает ли Google те же данные? Если содержимое появляется после выполнения JavaScript, привычной проверки в браузере недостаточно.

Рабочее место разработчика с кодом и отрисованной веб-страницей

На сайте может работать меню и отображаться красивый первый экран, а основной текст оставаться недоступным поисковой системе. Бывает и обратное: текста нет в исходном коде, но Google успешно получает его после выполнения скриптов. Разберем, как отличить эти ситуации и собрать понятное задание разработчику.

Как Google обрабатывает JavaScript

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

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

Пример: сервер отдает заголовок «Ремонт кофемашин», а список услуг и цены загружаются отдельным запросом. Проверка одного заголовка ничего не скажет о доступности прайс-листа. Проверять нужно именно тот блок, который появился позднее.

Поэтому вопрос «видит ли Google сайт» полезно заменить конкретным: «Есть ли в результате рендеринга описание услуги, цена и ссылки на связанные страницы?»

Исходный HTML, DOM браузера и HTML после рендеринга Google
Одна страница существует в нескольких представлениях. Для SEO важен не только ответ сервера, но и содержимое после рендеринга.

Что выбрать для проверки

Начните с нескольких типовых URL: страницы услуги, категории, карточки товара и статьи. Главная страница может работать правильно, хотя отдельный шаблон каталога теряет содержимое.

Для каждого адреса подготовьте короткий набор контрольных элементов:

  • уникальную фразу из основного описания;
  • название товара, артикул или характеристику;
  • фрагмент из нижней части страницы;
  • ссылку, которая должна вести на другой важный URL.

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

Запишите URL, время проверки, выбранную фразу и ожидаемый блок. Это позволит сравнить результаты до и после исправления без споров о том, какую версию страницы смотрели.

Исходный HTML и DOM: в чем разница

Исходный HTML - документ, полученный от сервера. DOM - структура страницы в браузере, которую JavaScript может дополнить или изменить.

В Chrome откройте инструменты разработчика, перейдите в Network и перезагрузите страницу. Выберите запрос основного документа и изучите вкладку Response. Так вы увидите ответ именно этой загрузки. Для быстрой предварительной проверки также подходит команда «Просмотреть код страницы».

Затем найдите тот же фрагмент на вкладке Elements, где отображается текущая структура документа.

  • Есть в ответе и в DOM: текст передается сервером и сохранился после запуска приложения.
  • Нет в ответе, есть в DOM: содержимое добавляется на стороне браузера; потребуется проверка рендеринга Google.
  • Есть в ответе, исчезает из DOM: изучите код, который заменяет или удаляет блок после загрузки.

Отключение JavaScript помогает понять зависимость сайта от скриптов. Но браузер с выключенным JavaScript не воспроизводит работу Google: поисковая система умеет выполнять поддерживаемые скрипты.

Сравнение текста внутри данных JavaScript и видимого HTML-элемента
Совпадение фразы в коде еще не означает, что блок появился в документе и доступен как содержимое страницы.

Проверка через Google Search Console

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

  1. Введите полный URL в инструмент проверки.
  2. Зафиксируйте статус индексирования, дату последнего сканирования и выбранный Google канонический URL.
  3. Если доступен просмотр просканированной страницы, найдите контрольную фразу в ее HTML.
  4. Запустите «Проверить опубликованную версию» или «Проверить страницу на сайте» - название зависит от интерфейса.
  5. Откройте сведения о проверенной странице, изучите HTML, скриншот, ресурсы и сообщения JavaScript.

Live-проверка выполняется инструментом Google-InspectionTool. Она показывает результат текущего теста, а не обещает идентичный результат каждого последующего обхода Googlebot.

Скриншот помогает заметить пустую страницу или сообщение об ошибке. Наличие конкретного текста проверяйте в HTML: один снимок не раскрывает весь документ.

Если текст есть сейчас, но отсутствует в доступной сохраненной версии, сопоставьте время обновления сайта и последнего обхода. Не объявляйте проблему исправленной для индекса только по текущему тесту.

Сравнение текущей live-проверки и данных последнего обхода Google
Текущая проверка и версия в индексе могут относиться к разным датам и состояниям страницы.

Что делать без доступа к Search Console

Для дополнительной проверки используйте Google Rich Results Test. Передайте инструменту публичный URL и откройте код протестированной страницы. Найдите выбранные фрагменты, изучите доступные сведения о ресурсах и ошибках.

Для этой задачи нужен тест URL. Вставка готового HTML или JSON-LD вручную не проверит, удалось ли инструменту получить необходимые данные с вашего сайта.

Сообщение об отсутствии поддерживаемых расширенных результатов само по себе не означает, что основной текст не загрузился. Наличие текста в обработанном HTML и пригодность микроразметки для расширенного результата - разные проверки. Подробнее об этом - в статье почему микроразметка проходит проверку, но расширенного результата нет.

Этот тест не сообщает, какая версия страницы уже находится в индексе. Для анализа индекса потребуется Search Console.

Почему нужный контент не загрузился

Когда в HTML после рендеринга отсутствует важный блок, сначала определите, откуда он берется. Это может быть ответ API, отдельный JS-модуль, сторонний виджет или функция, запускаемая действием посетителя.

Скрипт или запрос к данным завершился ошибкой

В Chrome откройте Network, перезагрузите страницу и проверьте запросы JS и Fetch/XHR. Посмотрите статус, содержимое Response, длительность и инициатор нужного запроса. В Console изучите ошибки выполнения.

Ответ 200 OK еще не подтверждает получение нужных данных. Например, API может вернуть пустой список или HTML-страницу авторизации. Найдите в ответе конкретную запись, из которой должен строиться отсутствующий блок.

Ресурсы недоступны при проверке Google

Проверьте ограничения robots.txt для необходимых ресурсов, правила CDN и защиты от ботов. Если локально все работает, сравните это с сообщениями инструмента Google и серверными журналами за время теста. Блокировка отдельного критического файла способна нарушить построение всей страницы.

Содержимое зависит от состояния посетителя

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

После обновления смешались версии ресурсов

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

Если при сбое данных остается практически пустая оболочка, отдельно проверьте, не появилась ли ошибка Soft 404.

Причины, по которым JavaScript-контент не загрузился
Проблему ищут в источнике блока: скрипте, API, доступе к ресурсам, состоянии пользователя и согласованности версий.

Кнопки, вкладки и бесконечная прокрутка

Google Search не взаимодействует со страницей как обычный посетитель. Не рассчитывайте, что робот нажмет «Показать еще», раскроет вкладку или выполнит нужную последовательность действий.

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

Для отложенной загрузки Google рекомендует механизмы, реагирующие на попадание элемента в область просмотра, например IntersectionObserver, и обязательную проверку результата. Не откладывайте основной контент первого экрана без необходимости.

При бесконечной прокрутке части списка должны иметь постоянные отдельные URL и доступные ссылки между ними. Откройте адрес следующей части напрямую: нужные элементы должны появиться без предварительного посещения первой страницы.

Практический пример: категория показывает 12 товаров, остальные появляются после «Показать еще». Проверяйте доступность следующих частей каталога по собственным URL, а не ожидайте загрузки всех товаров роботом на первом адресе.

Сравнение кнопки Показать еще и доступной по URL пагинации
Следующие части каталога должны открываться по постоянным URL и быть связаны обычными ссылками.

Как трактовать результаты

Наблюдение, значение и следующее действие
НаблюдениеЧто это означаетСледующее действие
В браузере текст есть, в HTML теста Google его нетПри проверке нужный блок не появилсяПроверить запрос данных, условия запуска и ошибки
Текст есть в текущем тесте, но отсутствует в доступной старой версииРезультаты относятся к разным состояниям страницыСопоставить даты и проверить результат нового обхода
Текст отрисован, URL не индексируетсяОдной отрисовкой причина не объясняетсяИзучить статус индексации, дубли и canonical
URL в индексе, но нет ожидаемых позицийИндексация не равна успешному ранжированиюОценить соответствие запросам и качество страницы

Статус «Просканирована - пока не проиндексирована» сам по себе не доказывает неисправность JavaScript. Если контент доступен, продолжайте диагностику по материалу что делать, когда Google просканировал страницу, но не проиндексировал.

Как трактовать результаты проверки JavaScript-контента
Отрисовка, индексация и позиции - разные проверки. Для каждого результата нужен свой следующий шаг.

Как исправить проблему и принять работу

Исправление должно соответствовать установленной причине. Если основной текст теряется из-за запроса после клика, увеличивать время ожидания бессмысленно. Если приложение получает ошибку API, перенос текста в другой JS-компонент не решит сбой источника данных.

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

Отдельная версия специально для роботов - dynamic rendering - создает дополнительные сложности. Google рассматривает ее как обходное решение и рекомендует более устойчивые варианты: серверный или статический рендеринг и гидратацию. При гидратации JavaScript добавляет интерактивность к уже сформированному HTML.

Составьте задание разработчику с проверяемым результатом:

  • Где: конкретный URL и шаблон, на котором воспроизводится сбой.
  • Что отсутствует: контрольная фраза, карточки или ссылки.
  • При каких условиях: первый визит, прямой переход, проверка Google, определенный релиз.
  • Что подтверждает проблему: HTML теста, ответ API, ошибка консоли или запись журнала.
  • Как принять исправление: нужный блок и ссылки присутствуют при повторных проверках без действий пользователя.

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

Чек-лист проверки JavaScript-контента после исправления
После исправления повторно проверяют контрольную фразу, HTML, DOM, тест Google, ресурсы, ссылки, canonical и несколько URL шаблона.

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

Если текста нет в исходном коде, Google его не увидит?

Не обязательно. Он может появиться после выполнения JavaScript. Проверяйте HTML после рендеринга в инструментах Google.

Нужно проверять весь сайт или достаточно главной?

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

Хватит ли хорошего результата PageSpeed Insights?

Для нашей задачи нужен другой критерий: присутствует ли конкретное содержимое в обработанном HTML. Балл скорости не заменяет эту проверку.

Можно ли по одному удачному тесту закрыть ошибку?

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

Нужно ли полностью отказываться от JavaScript?

Нет. Важно обеспечить стабильную доступность основного контента и навигации. Интерактивные функции могут продолжать работать на JavaScript.

Главное из статьи

  • Проверяйте конкретный фрагмент в HTML после рендеринга, а не только внешний вид страницы
  • Текущий live-тест и версия в индексе могут относиться к разным состояниям URL
  • Контент после клика и бесконечной прокрутки должен иметь доступный путь без действий пользователя
  • Исправление принимают по нескольким URL и повторным проверкам, а не по одному удачному тесту