SEO и JavaScript - 6 лучших вещей, которые стоит знать

По мере развития онлайн-мира растет спрос на современные интерактивные веб-сайты.

Итак, вы можете убедиться, что статический контент, статические фотографии, статические значки и статические фоны веб-сайтов больше не являются «обязательными», как это было раньше. Хотя минимализм по-прежнему ценится. Все меньше и меньше людей хотят сохранить этот минимализм простым, поэтому они часто решают «оживить» его с помощью случайной анимации, переполняющих цветов фона, анимации кнопок CTA и даже выскакивают увеличенные фотографии, нажимая на фотографию продукта.

Что такое JavaScript?

JavaScript является наиболее популярным языком сценариев, поддерживаемым всеми основными интернет-браузерами (Chrome, Mozilla, Firefox, Opera и даже запущенным Internet Explorer) и работает рука об руку с HTML и CSS. А где чье место?

• HTML: язык гипертекстовой разметки служит основой, базой, организатором контента на сайте. HTML по существу представляет структуру веб-страницы (заголовки H1, H2, H3, маркеры, абзацы)
• CSS: Cascading Style Sheets дает простой текстовый стиль, дизайн и гламур. CSS - наглядное представление сайта.
• JavaScript: придает веб-сайту интерактивность и динамичность (выпадающее меню, анимация кнопок и все элементы, связанные с взаимодействием пользователя с веб-сайтом), фактически это придает странице индивидуальность.

Может ли Google индексировать и отображать JavaScript?

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

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

Хотя Google является лучшей поисковой системой в Интернете, когда дело доходит до загрузки JavaScript, другие поисковые системы все еще борются с ней.

Почему JavaScript может быть реальной проблемой для SEO?

Есть 3 причины беспокоиться о JavaScript на сайте:

1. Индексирование:
   способность ботов Google индексировать веб-страницу. Например, иногда случается, что разработчики случайно блокируют индексацию JavaScript, тогда как более распространенным случаем является внутреннее связывание.
2. Доступность:
   способность ботов Google получать доступ к информации и анализировать контент. Например, если веб-страница содержит необходимый JavaScript, который составляет почти весь UX (пользовательский интерфейс), Google будет трудно загрузить все элементы. Кроме того, если в некоторых частях JavaScript возникают случайные ошибки, Google не будет загружать определенные элементы веб-сайта.
3. Как визуализировать веб-страницу:
   элементы загружаются в соответствии с их положением в HTML-коде, что означает, что если у вас есть файл требуемой емкости в самом верху кода, онлайн-браузер загрузит его первым. Концепция рендеринга веб-сайта Google фактически основана на загрузке элементов от начала до конца HTML-кода.

Затем разберем 6 основных вещей, которые вы обязательно должны знать о JavaScript и его проблемах в SEO оптимизации.

Никогда не блокируйте JavaScript от индексации

Если вы заблокируете поисковые системы от индексации JavaScript, они не будут испытывать реальный опыт работы с сайтом.

Чтобы убедиться, что Google видит веб-страницу в правильном свете, перейдите в консоль поиска Google и найдите страницу как Google.

Никогда не выполняйте внутреннее соединение, используя JavaScript

Внутреннее связывание контента должно выполняться с помощью обычных тегов привязки в HTML или DOM (с использованием тега HTML). Под этим мы подразумеваем, что мы также должны избегать использования событий onclick вместо внутренних ссылок.

Хотя URL-адреса по-прежнему можно будет найти и проиндексировать (используя ссылки в коде JavaScript или XML-файле Sitemap), они не будут связаны с основной навигацией веб-сайта.

Внутренние ссылки, использующие тег «href», дают поисковым системам самый мощный опыт полной архитектуры веб-сайта и важности отдельного онлайн-контента.

Google боты не ведут себя как настоящие веб-браузеры

Когда вы пользуетесь Интернетом, ваш веб-браузер (Chrome, Firefox, Opera или другой браузер) загружает всевозможные ресурсы (изображения, скрипты, стили сайта -CSS), чтобы показать конечному пользователю визуализированный вид определенного сайта. Но Googlebot работает немного иначе, чем веб-браузер.

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

Google имеет технические ограничения, когда дело доходит до сканирования JavaScript

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

Хотя пользователи регулярно обновляют свой веб-браузер до последней версии, Googlebot этого не делает! С 2015 года до недавнего времени он использовал версию браузера Chrome 41, в то время как параллельные информационные технологии и JavaScript развивались с молниеносной скоростью.

Только в конце апреля позапрошлого года робот Google решил использовать версию Chrome 64, с которой:

• поддерживает JavaScript ES6, который он частично поддерживал
• позволяет просматривать интерфейсы, такие как IndexedDB и WebSQL

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

Если мы собираемся быть реалистами, кто отслеживает новые обновления браузера? Большинство онлайн-пользователей, вероятно, все еще используют более старые версии браузера, поэтому есть большая вероятность, что некоторые эффекты и функции JavaScript не будут им видны.

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

Если определенные функции заблокированы, то вы должны предложить браузеру функцию замены, которую он поддерживает.

5-секундное правило Google

Многие SEO-опросы показывают, что Google будет ждать примерно 5 секунд, пока страница загрузится, и получит скрипт.

Если сайт работает очень медленно, вы можете многое потерять:

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

Например, распространенная ошибка программистов - поместить все компоненты программы в один файл.

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

Не верьте мифу, что мобильным сайтам не нравится JavaScript

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

Имея в виду Google, он создал три конфигурации, помогающие использовать JavaScript в мобильной версии сайта:

1. Настраиваемая конфигурация JavaScript. Используются те же HTML, CSS и JavaScript, но рендеринг зависит от типа устройства.
2. Комбинированные конфигурации обнаружения. Они используют JavaScript в сочетании с обнаружением устройств, чтобы адаптировать онлайн-контент к типу устройства
3. Динамическая настройка JavaScript. Он обслуживает тот же HTML, но JavaScript изменяется на основе URL.