Сайт на 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-версии документа, а не просто якоря — закладки с уникальным именем на той же странице, как в случае с использованием простого #. Пример простой якорной ссылки можно увидеть на странице
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. Внедрение данной функции происходит следующим образом:
- Перед тем как приступить к внедрению функции, необходимо удостовериться, что сайт работает и с отключенным в браузере Javascript — контент должен отображаться даже в таком случае.
- Контент, который меняется на странице, должен размещаться на серверной части. При переходе по ссылкам должна подгружаться только контентная часть, а не HTML-страница целиком.
- Javascript должен перехватывать и записывать в параметр URL клики по любым внутренним ссылкам (элементы навигации и так далее), если они есть.
- Учитывая атрибуты ссылки, по которой кликнул пользователь (возможно, на href), Javascript / Ajax загружает соответствующий контент на страницу.
- При этом, если использовать привычные для поисковиков ссылки вида и обpaбатывать клики с помощью данной функции, можно значительно улучшить скорость загрузки без какого-либо негативного влияния на SEO.
Посмотреть, как это реализовано, можно на сайте html5.gingerhost.com.
Хорошо, допустим, разобрались.
Что делать, если сайт на Angular JS и React?
Чтобы ускорить индексацию сайтов на Angular JS и React, необходимо использовать один из описанных ниже методов:
- Вместо того, чтобы постоянно отдавать HTML-версию страницы с помощью ?_escaped_fragment_=, отдавать HTML-версию только при запросе поисковым роботом. Список ботов Google можно посмотреть здесь.
- Предоставлять сайт поисковым системам без предварительного рендеринга. Используйте функцию HTML5 History API для обновления URL-адреса в браузере без использования #!, создайте файл sitemap.xml со всеми каноническими URL-адресами и добавьте его в Google Search Console.
- Использовать ?_escaped_fragment_= без использования #!. Для этого необходимо добавить в код , не меняя при этом URL. Поисковые системы при наличии данного метатега будут искать соответствующую HTML-версию страницы на сервере.
Посмотрите результат.
Выводы
- Используйте последовательность из символов #! в URL для сайтов на Ajax, Javascript для улучшения индексации.
- Используйте Javascript-функции pushState() для лендингов, Ajax и Javascript-сайтов.
- Внедряйте методы для улучшения индексации сайтов на AngularJS и React.
Комментарии:
Украинские реалии того, в каких тематиках трафик из Yandex.Direct дороже Google Ads. Новое исследование Алексея Селезнева....
16 04 2026 18:15:40
Любопытная подборка "маленьких" гигантов: компании и сервисы, чья аудитория превышает 10 миллионов пользователей, а также несколько интересных фактов о каждом из них. Узнать больше!...
15 04 2026 4:34:55
Быстрая индексация: как оперативно узнать, попала ли важная для вас страница в поисковые системы Google и Яндекс....
14 04 2026 13:26:35
Это исследование для тех, кто хочет выяснить, эффективно ли работать с лидами, если им год и больше...
13 04 2026 23:19:44
Кейсы, фишки и советы, опыт крупных брендов, маркетологов....
12 04 2026 9:23:50
Проведение краудфандинговых кампаний — это бизнес. Это отдельный и вполне серьёзный рынок с уймой заточенных под ваши нужды услуг. Раньше нужно было ждать, пока проект пройдет обязательную проверку сотрудником Kickstarter, сейчас можно запускать кампанию...
11 04 2026 13:33:20
Словосочетания и аббревиатуры, которыми пользуются на рынке игрового маркетинга....
10 04 2026 20:54:33
Как пользователи и разработчики приложений живут без Google Play? Авторская колонка....
09 04 2026 4:14:10
Как научиться продвигать мобильные приложения и заpaбатывать на этом....
08 04 2026 3:41:49
Amazon сократил комиссию для сайтов партнеров от 30% до 80% — что делать дальше? Мнение эксперта....
07 04 2026 13:38:46
Как добавить свою рекламу через поисковый сервис с картинками в Google....
06 04 2026 8:13:15
Мы попросили спикеров ответить на острые для многих онлайн-проектов вопросы о развитии мобайла как канала, программатике и строительстве инхаус комaнд...
05 04 2026 8:25:46
Ежеквартальное исследование Netpeak по стоимости клика...
04 04 2026 19:34:36
Зная стоимость клика в вашей тематике или регионе, коэффициент конверсии на сайте, вы можете оценить объем необходимых в рекламу инвестиций и прогнозировать стоимость конверсии. Узнать больше!...
03 04 2026 7:33:24
Что такое【контекстная реклама】и как ее настроить? Подробный чек-лист ✅ в блоге Netpeak ⟁ ▷ 200 ступеней рекламной кампании в Google AdWords, Яндекс.Директ ⚡...
02 04 2026 8:48:13
Денис Бигус, Bihus.info: с 13 до 457 000 подписчиков на YouTube за четыре года....
01 04 2026 22:27:49
Мир гаджетов на Android и IOS. ROMI (возврат маркетинговых инвестиций) по валовой прибыли: 764%....
31 03 2026 1:40:57
Таблица общих для Google и Яндекс микроформатов инсайде...
30 03 2026 18:23:44
Всем, кто собирается перейти на Single Page Application, но переживает, что они поссорятся с поисковыми системами. Правильно переживаете!...
29 03 2026 16:42:19
Как настроить отправку писем с помощью языка R и как избежать подводных камней....
28 03 2026 4:48:46
10 заданий, которые заставят пошевелить мозгами и придумать нестандартные решения. Используйте их (видоизмените, адаптируйте) под свой продукт или услугу. Создайте крутую кампанию, креатив или предложите это своей комaнде....
27 03 2026 2:59:32
Советы бизнесу от зрителей Big Money и Артема Бородатюка. Предлагаем 11 универсальных, но простых и понятных идей....
26 03 2026 22:23:23
Интернет-маркетинг это не просто способ заработать. Про работу sео оптимизатора в Netpeak из первых уст...
25 03 2026 21:11:19
Перво-наперво для мониторинга ошибок SEO-специалист открывает вебмастерку с подсказками Google — она же панель вебмастеров, она же Google Search Console...
24 03 2026 22:40:29
История создания и развития холдинга «Choco Family» помогает понять масштабы онлайн-рынка Казахстана, найти точки роста для собственного бизнеса в Казнете. Каково быть пионером ecommerce в стране? Чем казахстанский рынок ecommerce отличается от Рунета и Уанета? Читать!...
23 03 2026 15:51:39
Участники Netpeak Cluster поделились своими инсайтами....
22 03 2026 4:21:18
Ошибка на странице 404 может выглядеть креативно. Страница не найдена и не может быть найдена, потому что она в розыске, утеряна, украдена ниндзей, путь заснежен и дороги дальше нет, а принцесса находится в другом замке. О чем это?...
21 03 2026 19:21:42
Процесс привлечения сторонних ресурсов отнимает основную часть времени у большинства основателей стартапов. Читайте руководство, которое поможет сделать этот процесс во время серии А более эффективным....
20 03 2026 3:56:33
Работать сейчас — не зазорно, а просто необходимо для страны...
19 03 2026 15:25:20
Как найти и быстро исправить причины падения трафика? Совет номер один — не паниковать....
18 03 2026 19:56:31
В аккаунте ***ytics появилась возможность подключения ремаркетинга в поисковой сети Google. Расскажем о результатах применения инструмента на примере кейса крупного проекта ecommerce....
17 03 2026 19:38:44
Как сэкономить на рекламе мобильных приложений в Facebook...
16 03 2026 15:35:33
Полезный и развлекательный контент для всех, кто работает в IT, интернет-маркетинге, интересуется фишками тайм-менеджмента, учится управлять комaндой и собой....
15 03 2026 5:55:23
Не стучитесь к Алексею на ФБ с предложением что-то придумать для бренда. У Ломоносова целый тред таких непрочитанных сообщений. Узнать больше....
14 03 2026 14:37:49
Опыт сотрудника отдела маркетинга Netpeak. Дочке Маше — 10 лет, сыну Егору — почти 4 года. Мы по-прежнему не очень продуктивны в таких условиях, но все же накопили больше опыта, чем те люди, которые сейчас внезапно столкнулись с удаленной работой...
13 03 2026 13:39:30
В статье описан ручной и самый безопасный из существующих метод...
12 03 2026 22:31:11
Лучшие фишки продвижения мобильных приложений в адаптированном переводе отчета Branch.io...
11 03 2026 23:26:44
Получаем реальную статистику эффективности использования AMP-страниц с помощью АМР Client ID API....
10 03 2026 12:22:28
При работе с рекламным аккаунтом приходится вносить много однотипных изменений. Рассказываем, как сделать это быстро....
09 03 2026 17:20:39
Через тернии к кейсу. SEO-продвижение интернет-магазина отопительного оборудования с оплатой за трафик...
08 03 2026 16:16:10
Рассказываем об интересных диджитал-специальностях и зарплатах, как обучиться этим профессиям с нуля (в том числе в зрелом возрасте) и можно ли работать удалённо....
07 03 2026 18:56:52
Грамотный контент важен для всех, но особенно — для аутсорсов и стартапов в B2B. Если вы согласны с этим, давайте делать медиа....
06 03 2026 6:36:13
Решение вопроса о получении корректной информации о конверсиях — вполне посильная задача...
05 03 2026 21:48:36
Данные, приведенные в исследовании, помогут в составлении медиапланов по продвижению в интернете. Понимания стоимость конверсии и необходимое количество конверсий, вы можете прогнозировать, сколько денег на рекламу нужно выделить....
04 03 2026 17:42:38
Спойлер: чтобы получить наилучший результат с наименьшими усилиями и затратами времени....
03 03 2026 23:33:41
Как зарегистрироваться в приложении Facebook Business Manager и грамотно сделать и настроить аккаунт...
02 03 2026 9:40:55
Поиск крутых авторов и качественные тексты для блога об email-рассылке...
01 03 2026 10:44:21
Мы хотим купить комaнду с компетенциями в сфере медиабаинга, чтобы объединить силы для развития онлайн-рынка...
28 02 2026 6:14:32
Особенности продвижения в нише аренды автомобилей по материалам кейсов наших коллег...
27 02 2026 1:49:22
Чем шокировала, радовала и удивляла реклама в социальных сетях и контекстная в Google в апреле 2021 года...
26 02 2026 3:14:13
Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::
