JavaScript: что это, влияние на SEO, как оптимизировать JS-сайт

Обновлено: 08.11.2018
Рубрика: Верстка
Что такое JavaScript?

JavaScript – это мультипарадигменный язык программирования, предназначенный для создания максимально удобного для пользователей визуального оформления сайтов. Он создает анимации и упрощает взаимодействие пользователя с системой. Посетитель ресурса может открывать страницы и совершать различные действия без изменения URL-адреса документа и его перезагрузки.

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

JavaScript может выступать как внешний скрипт, или же располагаться в HTML-документе внутри тегов <script>, то есть, быть в качестве встроенного скрипта. У языка есть определенная структура, включающая в себя огромное количество фреймворков и библиотек, среди которых DOM, которому стоит уделить отдельное внимание.

Что такое DOM (объектная модель документа)?

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

DOM, как правило, внешне отличается от изначального HTML-документа, поэтому его часто называют динамическим HTML, когда страница может менять содержимое в зависимости от окружающих условий, например, времени суток, того, какие в нее поступают входные данные, а также прочих изменяемых данных JavaScript, CSS и HTML. Ярким примером динамического HTML служит тег <title>.

Сканирует ли Google язык JavaScript?

С развитием интернета все больше растет спрос на функциональные веб-ресурсы с превосходной интерактивностью. Из-за этого сайтостроители часто применяют различные фреймворки на JavaScript, однако за этим следуют вопросы относительно дальнейшей SEO оптимизации данных сайтов. Оптимизаторов интересует, сканируют ли поисковики, например, Google, страницы, где внедрена технология JavaScript. Ответить на этот вопрос одним «Да» или «Нет» невозможно. Необходимо для начала разъяснить некоторые нюансы.

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

Для начала рассмотрим принцип работы поисковиков. Он состоит из трех процессов:

  1. Краулер.
  2. Индексатор.
  3. Движок запросов.

Рассматривая влияние JavaScript на SEO, нас касаются только краулер и индексатор. В поисковике Google краулером выступает Googlebot, а индексатором – Caffeine. Они выполняют совершенно разную работу и не стоит их путать.

Googlebot занимается сбором всех URL-адресов и информации в них. Это сложный комплекс процессов, в ходе которых учитывается поочередность сканирования, важность ссылок, время ответа сервера, число источников и прочее.

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

На заметку. Парсер не рендерит страницы, а только изучает HTML-код и собирает все URL, расположенные внутри элементов <a href=”…”>.

Замечая новые или измененные URL, краулер отсылает их индексатору, который в свою очередь анализирует содержимый в них контент и его релевантность. Еще изучается каноникализация (выбор наиболее подходящего URL), шаблон страницы и ссылочный граф, чтобы определить PageRank страницы.

Индексатор занимается рендерингом документов, реализует JavaScript. Компания Google однажды выложила на своем ресурсе материалы, где описывается принцип работы WRS (Web Rendering Service). Если вас интересует, можете изучить материал здесь.

Именно WRS выполняет JavaScript в Caffeine. В Search Console есть инструмент Сканер, при помощи которого можно проверить, как WRS видит документ.

Несмотря на выполнение разных функций, Googlebot и Caffeine не могут существовать друг без друга, так как краулер отправляет индексатору найденные URL, а тот оповещает о новых адресах краулера. Еще индексатор сообщает краулеру приоритетные URL, которые ему нужно посещать чаще остальных.

А теперь перейдем к вопросу о сканировании Google JavaScript. Да, поисковая система и вправду обрабатывает данный язык программирования, извлекает ссылки и ранжирует страницы, где применяется технология. Однако невзирая на сложный и взаимосвязанный принцип работы краулера (Googlebot) и индексатора (Caffeine), JS-контент снижает эффективность сканирования и индексирования поисковиком. Применяя для ссылок и контента JavaScript, мы вынуждаем машину обработать все страницы, а на это уходит много времени.

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

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

Все это значит, что по мере сбора новых URL из JavaScript, вновь оценивается граф внутренних ссылок ресурса. С появлением новых страниц, которые Caffeine обязан взять из JS-кода, повторно оценивается структура веб-сайта, меняя тем самым важность страниц. Это чревато тем, что ссылочный вес страниц, которые действительно важны для ресурса, может падать, из-за чего будет страдать ее PR, и наоборот, далеко не ключевые документы могут получить высокую ценность, так как на них ведут простые ссылки, для которых не нужно рендерить JavaScript.

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

Важно знать! Грамотное SEO заключается в том, чтобы упростить жизнь поисковым роботам. Если им легко отыскать и собрать информацию на сайте, легко оценить ее, то и позиции в серпе будут как минимум удовлетворительные. Заставляя Google делать больше с внедрением JavaScript, мы сами провоцируем проблемы с ранжированием ресурса.

