Chrome 41: ключ к успешной визуализации веб-сайтов

1. Как проверить, видит ли робот Googlebot выпадающее меню - проверьте это в Chrome 41!
2. Использование Chrome 41 для проверки ошибок, которые получает Googlebot
3. Что означает эта ошибка?
4. Обход бюджета - браузеры не похожи на Googlebot
5. Будущее
6. Резюме

Результат? Извлекать и отображать можно было увидеть только основной элемент <div>. Другие части сайта опущены F & R. Этот скринкаст иллюстрирует проблему:

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

Чтобы увидеть, что я имею в виду, вы можете открыть http://botbenchmarking.com/testgsc/visibility.html в вашем браузере. Затем нажмите «CTRL минус» несколько раз. Бьюсь об заклад, вы все еще можете увидеть только основной div. Как только вы прокрутите вниз, вы можете увидеть остальную часть контента. Но инструмент Google Fetch and Render не может «видеть» контент.

Насколько нам известно, это не влияет на индексацию.

Но тогда возникает вопрос: влияет ли эта проблема на рейтинг? Или влияет только на то, как Fetch and Render видит ваш контент? Пока я не знаю точного ответа. Сталкивались ли вы с похожими проблемами, связанными с Fetch и Render? Буду рад узнать ваши отзывы.

Как проверить, видит ли робот Googlebot выпадающее меню - проверьте это в Chrome 41!

Джон Мюллер дал нам несколько интересных советов о том, как проверить, может ли робот Google увидеть выпадающие меню в JavaScript SEO Group ,

Вывод очевиден: если ваше меню находится внутри объектной модели документа (DOM), прежде чем щелкнуть какой-либо пункт меню, оно должно быть выбрано роботом Googlebot. В противном случае, очень вероятно, что его вообще не заберут.

Чтобы проверить это в Chrome 41, просто нажмите кнопку «Проверить элемент». И затем искать любой фрагмент меню.

[Примечание: технически вы можете использовать любой браузер для проверки DOM. Но есть ли у вас какие-либо аргументы, чтобы не использовать браузер, используемый службой веб-рендеринга Google? Поскольку все мы знаем, что Google использует Chrome 41 для рендеринга, давайте воспользуемся этим браузером, чтобы сделать ваши сайты просматриваемыми и индексируемыми :)]

Чтобы проиллюстрировать, что я имею в виду, давайте используем пример Ebay.com:

На Ebay.com есть выпадающее меню.

Давайте проверим, может ли Google увидеть это, и перейдем по ссылкам меню.

Мы можем подобрать электронику -> Дополнительные категории -> категория iPhone.

1. Нажмите «проверить элемент» (или Ctrl Shift I).
2. Перейдите на вкладку «Элементы».
3. Нажмите Ctrl + F и найдите «IPhone». Действительно, это в DOM, так что Google может увидеть это!

[Примечание: если вы не уверены, что исследуете нужный узел, просто отредактируйте внутренний текст «iPhone» и посмотрите, обновлялось ли меню.]

Вот скринкаст, иллюстрирующий, как вы можете сделать это:

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

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

Использование Chrome 41 для проверки ошибок, которые получает Googlebot

Следующий сценарий очень распространен: Google Fetch and Render показывает, что он не может правильно отобразить страницу.

Чтобы выяснить источник проблем с рендерингом, откройте Chrome 41, посмотрите на консоль и посмотрите, какие ошибки произошли.

Чтобы продемонстрировать сценарий, Я создал простую страницу ,

Страница содержит очень простой скрипт, который использует преимущества очень распространенной команды let (часть синтаксиса ES6 JavaScript).

Я проверял, поддерживает ли его робот Googlebot, открыв его в консоли поиска Google и в Chrome 41. Чтобы сравнить результаты, я проверил, может ли новейшая версия Chrome отображать его правильно.

Сценарий очень прост. Если браузер поддерживает ES6, он заменяет абзац следующим текстом: «Да, ваш браузер поддерживает ES6».

Chrome 61 прекрасно отображает эту страницу:

Как насчет Fetch и Render?

Итак, откройте эту страницу в Chrome 41 и посмотрите, какие ошибки произошли:

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

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

