Как посмотреть сайт «глазами» поискового робота с помощью Google Chrome

Перевод и адаптация статьи Алекса Харфорда для Moz.

В этой статье — о том, зачем и как использовать Google Chrome или Chrome Canary, чтобы узнать, как поисковые роботы видят ваш сайт.

Зачем смотреть на сайт «глазами» поискового робота Google

Раньше HTML и CSS были основными инструментами, которые использовались для создания дизайна сайтов. Веб‑серверы отправляли браузерам готовые страницы сайтов, то есть полностью сформированную HTML‑разметку.

Сейчас многие сайты формируются (рендерятся) на стороне клиента, в самом браузере. Это означает, что браузер и устройство пользователя должны выполнить работу по формированию страницы.

Что касается SEO, то некоторые поисковые боты могут не выполнять код на языке JavaScript, поэтому не смогут просматривать страницы, созданные с его использованием.

Выполнение JavaScript‑кода затрачивает очень много ресурсов, особенно по сравнению с HTML и CSS.

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

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

1. Страница, формируемая на стороне сервера и предназначенная для роботов, — Googlebot и bingbot.

2. Страница, формируемая на стороне клиента и предназначенная для пользователей сайта.

Такой подход делает сайты слишком сложными и создает больше проблем для технического SEO, чем рендеринг на стороне сервера или обычный сайт на основе одного только HTML.

По сути, техническое SEO — это создание максимально удобных сайтов для поисковых систем, чтобы они могли их просматривать, отрисовывать и индексировать для наиболее релевантных ключевых слов и тем. В будущем техническое SEO, скорее всего, будет сильно связано с языком JavaScript и будет предполагать разные варианты рендеринга веб‑страниц для ботов и пользователей.

Это и есть тема статьи. Для качественного аудита нужно посмотреть, что «видит» Google.

Можем ли мы на самом деле сымитировать поискового робота Google

Если кратко, то нет.

Робот Google использует headless‑версию браузера Chrome для рендеринга веб‑страниц. Даже с настройками, предложенными в этой статье, мы никогда не можем на 100 % увидеть страницы, как поисковый робот. Например, никакие настройки не позволяют узнать, как Googlebot обрабатывает сайты, основанные на использовании JavaScript. Иногда при выполнении JavaScript‑кода возникают ошибки, поэтому Googlebot может увидеть не то, что было задумано разработчиками сайта.

Наша цель — как можно точнее имитировать Mobile‑first‑индексирование, выполняемое поисковым роботом Google.

При аудите используется:

• настроенный под Googlebot отдельный браузер вместе со спуфингом (маскировкой) и рендерингом в Screaming Frog SEO Spider;

• инструменты Google: URL Inspection в Search Console (который можно автоматизировать с помощью SEO Spider), скриншот и код рендеринга из Mobile Friendly Test.

Даже общедоступные инструменты Google не совсем точно показывают, что видит Googlebot. Но вместе с настроенным под Googlebot браузером и инструментом SEO Spider они могут указать на проблемы и помочь в их устранении.

Зачем использовать отдельный браузер

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

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

Кроме того, между сеансами просмотра страниц легко забыть отключить маскировку под поискового робота Google, а это может привести к тому, что сайты не будут работать так, как ожидалось.

Так что удобнее использовать отдельный браузер.

Для каких SEO‑аудитов это подходит

Чаще всего SEO‑аудиты проводятся для сайтов с рендерингом на стороне клиента или с динамическим рендерингом. Вы можете легко сравнить то, что видит поисковый робот Google, с тем, что видит обычный посетитель сайта.

Но даже на сайтах, не использующих динамический рендеринг, никогда не знаешь, что можно обнаружить, замаскировавшись под поискового робота Google:

• Отличается ли основная навигационная система?

• Видит ли поисковый робот контент, который вы хотите проиндексировать?

• Если сайт полагается на JavaScript‑рендеринг, будет ли новый контент индексироваться быстро? Или он будет индексироваться настолько поздно, что его влияние снизится (например, для предстоящих акций или новых списков товаров)?

