{"id":14273,"url":"\/distributions\/14273\/click?bit=1&hash=820b8263d671ab6655e501acd951cbc8b9f5e0cc8bbf6a21ebfe51432dc9b2de","title":"\u0416\u0438\u0437\u043d\u044c \u043f\u043e \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0435 \u2014 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0442\u0440\u0435\u043d\u0434\u044b \u0440\u044b\u043d\u043a\u0430 \u043d\u0435\u0434\u0432\u0438\u0436\u0438\u043c\u043e\u0441\u0442\u0438","buttonText":"","imageUuid":""}

SEO и Ajax: Проблемы динамического контента

Сегодня я хочу поделиться с вами интересной проблемой, касающейся того, как использование Ajax на вашем сайте может повлиять на вашу поисковую оптимизацию (SEO) и как это можно исправить.

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

Как вы, вероятно, знаете, Ajax — это метод, используемый для создания интерактивных и динамических веб-страниц. Он позволяет сайту загружать новое содержимое без необходимости обновлять всю страницу, тем самым повышая удобство пользования. Однако в то же самое время он может отрицательно влиять на SEO.

Давайте углубимся и рассмотрим подробнее, как использование Ajax может повлиять на SEO и как с этим бороться.

Возможность сканирования

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

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

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

Структура ссылок

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

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

Дублированный контент

В некоторых случаях использование Ajax может также привести к проблемам с дублированием контента для поисковиков. Когда один и тот же контент доступен по нескольким URL-адресам, это сбивает с толку поисковых ботов и приводит к пессимизации сайта в поисковиках.

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

Доступность

Доступность — еще один важный аспект, который необходимо учитывать при использовании Ajax на вашем сайте. Для пользователей, которые отключили поддержку JavaScript или используют программы чтения с экрана, контент на базе Ajax будет недоступен, что негативно скажется на SEO.

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

Способы решения

Теперь, когда мы обсудили основные потенциальные проблемы, которые могут возникнуть при использовании Ajax на вашем сайте, давайте обсудим решения.

API pushState

С помощью API pushState разработчики могут использовать JavaScript для обновления URL, отображаемого в адресной строке, в соответствии с динамическим содержимым, загруженным через AJAX. В результате поисковики смогут просмотреть обновленный URL и проиндексировать динамическое содержимое. Это может значительно улучшить видимость сайта в результатах поиска и повысить его рейтинг в поисковых системах.

Уникальный статический URL на каждый динамический

Вы также можете предоставить поисковой системе уникальный URL для каждой динамической страницы. URL содержащиме хэш-фрагмент (например, #!) и уникальный идентификатор, соответствующий динамическому контенту, подменяют на нормальный ЧПУ (человеко-понятный URL). Таким образом, поисковая система будет иметь уникальный URL для просмотра и индексирования динамического содержимого.

AJAX SEO-friendly библиотеки

SEO-friendly библиотеки AJAX — это библиотеки, которые помогают сделать сайты на базе AJAX более удобными для ботов Google или Яндекс.

Существует несколько примеров дружественных к SEO AJAX библиотек. Коротко расскажу про самые популярные:

  • Prerender.io: Эта библиотека представляет собой облачный сервис, который генерирует статические копии HTML страниц и делает их доступными для поисковиков.
  • BromBone: Это еще один облачный сервис, который генерирует статические HTML-снимки страниц из AJAX версий.
  • PhantomJS: Это библиотека с открытым исходным кодом, которую можно использовать для создания статических снимков HTML страниц AJAX. Она работает путем запуска «headless» браузера для загрузки AJAX-страницы и последующего захвата полученного HTML кода.
  • AjaxSnapshot: Это библиотека Node. js, которая генерирует статические HTML-копии AJAX-страниц. Она полезна для работы с одностраничными приложениями, использующими React, Angular и Vue.

Важно отметить что, хотя эти библиотеки могут помочь сделать AJAX-сайты более удобными для поисковых систем, это не гарантирует 100% индексацию контента на сайте.

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

0
5 комментариев
Павел Шабалин

В проде давно уже работает SSR (Server Side Rendering) решения и самые наверное популярные это Next.JS для React и Nuxt.JS для VueJS. Это позволяет решить все ваши проблемы и отделить бэкенд от фронтенда. А у вас тут какие то костыли в статье лютые =)

Ответить
Развернуть ветку
Пётр Гришечкин
Автор

Рассказал о тех методах с которыми сталкивался, я же не разработчик, я SEO.
Можете поподробнее мне описать ваш вариант решения в личку? Во имя изучения нового)

Ответить
Развернуть ветку
Павел Шабалин

Да я же уже написал =)) в пример можете посмотреть например эльдорадо, там на фронте https://nextjs.org/

Ответить
Развернуть ветку
Эвенкийка 24

Мы как раз такой метод решили использовать для мультирегионального сайта. Авито тоже использует его. Работает же.

Ответить
Развернуть ветку
Эвенкийка 24

Только Эльдорадо на 1-с Битриксе разработан. https://www.1c-bitrix.ru/products/cms/projects/610099/

Ответить
Развернуть ветку
2 комментария
Раскрывать всегда