Что означает эта ошибка?

Для тех, кто действительно хочет знать, в чем заключается эта ошибка, я подготовил краткое объяснение.

Chrome 41 выдает синтаксическую ошибку:

«Линия 7; «Uncaught SyntaxError: блочные объявления (let, const, function, class) еще не поддерживаются вне строгого режима»

Ошибка указывает, что это вызвано объявлением let в седьмой строке:

Хорошо, но что не так с объявлением «let»?

Давайте проверим CanIUse.com:

Бинго! Как видите, он не полностью поддерживается браузерами старше Chrome 49. CanIUse.com указывает, что Chrome может использовать его только в строгом режиме JavaScript.

Как заставить это работать?

• Вы можете использовать строгий режим в вашем коде JavaScript.
• Вы можете использовать такие инструменты, как галдеж что позволяет перейти на ES5. В прозрачном процессе объявление «let» заменяется объявлением «var» (которое полностью поддерживается роботом Google).

Обход бюджета - браузеры не похожи на Googlebot

Google может правильно отображать большое количество современных веб-сайтов. Однако проблема более тривиальна. Робот Google не действует как настоящий браузер. Что делает стандартный браузер? Он загружает все ресурсы: файлы JS, CSS, изображения, фильмы и т. Д. И показывает пользователям визуализированный вид.

Googlebot действует по-другому. Он предназначен для сканирования всего интернета, захвата только ценных ресурсов и отправки его в индексатор. Всемирная паутина огромна. Так что Google должен (и делает) оптимизировать свои сканеры для повышения производительности . Вот почему робот Google иногда не посещает все страницы, которые хотят веб-мастера.

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

Кроме того, еще один фактор играет роль. Робот Googlebot регулирует скорость сканирования в зависимости от эффективности сайта . Если Google обнаружит, что время ответа очень медленное или запросы от Googlebot делают веб-сайт заметно медленнее, это может снизить скорость сканирования.

Если веб-сайт содержит много скриптов, занимающих много времени, Chrome 41 выполнит это и отобразит страницу. Принимая во внимание, что Google Fetch, Render и indexer, вероятно, прекратят выполнение скрипта через ~ 5 секунд - многие SEO-специалисты называют это правилом 5 секунд.

Будущее

На Google оказывается сильное давление с целью обновления функций Googlebot и их обновления.

Google обещает, что в будущем его рендеринг-машина всегда будет основана на новейшей версии Chrome.

Когда мы говорили с Ильей Григориком из Google, он сказал: «Последнее, что мы хотим, - это каждый разработчик, использующий устаревшую версию Chrome. Скрестим пальцы, у нас будут лучшие решения в 2018+ :) »

И еще большие новости приходят. Джон Мюллер утверждает что Google работает над тем, чтобы Google Search Console Fetch и Render отображали не только визуализированное изображение, но и визуализированный DOM-снимок. «Мы работаем над включением копии отрисованного HTML / DOM в инструмент, который, как мы надеемся, скоро выйдет». Как только они закончат его, устранение неполадок станет намного проще. Один сможет точно увидеть, какие элементы Google смог подобрать.

Резюме

Новость о том, что служба веб-рендеринга Google использует Chrome 41, дала нам огромное представление о том, как Google видит сайты. Используя Chrome 41, мы можем обнаружить (с высокой вероятностью), есть ли у Google проблемы с загрузкой контента. Если есть какие-либо проблемы с рендерингом в Chrome, просто загляните в консоль разработчика Chrome на предмет возможных ошибок.

Мы должны знать, что между Chrome 41 и Googlebot (или, точнее, службой веб-рендеринга Google) есть небольшая разница в отношении поддерживаемых функций. Кроме того, мы должны помнить, что робот Google не работает как стандартный браузер. Здесь другие факторы, такие как обход бюджета и скорость веб-сайта, играют важную роль. Эти факторы действительно могут повлиять на сканирование и индексирование! SEO не должен забывать это.

Если вам интересно узнать больше о веб-сайтах на основе JavaScript и SEO, то вам обязательно нужно прочитать мой Ultimate Руководство по JavaScript SEO ,