SEO решения для страниц на основе AJAX

1. AJAX может негативно повлиять на SEO сайта
2. Доступные решения:
3. Используйте запасные страницы.
4. Создайте индексируемые страницы «hashbang».
5. Создайте общие URL-адреса, которые копируют текущее состояние UX.
6. Используйте функциональность pushState.
7. Заключение

Загрузка контента по требованию через AJAX (асинхронный Javascript и XML) или одностраничные фреймворки приложений (SPA) на основе Javascript позволяет легко создавать быстрые, быстрые, настраиваемые и удобные для пользователя сайты. Эти динамические веб-страницы обеспечивают отличный пользовательский опыт и функциональность сайта.

Они позволяют загружать отдельные элементы на странице без необходимости обновления, создавая простую в использовании страницу для клиентов. Например, Kayak.com загружает список цен и дат на странице на основе ваших дат поиска:

Другие примеры включают бесконечную прокрутку, с которой мы все знакомы в Facebook или Twitter, а также розничные продавцы электронной коммерции, такие как Uniqlo, которые позволяют вам просматривать весь мужской инвентарь на главной странице категории:

AJAX может негативно повлиять на SEO сайта

Проблема со страницами AJAX и SPA однако их сильные стороны могут в конечном итоге стать сдерживающим фактором для SEO сайта. Хотя Google постоянно расширяет свои возможности для сканирования сайтов, его боты по-прежнему не могут полностью анализировать javascript, в то время как сканеры других движков просто игнорируют javascript.

Различные состояния приложения AJAX обычно обозначаются в URL путем добавления хэштега. Для примера прокрутите вниз текущий Домашняя страница Flickr.com ; как вы можете видеть, хотя страница не обновляется и URL-адрес остается относительно тем же, номер раздела страницы добавляется к URL-адресу при прокрутке вниз:

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

Доступные решения:

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

Используйте запасные страницы.

Это статические HTML-страницы, которые загружаются, если запрашивающий ресурс (поисковые боты, старые браузеры, смартфоны и т. Д.) Не может проанализировать Javascript. Обычно это требует разработки сайта, использующего «прогрессивное улучшение», сайта, который отображает столько кода, сколько может обработать пользователь или браузер бота. Один из способов сделать это - использовать тег <noscript> вокруг важного контента. Тег <noscript> сообщает браузеру, что загружать, если разбор Javascript отключен. В качестве альтернативы, вы можете создать весь контент на странице в статическом HTML-формате, а затем использовать поверх него слой javascript, который запускается только тогда, когда пользовательский агент может его проанализировать, чтобы манипулировать существующим HTML-контентом в желаемом состоянии. Конечно, оба из этих решений может значительно увеличить время разработки и привести к некоторой степени раздувания кода.

Создайте индексируемые страницы «hashbang».

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

Создайте общие URL-адреса, которые копируют текущее состояние UX.

Можно программировать логику на стороне сервера, которая будет вызывать определенное состояние на любой странице; например, подумайте об общих URL-адресах YouTube, которые загружают определенный момент в видео. Эти настраиваемые URL-адреса затем можно сделать доступными для совместного использования, чтобы внешние ссылки на страницу могли сообщать поисковым системам об их индексации. Опять же, время разработки здесь не обязательно оправдывает выгоды.

Используйте функциональность pushState.

HTML5 позволяет использовать функциональность pushState для веб-страниц, которая заменяет добавленный по умолчанию хештег, который отображается в браузере, помещая на его место пользовательский URL-адрес. Это сохраняет функциональность Javascript путем загрузки URL-адреса в браузер без принудительного полного обновления страницы. Для этого необходимы современные браузеры, как и многие AJAX-сайты, а также дополнительное время разработки для создания правил для создания динамических URL-адресов push-состояния. Это одна из наиболее популярных функций в HTML5, которая становится решением проблемы.

Заключение

Использование Javascript на страницах, основанных на AJAX или SPA, позволяет создать стильный современный веб-сайт, который ожидает все больше и больше потребителей. Хотя могут возникнуть некоторые технические проблемы, когда речь заходит о SEO, существует множество приемлемых решений этих проблем, чтобы обеспечить вашему сайту правильный баланс пользовательского опыта и поисковой оптимизации.

Похожие

Комментарии