Уявіть об’ємний невідформатований текст, який ви вставили в документ. Вся інформація злилася в один суцільний потік слів без розділів, змісту, сторінок та поділів на абзаци.
Щоб знайти необхідну частину, доведеться довго шукати її, прокручуючи сторінку. Приблизно те саме являє собою сайт без пагінації.
На великих сайтах десятки та сотні сторінок: головна, картки товарів, продуктові сторінки, блог та інші. Як допомогти користувачам не заблукати серед колосального масиву інформації? Розкласти все по поличках — додати блок посилання для розмежування вмісту. Цей блок називається пагінацією.
Що таке пагінація
Пагінація (від лат. pagina — сторінка) — це структурування великого обсягу інформації на сайті шляхом її поділу на окремі сторінки. Простими словами, пагінація – це посторінковий вивід даних.
Її впроваджують, щоб:
- прискорити завантаження сторінок;
- спростити навігацію сайтом;
- зробити перегляд інформації зручним для користувачів;
- привести дизайн сторінок до звичного для користувачів вигляду.
Спочатку термін «пагінація» почав використовуватись у видавничій справі. Він мав на увазі нумерацію сторінок у книгах, газетах, журналах. Номер міг розташовуватися знизу, зверху, а також у бічній частині листа. 1499 року з’явилася перша книга з використанням пагінації. Її ввів італійський видавець Альд Мануцій, який розробив дизайн оформлення книг, що використовується досі. Також його «дітищем» стали курсив та запровадження пунктуаційної системи.
Наприкінці 20 століття, в епоху розвитку інтернету, пагінація просочилася в глобальну мережу. Інформацію на сайтах почали виводити посторінково, додавши можливість перегортання сторінок.
Пагінація необхідна для:
- електронних бібліотек, щоб шукати авторів або назви книг за абеткою;
- інтернет-магазинів для посторінкового перегортання фотографій товару з картки або відгуків на нього;
- порталів новин, з посиланням на свіжий за датою розміщення матеріалу;
- фотобанки, де сотні тисяч зображень розділені посторінково.
Пагінацією займаються SEO-фахівці. Причому організувати процес потрібно так, щоб він не вплинув негативно на просування сайту та не знизив позиції ресурсу у пошуковій видачі.
Види пагінації
Виділяється кілька видів пагінації:
- Нумерований список, кожна цифра якого містить посилання переходу.
- Алфавітний порядок, де при виборі конкретної літери відкривається перелік назв, що починається з неї.
- Кнопка “Показати ще” дозволяє завантажити певну кількість елементів на сторінку одним кліком.
Кожен із цих видів по-своєму хороший. Також зустрічаються комбінування кількох видів пагінації. Наприклад, коли на сайті одночасно передбачено нумерований список сторінок та кнопка «Показати ще». Це дозволяє користувачеві вибирати, як зручніше прокручувати елементи сторінки.
Соцмережі – приклад ресурсів, де не використовується пагінація. Стрічкам новин не має меж, завдяки чому користувач довше затримується на сайті. Нескінченне прокручування новин дозволяє утримати увагу відвідувачів.
Як налаштувати пагінацію сторінок на сайті
У кожній CMS пагінація має свої особливості. Ми розповімо про те, як самостійно налаштувати її за допомогою WordPress та PHP.
Пагінація на WordPress
Щоб налаштувати пагінацію, необов’язково освоювати мову програмування. У CMS WordPress така функція вже передбачена. Навіть якщо ви нічого не налаштували, у нижній частині сторінок можна знайти кнопки з посиланнями «Попередня сторінка» та «Наступна сторінка».
Якщо такий варіант пагінації не влаштовує, можна підібрати відповідний розділ «Плагіни». Пошук робимо за міткою pagination. Далі ви можете вибрати сумісну з вашою версією WP плагін і встановити його.
Під час налаштування будьте уважні до таких параметрів:
- розміру посилань. Вони повинні бути зручними для натискання пальцем;
- розміру сторінок. Сторінка не повинна бути занадто короткою або довгою. Оптимальне значення – від 20 до 100 елементів на одну сторінку;
- оформлення пагінації. Гортаючи сторінки, відвідувачам важливо розуміти, на якій вони знаходяться. Бажано виділити посилання на номер контрастним кольором;
- простору між елементами. Для візуальної привабливості слід дотримуватися балансу між посиланнями. Вони не повинні бути надто близько один до одного, але при цьому бажано вмістити 10 посилань на сторінку.
Пагінація на PHP
Ще один інструмент для самостійного настроювання пагінації, в якому не так складно розібратися. Навіть якщо у вас немає досвіду написання коду, можна витратити трохи часу і зрозуміти, як працює цей процес.
У PHP пагінація робиться двома способами:
- Посторінкова пагінація. У коді є кілька команд, три з яких позначають поточну, попередню та наступну сторінку.
Код визначає те, що ми знаходимося на певній сторінці, і виокремлює з бази необхідні посилання. - Тематична пагінація. У основу треба самостійно прописувати спосіб ідентифікації сторінок. Наприклад, по тематиці. Сторінки поділяються на групи — зазвичай їх називають “рубрики”. Користувач заходить на сторінку однієї з цих рубрик, скрипт самостійно знаходить схожі варіанти в базі та пропонує їх користувачеві.
Які помилки виникають при налаштуванні пагінації
Пагінація робить перегляд сайту комфортним та швидким для користувача. Якщо при її підготовці допущені помилки, з’являється низка проблем:
- Затримка індексації однотипних сторінок. З нею стикаються, просуваючи інтернет-магазини за наявності великої кількості карток товарів.
- Дубльований контент на сторінках, що перегортаються. У разі виявлення низької унікальності роботи можуть оштрафувати сайт.
- Складність виявлення важливих сторінок від менш значимих. Перші можуть чекати на індексацію кілька місяців, а другі бути схваленими за пару днів.
- Убогий контент. Якщо в галереї зображень немає жодного тексту і відсутні alt і title, роботи можуть його не проіндексувати, оскільки їм не буде за що «зачепитися».
Впоратися із SEO-помилками допоможе закриття сторінок із пагінацією від роботизованого сканування.
Як користуватися пагінацією на чужому сайті
Зайдіть на сайт, наприклад, інтернет-магазину та оберіть потрібний розділ із товаром у меню. Якщо у верхній частині немає нумерації, перейдіть до кінця. Внизу з’явиться цифровий список із посиланнями на інші сторінки:
Цифровий список із посиланнями на інші сторінки
У нашому прикладі для подальшого перегляду карток товарів передбачено кнопку «Показати ще». Вона передбачає швидке розкриття позицій з наступної сторінки.
Аналогічним чином налаштований пагінатор на всіх великих сайтах, і скористатися ним не важко.
Висновок
Ми радимо використовувати пагінацію з огляду на бажання цільової аудиторії вашого сайту.
- Для інтернет-магазинів з великою кількістю товарів краще вибрати сторінки з кнопкою “Завантажити ще”. Сортувати товар найкраще за вартістю, датою появи на сайті, популярності.
- Для інформаційних сайтів застосуємо скролінг. Посторінкова пагінація підходить не менше.
- Якщо у вас сайт з великою кількістю фото- та відео контенту, найкращим рішенням буде нескінченне прокручування.
