Сайт на 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.



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

Продвижение мобильного приложения: как вовлечь пользователей с помощью рекламы в Facebook?

Реклама Facebook для вовлечения пользователей помогает привлечь внимание к приложению и удержать пользователей в условиях перенасыщенного рынка....

15 03 2025 13:21:50

Как использовать социальное доказательство в email-маркетинге

Как использовать социальное доказательство в email-маркетинге Рассказываем о приемах, которые помогут вам заинтересовать читателей рассылки....

14 03 2025 23:18:59

«Покажи свою работу»: Юрий Грузинский, руководитель отдела по работе с крупными клиентами

«Покажи свою работу»: Юрий Грузинский, руководитель отдела по работе с крупными клиентами Как построить самостоятельную комaнду и научиться спокойно делегировать...

13 03 2025 7:58:25

Что такое внутренние дубли страниц и как с ними бороться?

Что такое внутренние дубли страниц и как с ними бороться? Анализ содержимого сайта показывает: Url разные, а контент страниц одинаковый. Думаете, ничего страшного? Но одинаковый контент может попасть под фильтры поисковых систем. Чтобы этого не произошло, надо знать, как избавляться от внутренних дублей...

12 03 2025 22:28:59

CEO of Ringostat Александр Максименюк: кому и зачем нужен Call Tracking

CEO of Ringostat Александр Максименюк: кому и зачем нужен Call Tracking 79% владельцев смартфонов, если верить Google, используют их для покупок или заказов услуг. Это более двух миллиардов человек. Ничего удивительного, что даже Google запустил собственный сервис Call Tracking. Кому и зачем жизненно важно отслеживать звонки...

11 03 2025 3:56:48

Как сэкономить бюджет на рекламу в Google Ads — 30 тысяч минус-площадок, каналов YouTube, сайтов, приложений

Как сэкономить бюджет на рекламу в Google Ads — 30 тысяч минус-площадок, каналов YouTube, сайтов, приложений Как исключить показы на нецелевых площадках в новом интерфейсе Google Ads. В конце статьи 30 000 минус-площадок, каналов YouTube, сайтов, приложений...

10 03 2025 2:12:28

Cколько стоил клик в Google Ads и Яндекс.Директ в Казахстане в третьем квартале 2017

Cколько стоил клик в Google Ads и Яндекс.Директ в Казахстане в третьем квартале 2017 Казахстанские реалии: данные по более 1 млн кликов в 23 тематиках и 15 городах....

09 03 2025 6:38:42

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

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

08 03 2025 2:26:42

Как узнать реальную эффективность рекламы с помощью отслеживания звонков — кейс Planeta Hobby

Как узнать реальную эффективность рекламы с помощью отслеживания звонков — кейс Planeta Hobby Звук телефонного звонка важен и для пользователя интернета. Как точно рассчитать полученную прибыль и рентабельность инвестиций в рекламу...

07 03 2025 20:21:21

Эти странные соцсети: явления в интернете, которые формируют тренды и нашу действительность

Эти странные соцсети: явления в интернете, которые формируют тренды и нашу действительность Подборка ненаучных наблюдений и ситуаций, в которых бывал каждый из нас...

06 03 2025 3:11:18

Контекстная реклама — что это, как выглядит, как работает.

Контекстная реклама — что это, как выглядит, как работает. Всё что нужно знать про контекстную рекламу — Как выглядит, какая бывает, сколько стоит, популярные сервисы и др....

05 03 2025 22:39:47

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

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

04 03 2025 3:31:52

Как продвигать мобильное приложение с ограниченным бюджетом? Руководство для новичков

Как продвигать мобильное приложение с ограниченным бюджетом? Руководство для новичков Программа покорения онлайн мира мобайла — самому и с ограниченными средствами на маркетинг...

03 03 2025 15:34:30

Дополнительные ценности Netpeak — что вы получаете при заказе [SEO 2.0] вместе с поисковым продвижением

Дополнительные ценности Netpeak — что вы получаете при заказе [SEO 2.0] вместе с поисковым продвижением В коробку [SEO 2.0] вместе с самим поисковым продвижением входят дополнительные ценности Netpeak: унифицированные действия по увеличению продаж, улучшения удобства работы и преимущества бренда Netpeak...

02 03 2025 22:16:19

Топ 5 лучших вебинаров для онлайн-предпринимателей

Топ 5 лучших вебинаров для онлайн-предпринимателей Бесплатный образовательный проект для предпринимателей Netpeak Cluster предлагает пять своих лучших вебинаров о нюансах онлайн-продвижения...

