Сайт на Ajax: как отдельным страницам попасть в выдачу > NetPeak - Независимость и осознанность
NetPeak Biz Tech    


Сайт на Ajax: как отдельным страницам попасть в выдачу

Сайт на Ajax: как отдельным страницам попасть в выдачу

< >

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

Та же проблема существует для одностраничных лендингов, созданных не на Ajax.

Конечно, напрашивается вопрос...

Зачем вообще создавать сайты на Javascript и Ajax?

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

Но вот с поисковой оптимизацией у таких сайтов настоящая беда, и чтобы исправить это придется запомнить несколько новых терминов :)

Что такое shebang/hashbang и причем тут SEO?

Shebang/hashbang — последовательность из символов #! в URL, которая позволяет поисковым системам сканировать и индексировать сайты и приложения, полностью созданные с помощью Ajax.

Суть метода: для каждой Ajax-страницы, которую необходимо проиндексировать, на сервере разместить HTML-версию.

По шагам:

Как настроить расширенную электронную торговлю с помощью Google Tag Manager 1. При запросе Ajax-страницы должен формироваться URL  https://site.com/#!/hello-world. Включение восклицательного знака позволит узнать о наличии HTML-версии документа, а не просто якоря — закладки с уникальным именем на той же странице, как в случае с использованием простого #. Пример простой якорной ссылки можно увидеть на странице «Как настроить расширенную электронную торговлю с помощью Google Tag Manager». Клик по ссылкам из блока ниже позволит перейти к нужной части статьи на той же странице:

2. Поисковый робот автоматически заменяет #! на ?_escaped_fragment_= и, соответственно, обращается к странице https://site.com/?_escaped_fragment_=hello-world — именно эта страница должна быть HTML копией Ajax-страницы сайта.

3. Ссылки на страницы с #! необходимо поместить в карту сайта. Это ускорит индексацию страниц.

4. Чтобы сообщить роботу об HTML-версии главной страницы, в код следует включить метатег . Этот метатег нужно использовать на каждой Ajax-странице.

Важно! В HTML-версии документа метатег размещать не следует: в этом случае страница не будет проиндексирована, потому что при наличии метатега на странице, поисковый робот делает обращение к серверу в поисках соответствующей страницы с фрагментом URL: ?_escaped_fragment_=. Саму страницу c метатегом он не индексирует.

5. Ссылка в результатах поиска направит пользователя на Ajax-версию страницы.

6. В файле robots.txt должны быть открыты все Javascript-файлы, а также файлы, отвечающие за обработку Ajax. Это очень важно для индексации.

Например:

На сайте maxcar.bg с помощью технологии hashbang реализована фильтрация в категориях сайта. Например:

В результате страницы попадают в индекс Google:

Как ускорить индексацию с помощью функции window.history.pushState() в HTML5

Это небольшая Javascript-функция в HTML5 History API. Кроме передачи других параметров, она позволяет изменить URL и Title, который отображается в браузере пользователя. Важно уточнить, что обращения к серверу или к новой странице при этом не происходит, что положительно влияет на скорость загрузки страниц.

Даже на сайте-одностраничнике можно создать любое количество таких URL и поместить их в XML-карту сайта, отправив ее на индексацию. Таким образом мы получим сколько угодно страниц с разным контентом.

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

Вот что пишет справка Google:

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

Робот Googlebot хорошо подходит в тех случаях, когда нужно понять структуру HTML-ссылок, но он может допускать ошибки на тех сайтах, где для навигации применяется Javascript. Мы работаем над совершенствованием системы распознавания Javascript, но если вы хотите создать сайт, который смогут сканировать Google и другие поисковые системы, то ссылки на содержание лучше всего предоставлять на языке HTML.

То, что ранее выглядело как https://site.com/#page1, при применении функции push.State() будет выглядеть как https://site.com/page1.

Функция window.history.pushState() использует три параметра: data, title, url. Внедрение данной функции происходит следующим образом:

  1. Перед тем как приступить к внедрению функции, необходимо удостовериться, что сайт работает и с отключенным в браузере Javascript — контент должен отображаться даже в таком случае.
  2. Контент, который меняется на странице, должен размещаться на серверной части. При переходе по ссылкам должна подгружаться только контентная часть, а не HTML-страница целиком.
  3. Javascript должен перехватывать и записывать в параметр URL клики по любым внутренним ссылкам (элементы навигации и так далее), если они есть.
  4. Учитывая атрибуты ссылки, по которой кликнул пользователь (возможно, на href), Javascript / Ajax загружает соответствующий контент на страницу.
  5. При этом, если использовать привычные для поисковиков ссылки вида и обpaбатывать клики с помощью данной функции, можно значительно улучшить скорость загрузки без какого-либо негативного влияния на SEO.

