Кажется, что способ листать каталог — мелочь дизайна: поставили бесконечную прокрутку, потому что «так модно», и забыли. Но именно этот выбор тихо влияет на то, доходит ли покупатель до нужного товара, видит ли футер с гарантиями и находит ли ваши категории поисковый робот. На больших каталогах неудачная навигация превращается в подтормаживающую страницу, с которой уходят, не долистав до конца.
В этой статье разбираем три подхода — постраничную пагинацию, бесконечную прокрутку и кнопку «Показать ещё» — применительно к магазину на 1С-Битрикс: как каждый влияет на конверсию, SEO и скорость, как это ложится на компонент catalog.section и умный фильтр. Если каталог уже тормозит, начать стоит с аудита и оптимизации 1С-Битрикс, а этот материал поможет принять решение осознанно.
Коротко
- Пагинация — самый безопасный вариант для SEO и скорости: реальные ссылки на страницы, предсказуемый размер DOM.
- Бесконечная прокрутка удобна для лент-открытий, но вредит доступу к футеру, скорости и восстановлению позиции.
- «Показать ещё» — золотая середина: подгрузка по клику при сохранении постраничных ссылок для роботов.
- Любой скролл и «Показать ещё» обязательно дублируют настоящей пагинацией, иначе часть товаров выпадет из индекса.
Почему навигация по каталогу — это про деньги
Список товаров — это не просто «стена карточек». Через него покупатель принимает решение: сравнивает, отсеивает, доходит до сортировки и фильтров, а в конце — до подвала с условиями доставки и гарантий. Способ навигации определяет, насколько легко пройти этот путь. Если страница разрастается бесконечно, до футера не добраться; если каждый переход перезагружает всё заново — устаёшь кликать.
Для интернет-магазина на 1С-Битрikс это ещё и вопрос техники: каждая подгрузка — запрос к торговому каталогу, к ценам и остаткам, к умному фильтру. Чем чаще и тяжелее эти запросы, тем медленнее витрина и тем выше нагрузка на сервер. Поэтому выбор навигации — это одновременно решение про UX, про SEO и про производительность.
Три подхода: коротко о каждом
- Пагинация. Каталог разбит на страницы с номерами; переход по ссылке загружает новую выборку. Классика, понятная и роботам, и людям.
- Бесконечная прокрутка. Новые карточки подгружаются автоматически, как только пользователь долистывает до конца. Лента без явного конца.
- «Показать ещё». Внизу списка кнопка; клик подгружает следующую порцию карточек в конец. Подгрузка по требованию, а не автоматически.
Дальше — по каждому подробно: где выигрывает, где проваливается и кому подходит.
Классическая пагинация
Пагинация делит каталог на фиксированные страницы с адресами вида ?PAGEN_1=2 или ЧПУ /page-2/. Это самый предсказуемый и «дружелюбный к поиску» способ.
Сильные стороны
- Прозрачно для SEO. Каждая страница — реальный URL, по которому робот проходит и индексирует товары.
- Стабильная скорость. На странице всегда фиксированное число карточек, DOM не разрастается.
- Легко вернуться. Номер страницы в URL — можно поделиться, добавить в закладки, восстановить после возврата из карточки.
- Доступ к футеру. Подвал сайта всегда достижим, что важно для доверия и внутренней перелинковки.
Слабые стороны
- Больше кликов при глубоком просмотре — «пролистать 500 товаров» неудобно.
- На мобильных мелкие номера страниц труднее нажимать.
Бесконечная прокрутка
Скролл подгружает контент сам, создавая ощущение непрерывной ленты. Это отлично работает в соцсетях и «залипательных» лентах, но в товарном каталоге у него серьёзные издержки.
Где выигрывает
- Погружение. Для сценария «просто посмотреть, что есть» ничего не отвлекает, карточки идут потоком.
- Меньше кликов. Пользователь ничего не нажимает — контент появляется сам.
Где проваливается
- Футер недостижим. Подвал «убегает» вниз, до контактов и условий не доскроллить.
- Разрастание DOM. Сотни карточек в памяти тормозят браузер, особенно на слабых телефонах — страдает отзывчивость (INP).
- Потеря позиции. Возврат из карточки товара часто выбрасывает в начало ленты.
- Риск для SEO. Если товары появляются только скриптом без ссылок, робот может их не увидеть.
Кнопка «Показать ещё»
Это компромисс между двумя крайностями. Список подгружается порциями, но только когда пользователь сам нажимает кнопку. Он контролирует процесс, а страница не растёт «сама по себе».
- Контроль пользователя. Подгрузка по требованию, без внезапного роста страницы.
- Доступ к футеру. После нескольких порций пользователь останавливается и спокойно доходит до подвала.
- Совместимость с SEO. Кнопка меняет параметр страницы, а в разметке остаются постраничные ссылки для роботов.
- Плавный UX. Карточки дописываются в конец без перезагрузки, состояние отражается в URL.
На практике «Показать ещё» — самый универсальный выбор для товарного каталога на 1С-Битрикс: он совмещает удобство подгрузки и предсказуемость пагинации.
Сравнительная таблица
| Критерий | Пагинация | Бесконечная прокрутка | «Показать ещё» |
|---|---|---|---|
| SEO из коробки | Отлично | Рискованно | Хорошо |
| Скорость / DOM | Стабильно | Разрастается | Контролируемо |
| Доступ к футеру | Всегда | Затруднён | Есть |
| Возврат к позиции | Просто | Сложно | Просто |
| Ощущение прогресса | Явное | Отсутствует | Явное |
| Кому подходит | Целевой выбор | Ленты-открытия | Универсально |
SEO: как не потерять товары в индексе
Главный риск любой JavaScript-подгрузки — что робот не увидит контент со второго и последующих экранов. В 1С-Битрикс постраничная навигация компонента catalog.section генерирует настоящие ссылки на страницы, и их нельзя выбрасывать ради красоты.
- Оставляйте постраничные ссылки. Даже при скролле и «Показать ещё» в разметке должны быть реальные
<a href>на страницы 2, 3, N. - Каноничность. Каждая страница пагинации указывает канонический URL на себя, а не на первую — иначе товары со страниц 2+ теряют путь в индекс.
- ЧПУ. Человекопонятные адреса страниц читаются лучше, чем длинные GET-параметры.
- Умный фильтр. Комбинации фильтра с пагинацией нужно грамотно закрывать от индексации, иначе плодятся дубли.
Тема дублей и канонических адресов в каталоге обширна — умный фильтр умеет плодить тысячи почти одинаковых URL. Как это контролировать, мы разбираем в связке с настройкой ЧПУ и правил индексации.
Скорость и Core Web Vitals
Навигация напрямую бьёт по метрикам скорости. Бесконечная прокрутка постоянно добавляет DOM-узлы: чем дольше листаешь, тем тяжелее страница и хуже отзывчивость на действия. Пагинация держит фиксированный объём, поэтому предсказуемо быстрее.
На 1С-Битрikс скорость витрины сильно выигрывает от композитного сайта: статическая часть страницы (шапка, каркас, фильтры) отдаётся из кэша мгновенно, а карточки и динамика (цена, наличие) догружаются отдельно. Подгрузка «Показать ещё» ложится на эту модель естественно — она и так асинхронная. Правильно настроенный кэш компонентов и тегированное кэширование торгового каталога снимают нагрузку с базы при каждой подгрузке. Про инфраструктуру, которая держит быструю витрину, полезно почитать в статье про хостинг и инфраструктуру BitrixVM.
Реализация в компоненте catalog.section
Штатный компонент bitrix:catalog.section из коробки поддерживает все три режима — вопрос в настройке параметров постраничной навигации и шаблона.
- Задайте размер выборки. Число элементов на странице кратно сетке (например, 24 или 36 при 3–4 колонках).
- Выберите режим навигации. Классические номера страниц, режим подгрузки по кнопке или их гибрид — в параметрах компонента и шаблоне.
- Сохраните SEO-ссылки. Убедитесь, что в разметке остаются реальные постраничные ссылки, даже если визуально работает кнопка.
- Свяжите с умным фильтром. Подгрузка должна учитывать активные условия
catalog.smart.filter, иначе после фильтрации «Показать ещё» подтянет не те товары. - Настройте кэш. Включите кэширование компонента и тегированный кэш, чтобы подгрузка не била в базу на каждый клик.
- Проверьте восстановление позиции. После возврата из карточки пользователь должен оказаться там, где был.
Если требуется нестандартное поведение — например, гибрид «Показать ещё → пагинация» или сохранение состояния скролла — это уже кастомизация шаблона и небольшой фронтенд. Такие доработки удобно вести вместе с общей автоматизацией на 1С, когда витрину настраивают под реальные сценарии покупателей. А чтобы подгрузка и выборки товаров работали эффективно на уровне кода, запросы пишут через современное ядро — об этом статья про D7 ORM в Битрикс.
Как выбрать под свой каталог
Единственно правильного варианта нет — есть подходящий под задачу. Ориентиры:
- Целевой выбор товара (мебель, техника, B2B). Пагинация или «Показать ещё»: пользователь сравнивает и ценит контроль.
- Импульсные покупки, «полистать» (одежда, мелочи). Уместнее «Показать ещё» или аккуратный скролл.
- Огромный каталог. Гибрид: несколько подгрузок кнопкой, затем пагинация, чтобы страница не разрослась.
- Приоритет SEO. Чистая пагинация с ЧПУ и каноническими адресами.
И главное — решайте по данным. Смотрите глубину просмотра, долистывания, скорость и Core Web Vitals, затем корректируйте размер выборки и режим. Логику лучше строить на фактах о поведении, а не на «модно/немодно».
Частые ошибки
- Скролл без резервных ссылок. Товары со второго экрана не попадают в индекс — падает органический трафик.
- Забыли про футер. Бесконечная лента прячет подвал с контактами, доставкой и перелинковкой.
- Слишком большая выборка. 100+ карточек на страницу перегружают рендер и мобильные устройства.
- Подгрузка игнорирует фильтр. После умного фильтра «Показать ещё» подтягивает нерелевантные товары.
- Нет кэша. Каждая подгрузка бьёт в базу торгового каталога — нагрузка растёт на пустом месте.
- Потеря позиции. Возврат из карточки выбрасывает в начало — пользователь бросает просмотр.
- Дубли из пагинации + фильтра. Комбинации не закрыты от индексации, плодятся тысячи почти одинаковых URL.
Чек-лист внедрения
- Режим выбран по данным. Тип навигации соответствует сценарию каталога, а не моде.
- Размер выборки оптимален. Кратен сетке, проверен по скорости и глубине просмотра.
- SEO-ссылки на месте. Реальные постраничные ссылки в разметке, канонические адреса настроены.
- Фильтр учитывается. Подгрузка работает с активными условиями умного фильтра.
- Кэш включён. Компонент и торговый каталог кэшируются, подгрузка не бьёт в базу.
- Футер достижим. Подвал доступен при любом режиме навигации.
- Позиция восстанавливается. Возврат из карточки возвращает к нужному месту списка.
- Проверено на мобильных. Скорость и отзывчивость нормальны на слабых телефонах.
Вывод
Пагинация, бесконечная прокрутка и «Показать ещё» — не вопрос вкуса, а инструменты под разные задачи. Для товарного каталога с намерением купить безопаснее всего пагинация и кнопка «Показать ещё»: они дружелюбны к поиску, держат скорость под контролем и дают дойти до футера. Бесконечный скролл хорош для лент-открытий, но требует резервных ссылок для роботов и заботы о производительности.
На 1С-Битрикс все три режима реализуются штатным компонентом catalog.section — важнее правильно связать навигацию с умным фильтром, кэшем и SEO. Выбирайте режим по данным о поведении, а если каталог уже тормозит — начните с аудита и оптимизации, чтобы навигация работала на конверсию, а не против неё.