• Возвращают ли URL‑адреса разные ответы сервера? Например, некорректные URL‑адреса могут возвращать ответ «200 OK» поисковому роботу Google, но «404 Not Found» — обычным посетителям сайта.

• Отличается ли макет страницы от макета, который видит обычный посетитель сайта? Например, замаскировавшись под поискового робота Google, часто можно наблюдать ссылки с синим цветом шрифта и черным фоном. Хоть машины и могут читать такой текст, хотелось бы, чтобы контент выглядел удобным для поискового робота Google.

• Выполняют ли сайты редиректы в зависимости от местоположения клиента сайта? Поисковый робот Google в основном сканирует сайты с IP‑адресов, расположенных в США.

Как настроить браузер, чтобы он имитировал поискового робота Google

Настройка займёт около 30 минут.

Cкачайте и установите Chrome или Canary

Если Chrome не выбран в качестве браузера по умолчанию, используйте его в качестве браузера для маскировки под поискового робота Google.

Если Chrome выбран в качестве браузера по умолчанию, то загрузите и установите Chrome Canary.

Canary — это версия Chrome для разработчиков, в которой Google тестирует новые функции. Её можно установить и запустить отдельно от версии Chrome, выбранной в качестве используемой по умолчанию.

❗️Поскольку Canary — это версия Chrome для разработчиков, Google предупреждает, что он «может работать нестабильно»:

Установите расширения для браузера

Установите пять расширений:

• User‑Agent Switcher;

• Web Developer;

• Link Redirect Trace;

• View Rendered Source;

• букмарклет NoJS Side‑by‑Side.

User‑Agent Switcher

Это расширение переключает User‑Agent браузера, как понятно из названия. В Chrome и Canary есть настройка пользовательского агента, но она применяется только к используемой вкладке и сбрасывается, если вы закрываете браузер.

Берите строку User‑Agent поискового робота Google из настроек последней версии браузера Chrome (именно из Chrome, а не из Canary!).

Чтобы получить User‑Agent, откройте в Chrome инструменты разработчика одним из трёх способов:

• нажав F12 или комбинацию клавиш «Ctrl + Shift + I»;

• кликнув правой кнопкой мыши и выбрав в меню пункт «Просмотреть код»;

• воспользовавшись меню‑гамбургером в правом верхнем углу окна браузера→ «Дополнительные инструменты» → «Инструменты разработчика».

Вот что надо сделать далее:

1. Перейдите на вкладку Network.

2. На вкладке Network щёлкните по меню‑гамбургеру, расположенному в правом верхнем углу, а затем выберите More tools → Network conditions.

3. Перейдите на вкладку Network conditions, которая появится в нижней части окна.

4. Снимите флажок с пункта «Использовать браузер по умолчанию».

5. Выберите Googlebot Smartphone из списка ниже, затем скопируйте строку User‑Agent из поля под списком и вставьте её в список, находящийся в настройках браузерного расширения User‑Agent Switcher.

Не забудьте переключить Chrome обратно на пользовательский агент по умолчанию, если это ваш основной браузер.

Та же самая инструкция в картинке:

Чтобы получить доступ к списку браузерного расширения User‑Agent Switcher for Chrome, щёлкните правой кнопкой мыши по его значку на панели инструментов браузера и выберите Options (см. скриншот ниже).

Indicator Flag — это текст, который появляется на панели инструментов браузера, чтобы показать, какой User‑Agent был выбран. Выбираем GS, что означает Googlebot Smartphone:

Web Developer

Web Developer — это браузерное расширение, которое должно быть у каждого специалиста по техническому SEO. Он нужен для включения и отключения JavaScript, чтобы посмотреть, что Googlebot может увидеть с JavaScript и без него.

Про другие рекомендуемые расширения

Благодаря расширению Link Redirect Trace можно сразу увидеть, какой ответ возвращает сервер по какому‑либо URL‑адресу.

Расширение View Rendered Source позволяет легко сравнивать исходный HTML, который передается браузеру веб‑сервером, и отрендеренный HTML, то есть код, который отображается в браузере на стороне клиента.

