Відкладене завантаження незначного або невидимого контенту дозволяє зробити ваш сайт більш зручним і привабливим для відвідувачів. Щоб дізнатися більше, вивчіть ресурси web.dev про відкладене завантаження зображень і відео. Якщо неправильно використовувати таке завантаження, доступ Google до вашого контенту може бути обмежений. Нижче описано, як переконатися, що вміст із відкладеним завантаженням доступний для сканування та індексації.
Завантажуйте контент, коли він знаходиться в області перегляду
Переконайтеся, що всі матеріали на вашій сторінці доступні роботам Google. Для цього перевірте, чи завантажується весь потрібний контент у міру появи в області перегляду. Щоб реалізувати відкладене завантаження, можна використовувати:
- вбудовану в браузер функцію відкладеного завантаження контенту у вікнах iframe та зображень;
- IntersectionObserver API і поліфіли;
- бібліотеку JavaScript, яка підтримує завантаження вмісту при появі в області перегляду.
Ці варіанти передбачають завантаження контенту, не покладаючись на дії користувачів, такі як прокрутка та кліки. Це важливо, оскільки Google Пошук не взаємодіє з вашими сторінками.
Не рекомендується використовувати відкладене завантаження для контенту, який відображається відразу при відкритті сторінки. У такому випадку для завантаження та відображення контенту в браузері може знадобитися більше часу, і це буде помітно користувачеві.
Обов’язково перевірте результат своєї роботи.
Забезпечте підтримку завантаження сторінки для нескінченної прокрутки
Нескінченна прокрутка дозволяє завантажувати більше контенту з розбивкою на сегменти, коли користувач прокручує довгу сторінку. Подібна сегментація може застосовуватися, наприклад, до однієї великої статті або добірки елементів. Щоб сторінку з нескінченною прокруткою можна було проіндексувати, переконайтеся, що сайт підтримує завантаження подібних сегментів за сторінкою. Дотримуйтесь наших рекомендацій:
- Призначте кожному сегменту унікальний власний URL.
- Контент, призначений для показу в браузері за кожним подібним URL, повинен залишатися незмінним. Для цього можна використовувати в URL точні номери сторінок, наприклад додавши параметр запиту
?page=12. - Не додавайте в URL елементи відносної адресації, наприклад
?date=yesterdayдля відбору вчорашніх публікацій. Тоді і пошукові системи, і користувачі зможуть переходити за певним URL до одного й того самого контенту. У результаті перші будуть коректно індексувати контент, а останні – повторно взаємодіяти з ним і ділитися ним. - Призначте наявним URL послідовні номери сторінок, щоб пошукові системи могли розпізнавати кожен з них у межах набору з розбивкою по сторінках. Ознайомтеся з нашими рекомендаціями щодо розбивки на сторінки.
- Встановіть налаштування так, щоб у випадках, коли при прокручуванні сторінки з’являється черговий сегмент і стає основним елементом на екрані, оновлення відображуваної URL-адреси здійснювалося за допомогою History API. Це дозволить користувачам оновлювати поточну URL-адресу, що відображається в браузері, а також ділитися нею та посилатися на неї.
Перевірте, як працює відкладене завантаження
Реалізувавши відкладене завантаження, перевірте, чи все функціонує коректно. За допомогою інструмента перевірки URL в Search Console можна дізнатися, чи був завантажений увесь контент. Спробуйте знайти оброблений HTML-код сторінки в цьому інструменті й переконайтеся в наявності потрібного контенту. Якщо URL ваших зображень або відео вказані в атрибуті src елементів <img> або <video> обробленого HTML-коду, то все реалізовано без помилок.