01 03 2025 23:38:36

Как с помощью Google Earth собрать контакты для email-рассылок и холодных звонков

Как с помощью Google Earth собрать контакты для email-рассылок и холодных звонков Проверенный способ для сбора базы данных. Метод, с помощью которого можно извлечь контактные данные, а именно: название точки, телефон, адрес, сайт., а потом высылать своё КП, промокоды для акции, сообщить о выходе товара, сделать спецпредложение...

28 02 2025 17:57:39

Что делать, если приложение удалили из Google Play или App Store

Что делать, если приложение удалили из Google Play или App Store Есть ли шанс на апелляцию...

27 02 2025 7:49:40

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

Английский язык — два упражнения для пополнения словарного запаса и развития разговорной речи Улучшайте свой уровень английского. Упражнения для В1 — Intermediate («Средний+»). Узнать больше!...

26 02 2025 22:30:48

200 лучших минус-слов в Google Рекламе

200 лучших минус-слов в Google Рекламе Список минус-слов для Google Рекламы для B2B сайтов....

25 02 2025 4:17:53

Как создать личный бренд в компании — кейс Алексея Селезнёва, руководителя отдела аналитики Netpeak

Как создать личный бренд в компании — кейс Алексея Селезнёва, руководителя отдела аналитики Netpeak Создание репутации крутого специалиста — дело рук крутого специалиста....

24 02 2025 0:50:12

Гонитесь за гарантией и прозрачностью в SEO-услугах? А их нет!

Гарантии результата в SEO: миф или реальность. Спрос рождает предложение, поэтому не удивительно, что существует большое количество SEO-студий. Сразу возникает резонный вопрос, как могут существовать те компании, которые не дают гарантии вообще?...

23 02 2025 14:18:19

Как мы увеличили ROMI на 433% в рентабельных рекламных кампаниях: кейс интернет-магазина ФК «Динамо» (Киев)

Как мы увеличили ROMI на 433% в рентабельных рекламных кампаниях: кейс интернет-магазина ФК «Динамо» (Киев) Фубольный клуб. Как увеличить ROMI (возврат маркетинговых инвестиций) в рекламных кампаниях — рассказываем на примере киевского интернет-магазина «Динамо»...

22 02 2025 3:24:18

Что такое XML-feed: как его создать и отредактировать

Что такое XML-feed: как его создать и отредактировать XML-фид представляет собой файл с кодом на языке XML, ссылку на который используют в различных сервисах...

21 02 2025 5:47:23

WolframAlpha или Вычислительная Теория Всего

Гениальный математик создал систему, которая вполне может конкурировать с Google — Wolfram|Alpha. Или нет? Это не поисковик, тогда при чем здесь Гугл и теория вычислимости?...

20 02 2025 0:33:16

Кейс: настраиваем ремаркетинг на брошенную корзину

Кейс: настраиваем ремаркетинг на брошенную корзину Как узнать срок хранения товаров в корзине и настроить ремаркетинг для завершения покупок...

19 02 2025 4:41:20

Строительство и ремонт — чтобы сайт в этой нише продавал, достаточно просто...

Строительство и ремонт — чтобы сайт в этой нише продавал, достаточно просто... Персональная стратегия продвижения онлайн с помощью SEO и контекстной рекламы....

18 02 2025 5:16:20

Как сформировать комaнду департамента маркетинга для международной компании

Как сформировать комaнду департамента маркетинга для международной компании Поговорим о soft skills, потому что именно они, исходя из моего опыта, помогают строить поистине сильные комaнды....

17 02 2025 8:41:46

CEO fuckups. Три ошибки опытных руководителей

И как с ними справиться. Рабочие инструкции для Chief Executive Office и менеджеров в целом. Давайте управлять комaндой и собой более эффективно и без выгорания. Узнать больше!...

16 02 2025 3:31:29

Как наполнять контент-план — мнения редакторов

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

15 02 2025 0:38:20

5 советов для специалистов по контекстной рекламе

5 советов для специалистов по контекстной рекламе Полезные советы для тех, кто делает контекст своими ручками :)...

14 02 2025 1:45:28

Как с помощью Google Tag Manager отследить отправку формы на сайте

Отслеживание конверсий: покупка, подписка на рассылку, отправка контактных данных и другое....

13 02 2025 18:41:16

Чек-лист SMM-стратегии: готовимся к продвижению в соцсетях