Также я добавил букмарклет NoJS Side‑by‑Side в свой браузер, маскирующийся под поискового робота Google. Он сравнивает веб‑страницы с включенным и выключенным JavaScript в одном и том же окне браузера.

Настраиваем имитацию Google‑бота в браузере

Теперь мы изменим настройки браузера, руководствуясь тем, какие возможности поисковый робот Google не поддерживает при сканировании сайта.

Вот о чём речь:

• сервис‑воркеры. Люди, переходящие на страницу из поисковой выдачи Google, возможно, посещают эту страницу впервые, поэтому нет смысла кэшировать данные для последующих посещений;

• запросы на разрешение каких‑либо действий, например на отправку push‑уведомлений, использование веб‑камеры или определение географического положения посетителя сайта. Если контент зависит от любого из этих запросов, поисковый робот Google не увидит этот контент;

• файлы cookie, сессионное хранилище, локальное хранилище и IndexedDB. Поисковый робот Google не запоминает состояние при сканировании страниц сайтов. Данные могут храниться в этих механизмах, но будут удалены перед тем, как поисковый робот Google перейдёт к следующему URL‑адресу на сайте.

Шаг 1. Настройте инструменты разработчика Google Chrome

Откройте инструменты разработчика в Chrome или Canary способами, описанными выше.

Шаг 2. Отключите кэширование

Если вы используете обычный Chrome в качестве браузера для маскировки под поискового робота Google, то вы, возможно, уже отключили кэширование.

В противном случае в меню «Инструментов разработчика» выберите пункты «Дополнительные инструменты» → «Состояние сети» и отметьте галочкой параметр «Отключить кэш»:

Шаг 3. Запретите использование сервис‑воркеров

Чтобы запретить использование сервис‑воркеров, перейдите на вкладку «Приложение», затем в раздел Service Workers и отметьте галочкой параметр «Обходной путь для сети»:

Шаг 4. Настройте браузер

В браузере, выбранном для маскировки, перейдите в «Настройки» → «Конфиденциальность и безопасность» → «Файлы cookie и другие данные сайтов» (или сразу зайдите на chrome://settings/cookies) и выберите вариант «Заблокировать все файлы cookie (не рекомендуется)»:

Также в разделе «Конфиденциальность и безопасность» выберите «Настройки сайтов» (или зайдите на chrome://settings/content) и по отдельности заблокируйте «Геоданные», «Камера», «Микрофон», «Уведомления» и «Фоновая синхронизация»:

Эмулируем мобильное устройство

Наконец, поскольку наша цель — эмулировать сканирование с приоритетом на мобильный контент, нужно эмулировать мобильное устройство в браузере.

В левом верхнем углу инструментов разработчика нажмите на переключатель панели инструментов устройства (кнопка с изображением телефона и планшета), затем выберите устройство, которое нужно эмулировать (можно добавить и другие устройства):

Какое бы устройство вы ни выбрали, поисковый робот Google не прокручивает веб‑страницы, а отображает полную страницу — длинную, с большой высотой.

А если у вас есть доступ к реальным мобильным устройствам, тестируйте просмотр прямо на них. И десктопную версию тоже нужно тестировать.

Готово. Теперь вы видите страницы сайта так, как их видит поисковый робот Google.

Выводы

Использование существующего браузера для эмуляции поискового робота Google — это самый простой метод быстрого просмотра веб‑страниц под видом поискового робота Google. Кроме того, он не требует финансовых затрат, если вы уже используете ПК, на который можно установить Chrome и/или Canary.

Есть и другие инструменты, помогающие увидеть то, что видит Google. Автор советует тестировать такие инструменты от Google, как Vision API (для работы с изображениями) и Natural Language API.

Аудит сайтов, основанных на JavaScript, особенно когда в них используется динамический рендеринг, может оказаться сложным процессом, и браузер для маскировки под поискового робота Google — один из способов упростить этот процесс.

Что ещё почитать:

• Инструменты ленивого SEO‑специалиста: 10 расширений браузера, упрощающих рутину

• Всё об алгоритме Google: как думает поисковая система