Сканирует ли Яндекс JavaScript?

Боты популярнейшего российского поисковика тоже способны индексировать JS, однако сегодня подобная практика несет экспериментальный характер. На практике, некоторые JS-страницы сканируются, некоторые – нет. Поэтому, создав сайт с использованием фреймворков, нельзя быть уверенным на 100%, что он будет проиндексирован.

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

Оптимизация сайта под JavaScript

Используя JavaScript на сайте, нередко оптимизаторы сталкиваются с проблемами его отображения поисковой системой. Можно считать, что сегодня лишь поисковик Google прогрессирует в сфере развития анализа и взаимодействия с технологией, в отличие от других систем. Большая часть важной информации на сайте остается незамеченной ботами, что негативно сказывается его на позициях. Во избежание подобных неприятностей нужно оптимизировать сайт под JS:

  • Создайте резервные страницы. Это статичные HTML-страницы, содержащие всю ту же информацию, что и JavaScript версии. Они отображаются тогда, когда загружаемый сайт не может показать JS для поисковых систем, которые не поддерживают технологию, или для посетителей, пользующихся текстовыми браузерами. Недостаток такой процедуры заключается в необходимости финансовых затрат и сложной реализации. Создавая резервные страницы, вы столкнетесь с проблемой несоответствия URL-адресов и трудностями при добавлении страниц в закладки. Однако проблема решается HTML-5, способным изменять пути URL.
  • Создание двух версий страниц. Не совсем легальный метод. Вместо решения проблемы с юзабилити ресурса и его восприятием, робот может расценить это как создание дополнительных страниц с целью накрутки оценки. То есть, для системы это может выглядеть попыткой предоставить ей оптимизированную страницу, а посетителям показать страницу с нерелевантным запросу содержанием. Даже если это в действительности не так.
  • Не используйте в структуре URL идентификаторы фрагмента (#). Хеш (#) не сканируется поисковиками. Он применяется для распознавания анкорной ссылки, которая позволяет переходить к другим разделам статьи. Все, что располагается после хеша, не доходит до сервера. Хешбэнг (#!) ранее использовался для поддержки краулеров, но теперь Google старается избегать данный хак. Лучше применять навигацию PushState History API, обновляющий адрес в соответствующей строке. При этом обновляется только та часть URL, касающаяся элемента, который изменяется на странице. Это позволяет сайтам с JavaScript пользоваться эстетичными URL-адресами без лишних символов. PushState актуален для применения в случае бесконечного скроллинга.
  • Обеспечьте рендеринг со стороны сервера. Одной из основных причин, по которым поисковик Google не может просматривать страницы сайта, заключается в том, что она требует загрузку JS на странице. В таком случае получается рендеринг на стороне клиента. Нужно разгрузить робота и передать процесс серверу ресурса, чтобы технология рендерилась на его стороне. Это позволит краулеру сканировать непосредственно исходный код и контент.
  • Воспользуйтесь изоморфным рендерингом. Альтернативный вариант. Заключается в том, чтобы загрузить первый запрос на сервере, а последующие – на стороне клиента. Получается, что при посещении ботом веб-страницы, сервер, выполнивший для нее исходный JS-код, отправляет обработанный JS в браузер, после чего обработка дальнейших запросов происходит на стороне клиента.
  • Откажитесь от AJAX. Поисковый гигант в 2018 году полностью отказался от данной схемы сканирования, которая была внедрена в 2009 году.

Как проверить что контент сайта доступен Google?

Необходимо предоставить поисковику сценарий, аналогичный пользовательскому. В 2015 году было подтверждено, что Google способен сканировать JS и применять DOM. Поэтому, если вы видите контент в DOM, с большой вероятностью он был просканирован поисковой системой. Для проверки доступности контента для Google, выполните следующие шаги:

  • Посмотрите, отображается ли содержимое ресурса в DOM.
  • Протестируйте несколько страниц для проверки поисковика на способность индексировать необходимый контент.
  • Самостоятельно проверьте внешние ссылки со страниц.
  • Воспользуйтесь сервисом Fetch with Google, в котором будет указано, доступен ли контент для ботов и рабочий robots.txt JavaScript.

Заключение

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

Если вы делаете ставку на внешний вид и имидж, то потратить время на оптимизацию JS-сайта стоит. Но если вас интересуют исключительно SEO аспекты и вы привлекаете трафик за счет качественного контента, то лучше остановиться на обычной версии ресурса.

Александр Овсянников
Занимаюсь продвижением и заработком на сайтах с 2009 года.
Добавить комментарий