JavaScript SEO: Google использует HTML до или после DOM для hreflang?

1. Удаление hreflang с сайта с помощью Google Tag Manager
2. Как Google справляется с тем, что hreflang присутствует в исходном коде HTML, но отсутствует в отображаемом HTML?
3. Вывод и перспективы

Во времена сканирования и индексации JavaScript очень важно понимать, как Google работает с двумя HTML-версиями каждой страницы веб-сайта, использующего JavaScript: pre-DOM и post-DOM HTML. Из любопытства мы настроили небольшой тест, чтобы выяснить, какая из двух версий Google использует для интерпретации аннотаций hreflang, реализованных в заголовке HTML-документа.

Если вы не знакомы с основами JavaScript SEO, или если pre-DOM и post-DOM HTML еще ничего для вас не значат, мы настоятельно рекомендуем Джастин Бриггс ' статья «Основные принципы SEO для JavaScript» часть, которую каждый, кто интересуется более технической стороной SEO, должен прочитать и переварить.

Идея этого маленького теста возникла в то время, когда мы готовили другой эксперимент, который скоро опубликуем: нам было интересно, возможно ли реализовать hreflang с помощью Google Tag Manager (Спойлер: ответ - да! ) .

Чтобы проверить это на нашем собственном сайте, searchVIU.com Прежде всего, мы должны были удалить аннотации hreflang, которые уже были на месте. Благодаря нашей технической настройке (hreflang был автоматически добавлен замечательным многоязычным плагином WordPress Polylang ), мы не нашли быстрый и простой способ удалить hreflang с нашего сайта. Поэтому мы решили просто использовать Google Tag Manager, чтобы удалить аннотации hreflang с нашего веб-сайта, прежде чем добавлять их снова (также с помощью Google Tag Manager).

Удаление hreflang с сайта с помощью Google Tag Manager

Конфигурация в Google Tag Manager для удаления всех теги hreflang Исходя из HTML-кода страницы предельно просто:

Скрипт, который вы видите на скриншоте, удаляет все элементы ссылки, имеющие атрибуты hreflang, из исходного кода HTML (совет Сэм Немзер для обмена сценариями, которые мы использовали в качестве вдохновения для этого в своем шедевре «Как реализовать SEO-изменения с помощью Google Tag Manager» ).

Эта реализация с Google Tag Manager приводит к конфликту между HTML до и после DOM: аннотации hreflang присутствуют в исходном документе HTML (pre-DOM), но отсутствуют в отображаемом HTML (post-DOM). Давайте разберем это для тех из вас, кто менее знаком с этими понятиями:

Вы можете получить доступ к HTML-коду pre-DOM страницы, щелкнув правой кнопкой мыши в браузере и выбрав «Просмотр исходного кода». На searchVIU.com , хотя этот тест все еще активен (может быть, не сейчас, в зависимости от того, когда вы читаете это) , аннотации hreflang видны в исходном HTML-документе pre-DOM каждой страницы:

В представленной HTML-версии (HTML-код после DOM), доступ к которой можно получить, щелкнув правой кнопкой мыши в браузере и выбрав «Проверка» (или эквивалентный термин, используемый вашим браузером), аннотации hreflang отсутствуют, так как они были удалены с помощью с помощью Google Tag Manager, используя JavaScript. На этом скриншоте вы видите ту же область HTML-кода, но там нет аннотаций hreflang:

Как Google справляется с тем, что hreflang присутствует в исходном коде HTML, но отсутствует в отображаемом HTML?

Если честно, мы понятия не имели, как это сработает. Будет ли Google игнорировать аннотации hreflang в источнике HTML, потому что они отсутствуют в отображаемом HTML? Мы, конечно, надеялись, что так и будет, иначе мы бы не организовали этот тест.

Простой ответ на этот вопрос заключается в том, что Google не заботится об исходном HTML-документе (pre-DOM HTML), а только смотрит на визуализированный HTML (post-DOM HTML).

Вскоре после удаления аннотаций hreflang Google начал ранжировать корневой URL с помощью английского фрагмента в позиции 2 в результатах поиска на немецком языке (на google.de), сразу после немецкой домашней страницы:

Ранее, когда hreflang по-прежнему реализован правильно, только немецкая версия была ранжирована в результатах поиска на немецком языке, как и ожидалось, если hreflang реализован правильно.

Нам, конечно же, потребовалось больше доказательств этого, поэтому мы следили за отчетом hreflang в Google Search Console. В течение примерно двух недель после удаления аннотаций hreflang ничего не происходило. Мы уже начали думать, что плохой международный показ SERP, который мы терпели, так как изменение могло быть совпадением, но затем вещи наконец начали двигаться:

Это, вместе с тем фактом, что наши международные версии отображаются неправильно с момента изменения, является достаточным доказательством того, что Google игнорирует наш исходный документ HTML и обращает внимание только на визуализированный HTML для интерпретации hreflang. Довольно интересно, а?

Вывод и перспективы

Мы были удивлены и рады узнать, что Google ведет себя так. Мы подумали, что Google может обрабатывать HTML как до, так и после DOM и использовать часть информации, которую он находит в обоих. Но опять же, им, вероятно, будет довольно сложно определить, какой версии доверять, если есть конфликты. Таким образом, похоже, что они переходят (или перешли) к строгой работе с отображаемым HTML и игнорируют HTML до DOM. Оглядываясь назад, это, вероятно, имеет смысл, и мы должны были ожидать ожидаемых результатов.

Как вы думаете? Вы делали подобные наблюдения? Или наоборот? Знаете ли вы о текущих случаях, когда Google игнорирует отображаемый HTML-код и использует предварительный HTML-код? Мы хотели бы услышать от вас в комментариях.

Кроме того, если вы заинтересованы во второй части этого эксперимента, следите за обновлениями! Далее мы внедрим hreflang с помощью Google Tag Manager и опубликуем пошаговое руководство в этом блоге, чтобы показать вам, как это сделать самостоятельно. Мы, очевидно, ожидаем, что Google обработает аннотации hreflang, реализованные таким образом, очень хорошо, увидев результаты выше, но мы все равно дадим вам знать, как это происходит. Просто следуйте за нами щебет , facebook или где угодно, чтобы не пропустить!

Похожие

Комментарии