Сайт на 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.
Комментарии:
SMM — сфера с доступным обучением и большими деньгами, а хороших специалистов разбирают, как горячие пирожки. SMMщики работают с крупными брендами и создают свой бизнес всего через пару лет после старта....
13 12 2025 13:22:44
Аналитики из SalesForce уже в четвертый раз опубликовали исследование о приоритетах, составе комaнд и распределении бюджетов ведущими маркетологами мира...
12 12 2025 0:33:54
Десять вопросов, которые чаще всего задают люди, столкнувшиеся с необходимостью создания landing page....
11 12 2025 12:16:17
Нам удалось увеличить количество органических показов на 63% и установок на 25%....
10 12 2025 11:55:54
Как автоматизировать выгрузку данных онлайн из Яндекс.Метрики и импортировать полученную статистику для дальнейшего анализа или визуализации....
09 12 2025 7:24:21
Каким правилам нужно следовать, чтобы создать эффективный рекламный ролик?...
08 12 2025 12:45:58
Алексей Селезнев проанализировал, как дорого обходятся рекламодателям клики по объявлениям в 25 тематиках и 92 странах....
07 12 2025 9:15:55
Три способа парсинга данных с помощью Owox BI Pipeline, Mix Data BI Import, Owox BI Power Upload....
06 12 2025 16:38:45
Бесплатно рекламировать и привлечь первых посетителей/клиентов вполне реально своими силами...
05 12 2025 15:34:45
Сегодня именно тот день, когда пора решиться и отправить своё резюме в нашу компанию....
04 12 2025 19:41:59
Эффективность рекламы в поиске падает, но растут YouTube, контекстно-медийная сеть и другие платформы...
03 12 2025 19:41:37
Сериал «Ход королевы» взорвал интерес к шахматам, и вот насколько сильно...
02 12 2025 17:11:25
кмс Google: как достичь поставленной цели с помощью рекламы? Делимся советам по настройке КМС-кампаний....
01 12 2025 8:59:58
Делайте анализ ссылочной массы хотя бы раз в месяц — и будет вам счастье....
30 11 2025 7:42:40
Как настроить многокaнaльную модель атрибуции для своего бизнеса....
29 11 2025 9:43:55
Как быстро увеличить количество заинтересованных подписчиков в facebook, twitter, google+ и linkedIn с помощью контактов из рассылки и аккаунтов Facebook....
28 11 2025 7:52:35
Как решить все задачи и не изобретать велосипед. Мы оторвались от отчетов в Google ***ytics и Яндекс.Метрике и посмотрели в сторону менее популярных инструментов для веб-аналитики. Узнайте больше!...
27 11 2025 6:37:37
Раскрутка музыки онлайн: способы, методы, нюансы и примеры...
26 11 2025 16:19:12
Небольшой набор секретов по работе с Планировщиком ключевых слов гугла...
25 11 2025 7:44:20
Ошибка, которая может привести к полной потере контроля над вашим сайтом. Рассказываем, что это такое, какие могут быть причины поломки и как исправить. Узнать больше!...
24 11 2025 10:22:46
В Twitter удобно собрать список потенциальных клиентов, чтобы время от времени посматривать за их новостями...
23 11 2025 14:18:27
Сооснователь SUPERLUDI Влад Ноздрачев рассказал в своем подкасте о развитии инфобизнеса. Предлагаем вам вольный пересказ....
22 11 2025 20:54:36
Советы специалистам по контекстной рекламе. Технические сложности, которые возникают при работе с Google ***ytics: от ограничений интерфейса до ошибок настройки отслеживания и последующей недостоверности полученных данных, и решения для них...
21 11 2025 23:37:44
Создание канала бренда на видеоплатформе необходимо для увеличения притока трафика, улучшения репутации и поискового продвижения компании...
20 11 2025 22:57:26
Девять свежих советов для продвижения интернет-магазинов...
19 11 2025 18:32:51
Что учитывать при продвижении недвижимости, клиник красоты, магазинов косметики, сайтов по продаже семян, шин?...
18 11 2025 12:17:50
Как собрать свой онлайн марафон на 500 или 1000 человек? Сколько это стоит и какие сервисы использовать. Давайте разбираться....
17 11 2025 10:53:10
Советы специалистов Netpeak: виды фильтров Google, что с этим делать и как снять ручные санкции Google....
16 11 2025 11:22:24
Рекомендации от Google для бизнеса о поведении в период распространения коронавируса....
15 11 2025 14:31:10
Проверка структурированных данных поисковыми роботами нуждается в нашей поддержке...
14 11 2025 13:34:55
Если маркетер хочет привлечь к бренд-контенту дополнительное внимание, стоит воспользоваться опцией Promote post....
13 11 2025 23:11:14
88% времени в телефоне люди проводят в приложениях. Рассказываем, как их можно создавать без написания кода....
12 11 2025 0:10:16
Сторителлинг — это способ рассказывать истории, его цель — дать возможность читателю или зрителю почувствовать себя героем этой истории,...
11 11 2025 17:53:47
Как упростить знакомство клиента с компанией, продуктом или услугами....
10 11 2025 7:38:37
Инструкция о том, как создать новую кампанию в Bing Ads или импортировать существующую из Google Рекламы? Как добавить способ оплаты? Читайте о первых шагах настройки рекламы в Bing...
09 11 2025 12:20:55
Подробный алгоритм успешного питча на Product Hunt на примере Serpstat...
08 11 2025 18:31:48
Персональная стратегия продвижения онлайн с помощью SEO и контекстной рекламы....
07 11 2025 1:15:58
Мы запустили email с нуля и стали получать стабильный ежемecячный доход....
06 11 2025 3:24:28
Упущенная семантика — это ключевые фразы, которые успешно используют в SEO и PPC ваши основные конкуренты, но не используете вы. Как найти упущенную семантику? Читайте кейс сервиса Prodvigator....
05 11 2025 16:13:28
После нехитрых манипуляций с текстом вторая строка оказывается в заголовке....
04 11 2025 4:37:24
О построении персональных рекомендаций для интернет-магазина, используя технику со-визитов....
03 11 2025 2:24:28
Почему популярность электромобилей растет и как это связан с продажей углеродных квот...
02 11 2025 21:41:42
9 тревожных признаков того, что ваши подчиненные могут выгореть и уволиться. Обратите внимание и, возможно, не придется терять ценных для компании людей....
01 11 2025 4:57:58
Новости, доработки и обновления в услугах, блоге, Академии блога и Кластере....
31 10 2025 19:22:31
Seznam.cz — одна из пяти поисковых систем в мире, сумевших в отдельно взятой стране стать популярнее Google...
30 10 2025 15:58:22
Кейс по росту органического трафика на сайте интернет-магазина на платформе Summer Cart....
29 10 2025 0:14:49
Как за один час собрать самые популярные темы для информационных статей с помощью Serpstat и Key Collector?...
28 10 2025 15:23:42
Зачем размещаться на AppSumo и как запустить продукт в 2021 году? Лайфхаки по размещению, личный опыт и результаты по проведенной кампании...
27 10 2025 0:58:34
В продажах лучше визуализировать путь потребителя в виде нейронных сетей....
26 10 2025 5:18:34
Раньше покупка фолловеров, лайков, репостов строго осуждалась. Сегодня это обычное дело. Всё больше сервисов предлагают по приемлемой цене купить репутацию в соцсетях: от лайков в Instagram до фолловеров в твиттере. Покупка фолловеров аукнется мне в будущ...
25 10 2025 12:16:15
Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::
