Россия+7 (495) 960-65-87

Волшебное колесико: нужен ли бесконечный скроллинг?

Россия+7 (495) 960-65-87
Шрифт:
2 8087

По мнению Нейла Пателя, сооснователя KISSmetrics и CrazyEgg, одной из наиболее популярных идей в веб-отрасли является бесконечная прокрутка на сайтах. Но насколько она хороша? По словам Пателя, он бы сделал выбор в сторону «старомодного» сайта с хорошими позициями, чем навороченный веб-ресурс, болтающийся глубоко в подвале поисковой выдачи.

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

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

Нейл Патель приводит следующие примеры сайтов с подобным скроллингом:

  • Twitter, где можно держать прокрутку, а страница будет идти по нарастающей;
  • Facebook — наверное, это один из секретов его популярности, считает Патель;
  • Конечно же Pinterest;
  • Google также использует бесконечный скроллинг, предлагая таким образом искать картинки.

Twitter:

nnneilpateltwitter.jpg

Facebook:

neilikpatel.jpg

Pinterest:

pipinterest.jpg

Google:

pppinguinssss.jpg

По мнению г-на Пателя, эффективность бесконечной прокрутки хорошо видна на новостных сайтах. Например, на Mashable:

masssshable.jpg

Или сайт магазина Axara:

ax[xara.jpg

По словам Нейля Пателя бесконечная прокрутка настолько идеальна, что возникают некоторые подозрения. Он прав. Проблемы есть.

Конфликт SEO и бесконечной прокрутки

Для того чтобы реализовать бесконечную прокрутку, наиболее часто используют JavaScript. А сайты с ним не совсем корректно индексируются Google, говорит Нейл Патель.

Сам Патель предлагает размещать содержимое, которое сканируют роботы Google, в основном HTML коде. Наиболее подходящие вкладки при этом — JQuery, а не AJAX. Все это облегчит Google доступ к индексируемому контенту.

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

Шаг № 1: Определите, как разделить ваш контент

Разделите контент на отдельные страницы. Определитесь с количеством контента на каждой из них. Важно, чтобы их можно было просматривать при отключенном java-скрипте.

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

Шаг № 2: структурируйте URL для бесконечной прокрутки

URL должен видоизменяться в соответствии с прокручиваемыми страницами. Соответственно для каждой страницы будет создаваться уникальный (и обязательно полный!) URL.

Примеры хороших адресов:

  • example.com/category?name=fun-items&page=1,
  • example.com/fun-items?lastid=567.

Пример плохого адреса:

  • example.com/fun-items#1

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

  • example.com/category/page.php?name=fun-items&days-ago=3.

Создавая URL-адрес, не стоит вставлять в него ненужные элементы. Например, такие:

  • example.com/fun-places?radius=5&lat=40.71&long=-73.40.

URL у каждой отдельной страницы должен быть полным. Возможно добавление к URL-адресу нумерации страниц или идентификаторов.

Шаг № 3: Каждая страница должна содержать разбивки rel=next и rel=prev в заголовочных тегах head

Эти разбивки Нейл Патель считает довольно серьезной гарантией того, что поисковые роботы Google проиндексируют содержание на каждой странице. Посредством разбивок сообщается о том, что адреса каждой страницы взаимосвязаны между собой.

Важно — разбивки должны быть именно в <head>, а не в <body>. В последнем случае поисковики просто не проиндексируют контент.

Шаг № 4: Использование PushState/ ReplaceState на бесконечной странице прокрутки

Метод PushState (добавляет новую запись в историю посещений сайта) загружает новое содержание строго в последовательности по нумерации страниц. Говоря проще — PushState управляет в браузере загрузкой контента и его отображением.

Наряду с PushState многие используют метод ReplaceState — он изменяет текущую запись в истории посещений и позволяет возвращаться на страницы, загруженные ранее.

Шаг № 5: Тестируем

По словам Нейла Пателя, лучшее средство для проверки эффективности бесконечной прокрутки — соответствие правилам поисковой оптимизации. Наиболее важные пункты:

Если пользователь набирает ошибочный URL, скажем, отсылающий на несуществующую страницу, то должна появиться «ошибка 404».

Влияние бесконечной прокрутки на юзабилити.


Вывод

Нейл Патель подытоживает, что бесконечная прокрутка может работать на популярность сайта, но не стоит считать, будто такой скролл идеально подходит для вашего ресурса. Всё зависит от того, что конкретно вы хотите достичь с помощью вашего ресурса? Цели сайта и ожидания пользователя — вот два главных критерия, которые нужно учитывать при реализации бесконечной прокрутки.


(Голосов: 5, Рейтинг: 5)
Читайте нас в Telegram - digital_bar

Есть о чем рассказать? Тогда присылайте свои материалы Даше Калинской


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
  • Гость
    больше года назад
    А как же "открыть в новой вкладке"?)
    -
    1
    +
    Ответить
  • Сергей
    больше года назад
    Если навигация не продумана, бесконечный скроллинг бесит. Предположим, где то после скролла 4х страниц находишь интересную статью. ниже статьи идет еще одна, которую тоже хочу почитать. Мы заходим в самую первую статью, читаем, все ок. А теперь, чтобы попасть на следующую статью, нужно снова перейти в раздел, скроллить, ждать пока это все прогрузится и наконец то, зайти в другую статью... Да ну ее лесом, закрываешь - больше не приходишь.
    -
    1
    +
    Ответить
ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
Google Data Studio: делаем красивые отчеты по контекстной рекламе для клиентов
Askar Seitov
1
комментарий
0
читателей
Полный профиль
Askar Seitov - помогите! не могу понять почему по инструкции в вашей статье добавляю вычистяемые поля просто копирую ваш код, но датастудио выдает ошибку на этот код: Синтаксическая ошибка: Недопустимый входной символ. Убедитесь, что в формуле нет кавычек-лапок.. как это исправить? я все варианты кавычек уже попробовал
#SEOnews14: мы празднуем – вы получаете подарки!
Rizat Sundetov
1
комментарий
0
читателей
Полный профиль
Rizat Sundetov - 14
Как ускорить сайт на WordPress, чтобы получить 100/100 в Google PageSpeed Insights
1qa
1
комментарий
0
читателей
Полный профиль
1qa - 87 Performance 95 Accessibility 79 Best Practices 95 SEO аудит точнее будет
Война с дубликатами. Как нужно и как не нужно канонизировать URL
Дмитрий
1
комментарий
0
читателей
Полный профиль
Дмитрий - Здравствуйте, на сайте возможно несколькими путями дойти до почти одинаковой страницы, те отличаться будет только незначительная часть H1, а контент будет одинаковым, дело в применимости автозапчастей к разным автомобилям. Что из этого будет каноничной ссылкой и какие есть пути для решения подобных ситуаций? 1 - bpauto.ru/catalog/audi/audi-a6/a6-iv-c7-sedan-2011-2014/kuzov-naruzhnaya-chast/dveri-i-komplektuyushchie/dver-perednyaya-levaya/ 2 - bpauto.ru/catalog/audi/audi-a6/a6-iv-c7-rest-sedan-2014-n-v-/kuzov-naruzhnaya-chast/dveri-i-komplektuyushchie/dver-perednyaya-levaya/
Как выбрать подрядчика для продвижения сайта: 7 уровней воронки поиска
aashutosh
1
комментарий
0
читателей
Полный профиль
aashutosh - data science training institute in noida- Webtrackker Technology (8802820025) providing Data Science Training in Noida. Get ✓ 40 Hours Learning training✓ 70 Hrs Projects ✓ 24 X 7 Support ✓ Job Assistance. WEBTRACKKER TECHNOLOGY (P) LTD. C - 67, sector- 63, Noida, India. E-47 Sector 3, Noida, India. +91 - 8802820025 0120-433-0760 +91 - 8810252423 012 - 04204716 EMAIL:info@webtrackker.com webtrackker.com/Best-Data-Science-Training-Institute-in-Noida.php
Как построить качественный ссылочный профиль на основе конкурентов
Ирина
5
комментариев
0
читателей
Полный профиль
Ирина - Давно сотрудничаю с megaindex.com и считаю данный сервис одним из лучших в сео сегменте рунета да и не только рунета. Пользуюсь их инструментами для аналитики своих работ и выявлению своих и чужих ошибок. Да и ссылочный профиль, как и говорится в данной статье сделать гораздо проще и правильней при помощи как раз мегаиндекса. Добавлю еще что инструмент для поиска конкурентов у мегаиндекса очень удобный и простой в применении.
Как я пытался купить CRM-систему, но мне ее поленились продать
Kristina
1
комментарий
0
читателей
Полный профиль
Kristina - Очень рекомендую CRM-систему польской фирмы Firmao. Все функции настраиваются в соответствии с индивидуальным потребностям компании! Советую попробовать бесплатную демо-версию, чтобы попробовать все необходимые функции, без лишних кнопок и траты дополнительных финансов! :) Сайт: firmao.ru/info
Чек-лист для аудита рекламных кампаний в Яндекс.Директе и Google Ads
Елена Бикташева
1
комментарий
0
читателей
Полный профиль
Елена Бикташева - Спасибо! Была бы еще возможность скачивания.
6 советов по продвижению сайта в Google
Алексей Махметхажиев
1
комментарий
0
читателей
Полный профиль
Алексей Махметхажиев - Спасибо за статью! Конечно, измерять одним только гуглом скорость нельзя. Я измеряю PageSpeed + GTmetrix + loading.express. Так же надо следить за скоростью ответат сервера. Я использую ping-admin им можно мониторить падения сайта тоже.
6 причин, почему нет позиций и трафика
Артур Латыпов
0
комментариев
0
читателей
Полный профиль
Артур Латыпов - Леонид, да 3 пункта повторяется, согласен. Но сильно актуальны и сейчас, смотрим на сайты, приходящие на SEO, которые ранее продвигались, практически на всех можно что из 6 пунктов найти, исправить и ситуация улучшиться оперативно.
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
373
Комментариев
353
Комментариев
262
Комментариев
249
Комментариев
171
Комментариев
156
Комментариев
137
Комментариев
121
Комментариев
105
Комментариев
97
Комментариев
97
Комментариев
96
Комментариев
80
Комментариев
77
Комментариев
69
Комментариев
67
Комментариев
60
Комментариев
59
Комментариев
57
Комментариев
55

Отправьте отзыв!
Отправьте отзыв!