Посмотреть, как это реализовано, можно на сайте html5.gingerhost.com.

Хорошо, допустим, разобрались.

Что делать, если сайт на Angular JS и React?

Чтобы ускорить индексацию сайтов на Angular JS и React, необходимо использовать один из описанных ниже методов:

  1. Вместо того, чтобы постоянно отдавать HTML-версию страницы с помощью ?_escaped_fragment_=, отдавать HTML-версию только при запросе поисковым роботом. Список ботов Google можно посмотреть здесь.
  2. Предоставлять сайт поисковым системам без предварительного рендеринга. Используйте функцию HTML5 History API для обновления URL-адреса в браузере без использования #!, создайте файл sitemap.xml со всеми каноническими URL-адресами и добавьте его в Google Search Console.
  3. Использовать ?_escaped_fragment_= без использования #!. Для этого необходимо добавить в код , не меняя при этом URL. Поисковые системы при наличии данного метатега будут искать соответствующую HTML-версию страницы на сервере.

Посмотрите результат.

Выводы

  1. Используйте последовательность из символов #! в URL для сайтов на Ajax, Javascript для улучшения индексации.
  2. Используйте Javascript-функции pushState() для лендингов, Ajax и Javascript-сайтов.
  3. Внедряйте методы для улучшения индексации сайтов на AngularJS и React.



Комментарии:

Закрытый софт Netpeak для проверки позиций под кодовым названием «Камасутра»

Закрытый софт Netpeak для проверки позиций под кодовым названием «Камасутра» Проверка позиций: бесценный онлайн софт для SEO-специалистов :)...

19 07 2025 2:27:29

Собеседование в рекламное агентство Ogilvy

Собеседование в рекламное агентство Ogilvy Тест, который проходят все соискатели. Никому не показывайте!...

18 07 2025 11:31:36

Корпоративный блог. Каким он должен быть и примеры для подражания

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

17 07 2025 6:23:47

Частые ошибки в email-маркетинге: исправляем ошибки в email рассылках и письмах

Частые ошибки в email-маркетинге: исправляем ошибки в email рассылках и письмах К чему стоит относиться с особенным вниманием при отправке рассылок. Грамматические ошибки, тема, прехедер и другие стратегически важные составляющие письма. Узнать больше!...

16 07 2025 5:33:58

Как провести четкую онлайн-трaнcляцию — кейс конференции MozCon

Как провести четкую онлайн-трaнcляцию — кейс конференции MozCon Нужно организовать конференцию с участием многих пользователей? Этот пост будет полезен, если до важного ивента есть хотя бы несколько дней в запасе....

15 07 2025 18:18:22

A/B тестирование в email-маркетинге: что это, типы, и топ идеи для сплит тестирования

Как понять, что именно нравится подписчикам в вашей рассылке...

14 07 2025 1:54:46

Черная пятница 2021 в Европе и Украине. Как изменились традиционные даты распродаж и топы бестселлеров

Черная пятница 2021 в Европе и Украине. Как изменились традиционные даты распродаж и топы бестселлеров В этом году часть пользователей предпочла вернуться к привычным покупкам в оффлайн-магазинах....

13 07 2025 23:44:32

Как с помощью разнообразия контент-плана увеличить доход от рассылок — кейс fatline.com.ua

Как с помощью разнообразия контент-плана увеличить доход от рассылок — кейс fatline.com.ua Новые триггеры, разнообразие рассылок и обновленная форма подписки дали нужный результат....

12 07 2025 23:26:31

Как оформлять Google Таблицы, чтобы с вами хотели работать

Как оформлять Google Таблицы, чтобы с вами хотели работать 10 базовых правил оформления онлайн-таблиц. Оформление — основа таблицы. Как работать со столбцами и ячейками, комментариями и примечаниями, делать корректные цветовые выделения. Читайте далее....

11 07 2025 6:10:18

10 готовых дашбордов для маркетолога в Data Studio

10 готовых дашбордов для маркетолога в Data Studio Подбор правильного инструмента для визуализации данных может сэкономить время и ресурсы компании, а также повысить общую продуктивность маркетинга...

10 07 2025 9:16:53

Как ускорить сайт с помощью сервиса CDN — краш-тест Айри

Как ускорить сайт с помощью сервиса CDN — краш-тест Айри Как трафик CDN повлиял на систему интернет-магазина — палим кейсы...

09 07 2025 8:22:20

Как настроить автоматические правила в Facebook? Подробное руководство

