В сегодняшней теме затрону разные режимы парсинга в Screaming Frog и особенно учет JavaScript, а также о том, как это учитывается в поисковых системах, особенно в Яндексе.
Если вам больше нравится видео формат, то этот же материал изложен в видео ниже:
Возможности "лягушки"
В лягушке есть все необходимые возможности для парсинга. Можно решить кучу нестандартных задач.
Например, когда сайт только в разработке и висит лишь форма авторизации, с помощью лягушки можно успешно авторизоваться и спарсить все что нужно внутри этого сайта.
Поисковые системы через форму авторизации не смогут проиндексировать сайт, потому что получат код ответа 403. А мы таким образом сможем успешно пропарсить сайт и исправить ошибки (провести любые работы). И только потом отправлять сайт на продакшн в презентабельном и SEO-оптимизированном виде.
Настройки
Давайте для начала пройдемся по базовым настройкам программы. Переходим в Configuration >> Crawl Config
Перед парсингом я всегда включаю гуляние бота по nofollow ссылкам.
Если вы хотя бы раз анализировали логи сайта, то по-любому заметили, что роботы поисковых систем гуляют по любым ссылкам, несмотря на атрибуты и директивы “nofollow”. Гуглу по сути все равно, стоят эти запреты или нет. Поэтому я всегда ставлю эту галочку, чтобы парсер охватил все ссылки.
Если сайт огромный, скажем, миллион страниц, то может быть не стоит включать. Разные есть способы… Можно парсить по разделам, в таком случае.
Следующая настройка находится здесь: Configuration >> User Agent
Я всегда включаю User Agent смартфоновский: Googlebot (Smartphone). Наверное, ни для кого не секрет, что роботы Гугла сейчас в основном используют сканирование сайта со смартфонов. Это можно подтвердить в Google Search Console:
Здесь почти всегда указывается робот для смартфонов. Если вдруг у вас указан не смартфон, то вероятнее всего сайт еще не переведен на Mobile first. Чаще всего все-таки увидите именно смартфоновского бота.
Базовые настройки – всё. Остальное по желанию: можно сразу ставить парсинг в «JavaScript» или «Text Only» (Configuration >> Spider >> Rendering)l. Большинство обычно парсит в «Text Only».
Если не выбирать вариант сохранения результатов парсинга, то программа по умолчанию сохраняет их в оперативную память. Если сайт большой, то лучше выбрать место сохранения жесткий диск (File >> Settings >> Storage Mode).
Также можно выбрать количество потоков, если нужно ускориться. Я обычно выбираю 10 потоков или чуть поменьше. Чтобы побыстрее окончился анализ (Configuration >> Crawl Config >> Content >> Speed).
В общем, многое зависит от характеристик вашего железа. Если компьютер или ноутбук мощный, то можно достаточно быстро парсить объемные сайты.
Если вы знаете другие интересные настройки лягушки, которые используете, особенно для каких-то нестандартных случаев, обязательно пишите в комментариях. Будет интересно узнать.
Яндекс и JavaScript
Где-то с ноября-декабря 2021 года Яндекс начал по другому учитывать JavaScript. Он начал его рендерить, несмотря на то, что соответствующий раздел в Яндекс Вебмастере появился гораздо позднее. Теперь каждый вебмастер может сам выбирать как учитывать эти данные: либо рендерить, либо нет. Либо на усмотрение робота Яндекса (видимо, раньше так было).
На эту тему сейчас будет кейс. И как нам в этом может помочь лягушка.
Кейс
Знаете, есть такие уведомления от Яндекс Вебмастера, которые на почту приходят и их видно в колокольчике. Присылают, когда есть какие-то изменения у сайта, мониторинг важных страниц, тайтлы, дескрипшины и т.д.
У меня был случай, когда постоянно приходило письмо, что меняется тайтл: к нему добавляется [1]. Ну, то есть, сначала идет единичка в квадратных скобках, а потом текст тайтла. Выглядит довольно странно.
Если парсить в режиме «Text Only», то все выглядит нормально, тайтл без единички и проблема не воспроизводится. Если просто глазами смотришь код страницы – тоже ничего такого нет.
Получается, что я как SEO-специалист вижу одно (глазами и программами), но при этом робот видит другое. Это может быть не только безобидная единичка, но и более крупные изменения – например полная замена тайтл и дескрипшин. Особенно в случаях, когда Гео IP модуль может работать. В данном случае, правда, только JS. Вот так само применение JavaScript может влиять!
В общем, пошел я мучить поддержку Яндекса. Там сначала говорят стандартную фразу «Все хорошо. Развивайте сайт». Классика. Через десять или сколько-то писем я попал на кого-то, кто может уделить мне чуть-чуть внимания. Этот сотрудник попробовал разобраться, в чем тут может быть дело. После очень долгой возни прислали мне вот такое письмо:
Я открыл приложенный документ и в нем было отличающееся содержимое по сравнению с тем, что вижу я. То есть они мне прислали отрендеренный вариант с применением JS (а в лягушке я смотрел только «Text Only»). В этом документе были измененные тайтлы и дескрипшины.
Логично теперь попробовать спарсить сайт в лягушке в «JavaScript» режиме. Меняем режим и парсим. Результаты в режимах «Text Only» и в «JavaScript» сравнивать не обязательно. Можно просто JS-версии скачать лягушкой и посмотреть специальные отчеты по страницам, где изменились тайтлы или дескрипшины:
На самом деле, на вкладке JavaScript можно посмотреть много интересного. В таких отчетах и ловится всякое подозрительное.
А разницу можно отловить здесь:
Удаленное будет отмечаться красным, а добавленное – зеленым.
Смотреть не обязательно в лягушке, в браузере Chrome есть расширение «View rendered source», в котором тоже можно посмотреть страницу, разбитую на 3 столбца: изначальный html, отрендеренную версию и их различие. Очень удобно.
Поиск аномалий
Можно анализировать разные случаи. Например, сайт angular.io, сделанный почти полностью на JS. Если его спарсить, то вот здесь можно увидеть большие отличия в количестве слов:
Иногда это может говорить о какой-то аномалии. Например, есть какой-то скрытый контент, который в оригинальном HTML показываться не будет, а после учета JS он покажется.
Например, можно сравнивать и по количеству ссылок. Их тоже после рендеринга может стать больше или меньше.
Нужно учитывать различные устройства для рендеринга: мобайл и десктоп. Прокраулить их по очереди, сохранив на жесткий диск. И потом между собой сравнивать: Mode >> Compare.
В этом режиме сначала выбираем по очереди сравниваемые краулы и нажимаем Compare.
Здесь можно увидеть серьезные изменения (Change) в процентах и абсолютных единицах:
По столбцам Added/New/… можно отслеживать что изменилось. Такие серьезные аномалии нужно изучать, почему на десктопе одно, а на мобайле другое.
Советы по итогу
Если отрендерить весь HTML-код сайта при помощи JavaScript, то содержимое страницы может измениться. Это поисковые системы улавливают и сигнализируют об этом. За этим нужно следить.
Можно сразу включать в настройках лягушки Store HTML (не понял о чем речь в видео - прим.), чтобы сразу видеть различие до и после рендера. Это очень удобно.
Удобно также искать различные аномалии в текстовом анализе^ отличие слов, контента (который, возможно, не нужно индексировать), мета теги (как в кейсе), ссылки. В JS может быть запрятано второе меню для адаптива, а то и третье и четвертое меню. Это нужно выявлять и резать, чтобы не было лишнего кода.
Лягушка дает выбирать разные устройства при JS-рендеринге. По сути они отличаются только шириной экрана и нельзя выбрать кастомную ширину. Но спасибо и на этом.
Заключение
Эти новые изменения в Яндекс Вебмастере могут помочь корректно индексировать ваш сайт. Речь даже не только о сайтах целиком построенных на JS, проблемы могут возникать и на самых обычных CMS. Поэтому нужно изучать итоговый рендеринг страницы – каким ваш сайт видят поисковые системы.
SEO-спецам нужно обязательно добавлять в план работ анализ JS-кода. Это стало важной составляющей при техническом аудите сайта.