Сначала контент в интернете разбивали по страницам — это называется пагинация. Затем появился бесконечный скролл, когда контент подгружается по мере прокрутки страницы, и его вариация — подгрузка по нажатию кнопки. Разбираемся, какие у них плюсы и минусы и когда что лучше использовать.
Пагинация
Постраничная навигация разбивает контент на отдельные страницы, когда его становится слишком много. Так часто бывает на информационных сайтах, в поисковых системах или интернет-магазинах.
Есть несколько видов такого разбиения:
- нумерация страниц в прямом или обратном порядке — от первой к последней или наоборот;
- диапазоны в прямом или обратном порядке;
- по алфавиту;
- точки.
Ни один из них не имеет существенного преимущества перед остальными. Выбор конкретного вида разбиения может зависеть от того, как устроен сайт, как им пользуются и какие у него задачи. Например, разбиение по алфавиту может быть удобнее в каталоге книжного магазина.
Бывает, что пользователь сайта может выбрать, сколько единиц информации выводить на странице и в каком порядке, и представление сайта зависит от этого выбора.
У пагинации есть много плюсов, из-за чего она используется до сих пор:
- Если информация как-то ранжируется, польза первых страниц очевидна. Считается, что результаты поиска на первой странице выдачи поисковой системы будут чем-то лучше, чем на следующих.
- Контент разбивается на части, что облегчает его обработку. Можно приблизительно запомнить, на какой странице отображалось что-то конкретное, так что к ней легко вернуться при повторном поиске. Это проще, чем просматривать бесконечный список.
- Каждая порция информации имеет собственную страницу и URL-адрес. Это удобно, если нужно поделиться ссылкой.
- Страница загружается быстрее. С пагинацией производительность сайта растёт, так как одновременно нужно загружать меньше данных. С более быстрой загрузкой страниц навигация по сайту более плавная.
- Можно оценить количество информации на сайте. Когда мы видим, сколько страниц можно просмотреть, нам легче представить примерный общий объём и сколько времени предстоит потратить.
А теперь про минусы, они тоже есть:
- Большинство пользователей не открывает страницы дальше второй или третьей. Это обратная сторона очевидной пользы первых страниц — если они лучше, часто непонятно, зачем просматривать остальные.
- Плохие результаты индексации. Страницы, которые находятся в нескольких кликах от той, на которую попадёт пользователь, обычно занимают не очень высокие позиции в поисковых системах.
- От пользователя требуются дополнительные действия. Если страниц много, на странице могут отображаться ссылки только на часть из них. Чтобы перейти на остальные страницы, нужно нажать на кнопки «Дальше» или «В начало».
- Пагинацией неудобно пользоваться на мобильных устройствах. При просмотре контента на смартфоне или планшете нам привычнее листать и смахивать, чем нажимать на кнопки.
Бесконечная прокрутка
При бесконечной прокрутке контент отображается в одном потоке, и создаётся впечатление, что у него нет предела. Новые порции контента подгружаются сами по мере того, как пользователь прокручивает страницу.
Результаты поиска в Гугле отображаются бесконечно
Бесконечную прокрутку за счёт её плюсов чаще всего можно встретить на развлекательных и новостных ресурсах, а также в социальных сетях:
- Пользователь погружается в информационный поток и забывает о времени, проведённом на сайте.
- От пользователя не требуется дополнительных действий, кроме листания.
- Это самый удобный способ просмотра контента на смартфоне и планшете с точки зрения использования устройства.
Но есть и минусы:
- По мере прокрутки количество порций данных увеличивается, страница становится тяжелее, и сайт может работать медленнее. Представьте, что вы прокрутили вниз примерно 50 экранов — и многое из этого браузеру приходится хранить в памяти (или выгружать куда-то, что тоже может повлиять на удобство использования).
- Поисковые роботы не умеют имитировать поведение человека на таких страницах, проще говоря — они не умеют бесконечно скроллить. Контент на сайте нужно настраивать для индексации.
- Если загружено много порций, уже просмотренную информацию сложнее найти. При постраничной навигации можно примерно помнить, где был какой-то контент, а при прокрутке это невозможно — мы не запоминаем, сколько экранов назад что-то видели.
- Чтобы вернуться в начало страницы, нужно либо прокрутить наверх всю подгруженную информацию, либо перезагрузить страницу.
- Подвал сайта становится бесполезным — пользователь до него просто не доберётся :-) Если там расположены разделы с контактной информацией, условиями использования и всем остальным, ссылки на них нужно дублировать в шапке сайта.
Дополнительная загрузка
Дополнительная загрузка контента происходит не по мере того, как пользователь достигает конца уже загруженного, а по нажатию какой-то кнопки, например «Загрузить ещё» или «Показать больше».
На сайте «Кода» — как раз дополнительная загрузка контента
Дополнительную загрузку можно назвать компромиссом между пагинацией и бесконечной прокруткой. У неё есть свои плюсы:
- Подгрузка контента по кнопке добавляет результаты для отображения, а не заменяет их, как в случае с пагинацией. Чтобы вернуться к предыдущим результатам, достаточно прокрутить страницу вверх, а не возвращаться на предыдущую.
- Есть доступ к подвалу сайта, поэтому на его нижнем колонтитуле можно расположить ссылки на важные разделы, и эти ссылки можно будет увидеть.
- Одна кнопка на странице обычно больше нескольких с постраничной навигацией, её легче нажимать.
Минусы тоже есть:
- От пользователя всё-таки требуются какие-то действия, помимо листания страницы.
- Сложно найти ранее просмотренный результат по памяти.
- Вовлечённость пользователя меньше, чем при бесконечной прокрутке.
Как это сделать технически
Любой из видов разбиения контента на порции можно реализовать с помощью основных технологий, которые используются в веб-разработке. Классический вариант — реализовать нужное разбиение при помощи JavaScript, HTML и CSS, но вместо JavaScript можно использовать и Python, и PHP, и AJAX и так далее.
Основные готовые движки для сайтов имеют встроенные или дополнительно скачиваемые плагины, которые достаточно настроить соответствующим образом, чтобы на сайте появилась постраничная навигация, бесконечная прокрутка или дополнительная загрузка.
А что лучше?
Как обычно, всё зависит от задач:
- если нужна структурность, очевидная навигация и разбивка на одинаковые порции — то пагинация;
- если нужно максимально долго удержать читателя на сайте — то бесконечная прокрутка (именно так делают все соцсети);
- если хочется бесконечности, но нужен подвал (или нужно измерить, насколько глубоко читатель хочет изучить сайт) — то дополнительная загрузка.
А вообще перед настройкой такого на сайте надо посоветоваться с SEO-специалистами: скорее всего, у них уже будет ответ, что именно сработает лучше конкретно в вашем случае.