Как настроить автоматические правила в Facebook? Подробное руководство Правила Facebook позволяют пользоваться автоматизированным контролем над эффективностью рекламы. Читайте, как уменьшить количество ручной работы с помощью автоматических правил...

08 07 2025 12:49:29

14 неочевидных и пpaктически применимых фишек — круглый стол 8P 2020

Лучшие фишки от спикеров конференции 8P 2020. В конце каждой конференции спикеры 8P собираются за круглым столом, чтобы поделиться пpaктически применимыми советами, которые можно внедрить в свой проект и сразу почувствовать отдачу...

07 07 2025 7:21:24

Как выбрать платформу для вебинаров

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

06 07 2025 15:39:45

Что такое Netpeak Group? Все, что нужно знать

Компании и продукты, социальные инициативы, главные проекты и миссия группы. Разложили все о Netpeak Group по полочкам в новом посте....

05 07 2025 15:33:50

App Campaign for Engagement. Как работать с кампаниями на взаимодействие с приложением в Google Ads

Человек скачал ваше приложение, воспользовался им один раз и … забыл. Что с этим делать, читайте в Netpeak Journal....

04 07 2025 6:52:29

Почему для пользователей разных устройств нужны разные стратегии контекстной рекламы — кейс

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

03 07 2025 11:47:30

Как определить главное зеркало сайта

Как определить главное зеркало сайта Определение и настройка главного зеркала сайта в поисковых системах — первое, что нужно сделать перед раскруткой сайта...

02 07 2025 2:43:46

Прием антисептика внутрь, парень-микрофончик и открыть рот за $9: реклама в соцсетях в феврале 2021

Примеры странной, классной и непонятной рекламы в соцсетях из моей ленты за февраль 2021 года...

01 07 2025 4:13:45

Инструменты для веб-аналитики

Инструменты для веб-аналитики Инструменты веб-мастера: что может заменить Google ***ytics?...

30 06 2025 13:40:55

Что такое CTA: как сформировать эффективный призыв к действию

Основная цель CTA — помочь посетителю принять решение о покупке, скачивании, регистрации или подписке...

28 06 2025 19:10:43

Search Console Insights — как проанализировать контент на сайте

Search Console Insights — как проанализировать контент на сайте Каковы интересы вашей аудитории, как люди находят ваш контент. Рассказываем обо всех возможностях от Search Console Insights....

27 06 2025 8:10:58

Каково это — работать в Google

Каково это — работать в Google О том, как работают, празднуют, танцуют и в какой корпоративной культуре живут сотрудники корпорации Google. Этот пост развеет кое-какие мифы....

26 06 2025 21:20:37

Page Authority & Domain Authority

Page Authority & Domain Authority Что же такое эти authority и чем они лучше и полезнее, к примеру, чем Page Rank?...

25 06 2025 23:57:44

Что такое 500 Internal Server Error

Что такое 500 Internal Server Error Ошибка, которая может привести к полной потере контроля над вашим сайтом. Рассказываем, что это такое, какие могут быть причины поломки и как исправить. Узнать больше!...

24 06 2025 16:59:46

Кейс: заказ цветов с доставкой, SEO-продвижение сайта с ROMI 132%

Кейс: заказ цветов с доставкой, SEO-продвижение сайта с ROMI 132% SEO-продвижение интернет-сайта, где можно заказать доставку цветов. Оплатой за трафик под Россию, Украину, Казахстан, Армению, Грузию...

23 06 2025 22:55:33

Как добавить больше 10 филиалов в Google Business Profile

Как добавить больше 10 филиалов в Google Business Profile У вас фирма с филиалами по всей стране? Короткий инструктаж по массовой загрузке адресов...

22 06 2025 12:18:47

Как не слить бюджет при запуске контекстной рекламы

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

21 06 2025 22:54:20

Какие товары загружать на маркетплейсы — аналитика Hubber

Какие товары загружать на маркетплейсы — аналитика Hubber Специалисты дропшиппинг-платформы делятся данными по самым продаваемым товарам на крупных онлайн-площадках. Информация для масштабирования бизнеса. Читать!...

20 06 2025 9:13:48

Сколько стоил клик в Google Ads и Facebook в Украине в четвёртом квартале 2018 года

Сколько стоил клик в Google Ads и Facebook в Украине в четвёртом квартале 2018 года Исследование по 38,5 миллионам кликов в 22 тематиках в 391 городе страны....

19 06 2025 20:22:54

15 статей о контент-маркетинге — от идеи до размещения

15 статей о контент-маркетинге — от идеи до размещения Где искать информацию, как составить контент-план, писать тексты быстро и легко, а затем продвигать их. Собрали для вас подборку постов о разных этапах работы с контентом....

18 06 2025 18:55:59