Чек-лист SMM-стратегии: готовимся к продвижению в соцсетях 14 пунктов, которые помогут вам лучше изучить свой бизнес и подготовить эффективную SMM-стратегию...

12 02 2025 19:38:10

Что такое логическая структура сайта и зачем она нужна

Что такое логическая структура сайта и зачем она нужна Базовые знания, которые нужны, чтобы ресурс понравился поисковикам и пользователям....

11 02 2025 14:58:23

Бизнес и экология. В компании Herman Miller наняли на работу пчёл

Бизнес и экология. В компании Herman Miller наняли на работу пчёл Сортировка мусора, использование велосипедов вместо автомобилей, озеленение города... В Украине, как правило, так представляют экофрендли бизнес. Зарубежные компании идут дальше....

10 02 2025 2:48:53

Деcять неочевидных и пpaктически применимых PPC-фишек — круглый стол 8P 2018

Деcять неочевидных и пpaктически применимых PPC-фишек — круглый стол 8P 2018 Проверенные лайфхаки по платному трафику от спикеров и участников конференции 8P 2018...

09 02 2025 3:46:12

Обзор трех новых типов микроразметки schema.org

Обзор трех новых типов микроразметки schema.org FAQ (frequently asked questions), HowTo и Q&A (questions and answers)....

08 02 2025 8:13:46

Правила видеомаркетинга для B2B, B2C-сегмента и кейс с ограниченным бюджетом на 150 тысяч просмотров

Правила видеомаркетинга для B2B, B2C-сегмента и кейс с ограниченным бюджетом на 150 тысяч просмотров Интеграция видео в маркетинговую кампанию – решение, которое повысит ценность каждого посетителя сайта....

07 02 2025 20:48:35

Как редизайн повысил доход от SEO — кейс по юзабилити

Как редизайн повысил доход от SEO — кейс по юзабилити Считаем SEO-эффект от нового дизайна сайта и работы над usability...

06 02 2025 3:48:15

Кейс Sportcenter Store — рост транзакций на 295% с помощью платной рекламы

Быстро разогнать рекламные кампании и получить рост конверсий при повышении CPA до 100%. Как этого добиться — читайте в новом кейсе....

05 02 2025 10:57:20

Как быстро получать самую актуальную информацию от 105 топовых блогов Рунета про интернет-маркетинг

Как быстро получать самую актуальную информацию от 105 топовых блогов Рунета про интернет-маркетинг Самые популярные блоги Рунета по интернет-маркетингу — все RSS-фиды в одном месте...

04 02 2025 3:31:15

8 сервисов автопроверки on-page ошибок

Платные и бесплатные способы ускорить оптимизацию....

03 02 2025 1:30:54

Типы рекламных кампаний в Facebook и Instagram

Гайд по типам рекламы в соцсетях для SMM-, PPC-специалистов, блогеров и владельцев бизнеса в зависимости от целей, которые вы ставите перед продвижением. С конкретными рекомендациями и примерами. Узнать больше!...

02 02 2025 16:30:28

Google Колибри — все, что вы хотели знать о новом алгоритме

Мы решили определить и раскрыть самые популярные вопросы по работе нового алгоритма Google Колибри...

01 02 2025 11:39:32

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

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

31 01 2025 0:58:19

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

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

30 01 2025 12:30:55

Как строить диаграммы в отдельных ячейках Excel и таблицах Google

Как строить диаграммы в отдельных ячейках Excel и таблицах Google Что такое спарклайны, об организации прострaнcтва на рабочем листе и оптимизации времени на изучение данных в экселе и таблицах Google...

29 01 2025 7:29:32

Блоги, каналы и паблики об интернет-маркетинге — читательский рейтинг

Блоги, каналы и паблики об интернет-маркетинге — читательский рейтинг Думаете, что почитать об онлайн-продвижении и диджитал-маркетинге? Вам сюда. Мы собрали топ интересных сайтов, блогов, каналов и пабликов...

28 01 2025 7:55:13

Как оценить новый канал трафика?

Как оценить новый канал трафика? Эффективен ли ваш канал привлечения трафика? Лучше писать об этом с помощью формул...

27 01 2025 20:23:58

Какие данные о пользователях можно собирать сайтам, а какие — нет

Какие данные о пользователях можно собирать сайтам, а какие — нет General Data Protection Regulation (GDPR): ответы на вопросы....

26 01 2025 12:11:18

Как написать обзор товара

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

25 01 2025 0:23:41

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