Какие элементы продающего текста нужно тестировать

Какие элементы продающего текста нужно тестировать 89% предпринимателей не тестируют свои продающие тексты. О том, что и как нужно тестировать, рассказал в гостевом посте директор Студии эффективных текстов Владимир Руков....

17 06 2025 18:56:39

Реклама в Facebook, Instagram и ВКонтакте — размеры баннеров

Реклама в Facebook, Instagram и ВКонтакте — размеры баннеров Шпаргалка по размерам креативов для всех, кто запускает рекламу в соцсетях...

16 06 2025 13:10:57

Как настроить ретаргетинг в Яндекс.Директ — подробное руководство для новичков

Как настроить ретаргетинг в Яндекс.Директ — подробное руководство для новичков Как установить счетчик Метрики, грамотно настроить цели, сегменты и запустить рекламную кампанию по ретаргетингу в Яндекс.Директ...

15 06 2025 9:23:20

PPC на украинском. Как языковой закон влияет на контекстную рекламу

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

14 06 2025 21:59:10

Стратегия, позиционирование и бюджетирование: основные маркетинговые боли малого бизнеса Украины

Мы собрали и проанализировали ответы 270 владельцев и маркетологов...

13 06 2025 19:10:14

Обновление Яндекс.Директ Коммaндер — обзор бета-версии

Обновление Яндекс.Директ Коммaндер — обзор бета-версии В конце октября Яндекс начал открытое бета-тестирование новой версии Коммaндера. Я решила уже сейчас проверить все плюсы и минусы новой версии сервиса...

12 06 2025 14:46:16

Кредит на рекламу для бизнеса, спецпроекты, песочница контента и две новые конференции

Кредит на рекламу для бизнеса, спецпроекты, песочница контента и две новые конференции А ещё у нас появилась новая стратегия SEO-продвижения для ниши доставки еды и продуктов....

11 06 2025 9:12:32

Как мы получили заявки в нише B2B с высокой конкуренцией — кейс kkt365.ru

Как мы получили заявки в нише B2B с высокой конкуренцией — кейс kkt365.ru Как мы недооценили уровень конкуренции в нише, и как пришлось с этим бороться, чтобы принести пользу клиенту....

10 06 2025 9:23:12

15 примеров удачных маркетинговых онлайн-активностей к Новому году

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

09 06 2025 17:23:37

Как работать с закладками в Power BI — подробное руководство

Как работать с закладками в Power BI — подробное руководство В этой статье я покажу пример визуальной работы с закладкой и пошагово разберу процесс их создания и применения для удобства визуализации данных...

08 06 2025 20:49:59

Как быстро составить карту редиректов для дроп-домена

Как быстро составить карту редиректов для дроп-домена Чтобы проставить 301 редиректы, вначале надо выгрузить весь список топовых страниц по обратным ссылкам...

07 06 2025 5:35:28

История успеха office-expert.kz: перенесли email-рассылки на новый сервис и получили ROMI 440%

История успеха office-expert.kz: перенесли email-рассылки на новый сервис и получили ROMI 440% В течение месяца нам удалось наладить рассылку с новой платформы....

06 06 2025 3:18:49

10 видов инноваций

10 видов инноваций Примеры инновационных проектов. Нескучная рецензия на интересную книгу....

05 06 2025 18:47:29

Полный гайд по Reels в Instagram: что это, как создавать и что снимать

Полный гайд по Reels в Instagram: что это, как создавать и что снимать Как работать с новой функцией, чтобы набирать подписчиков и делать продажи. Подробное и актуальное руководство в 2021 году....

04 06 2025 11:13:48

Микроразметка: что нужно знать SEO-специалисту о словарях и синтаксисе

Микроразметка: что нужно знать SEO-специалисту о словарях и синтаксисе Проверка структурированных данных поисковыми роботами нуждается в нашей поддержке...

03 06 2025 13:51:11

Отчет «Статистика аукционов» в Google Рекламе

Отчет «Статистика аукционов» в Google Рекламе Пpaктика в режиме «рейтинг онлайн». Новинка Google Рекламы — отчет «Статистика аукционов»....

02 06 2025 13:35:23

Ringostat — это коллтрекинг, телефония и сквозная аналитика

Современные платформы телефонии и коллтрекинга — это не только про звонки. С Ringostat вы узнаете, откуда пришел клиент, как менеджер ему ответил и какая реклама «принесла» деньги....

01 06 2025 23:13:16

Исследование о ценности доброжелательного лидерства

Исследование о ценности доброжелательного лидерства Так называемый Humankindex (доброжелательный стиль управления) способствует инновациям в компании....

31 05 2025 6:31:14

Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::