Lazy loading для SEO

Тетяна Тетяна

Через повільне завантаження сторінки багато компаній втрачають потенційних клієнтів. Вважається, що якщо для перезавантаження сторінки вашого сайту потрібно понад 3 секунди, відкладене завантаження контенту — саме те, що може допомогти та прискорити завантаження сторінки.

Далі розглянемо, що таке відкладене завантаження, як його налаштувати та як воно впливає на SEO-просування.

Що таке відкладене завантаження

Припустимо, ви створюєте сайт, що собою являє набір абсолютно різних файлів — html, php, css, js, зображень, відео тощо. Якщо цих елементів на сайті багато або вони мають значну «вагу» — усе це може уповільнити роботу вашого сайту. Це відбувається через те, що великі файли, особливо такі як зображення та відео, довго завантажуються.

Коли відвідувачі переходять на сторінку сайту, починає завантажуватись його контент. Це дає можливість браузеру кешувати всю інформацію, однак це не означає, що всі користувачі можуть побачити весь контент, який розташований на сторінці.

Якщо дані завантажуватимуться довго — не факт, що всі користувачі чекатимуть цього, адже в пору інформаційних технологій люди вже звикли швидко отримувати інформацію або швидко йти в пошуках того ресурсу, який дасть їм необхідну інформацію швидше. Сайт, що завантажується швидко — уже давно перша вимога сучасних вебресурсів.

Ви можете розраховувати, що користувачі будуть чекати завантаження сторінки до кінця, а насправді вони можуть подивитися перший екран і те, як повільно він завантажується, і піти. Це означає, що ви даремно витратили пам’ять і пропускну здатність, завантажуючи нижню половину сторінки, до якої вони ніколи не доскролять.

Під час відкладеного завантаження ваш сайт завантажується поступово, у міру того, як користувач переміщається сторінкою вниз. При такому налаштуванні на сторінці завантажується лише верхня частина сторінки, а нижня її частина міститиме заглушку.

Коли користувач прокручує сторінку вниз контент під заглушкою поступово підвантажується й підмінюється на фактичний вміст. Під час лінивого завантаження ви не завантажуєте весь контент сторінки відразу. Він завантажується, коли прокручують сторінку.

Ліниве завантаження — це альтернатива масовому завантаженню вашого контенту. Замість того, щоби чекати, поки завантажиться весь ваш сайт, ваша аудиторія може швидко отримати доступ до інформації. Ваша сторінка завантажується лише тоді, коли це необхідно.

Коли у вас є сайт, який завантажується надто довго, ви отримуєте вищий показник відмов, а високий показник відмов негативно впливає на SEO-просування.

lazy loading для seo

Як відкладене завантаження впливає на SEO

З вищеописаного може здатися, що ліниве завантаження — вирішення всіх проблем, оскільки сторінка завантажується швидко і водночас не витрачає зайві ресурси. Однак є деякі особливі моменти, коли йдеться про SEO оптимізацію.

Відкладене завантаження впливає на те, як пошукові системи сканують ваш сайт. Якщо ваша сторінка не завантажується одразу, пошукові системи не можуть просканувати всю сторінку. Це загрожує тим, що ваш контент буде проігноровано або неправильно тлумачено.

Навряд чи ви погодитеся на те, щоби пошукові системи отримували неповну інформацію про ваш сайт, адже це негативно впливає на ранжування ресурсу в результатах пошуку. З іншого боку, це зовсім не означає, що ви не можете використовувати відкладене завантаження. Якщо ви використовуєте ліниве завантаження, вам потрібно переконатися, що весь відповідний контент видно в області перегляду. Це реалізується за допомогою IntersectionObserver API та polyfill — і гарантує, що роботи Google побачать весь ваш контент при скануванні сайту.

Слід переконатися, що сторінки сайту підтримують сторінкове завантаження навіть коли ви реалізуєте нескінченне прокручування. Це потрібно, щоби пошукові системи могли просканувати всі сторінки сайту остаточно, а користувачі могли ділитися вашим контентом.

Рекомендації від Google щодо відкладеного завантаження

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

У цьому документі Google рекомендує забезпечити завантаження вмісту в області перегляду. У документі також наголошується на необхідності надання унікальних посилань на контент, який не завантажується відразу.

Якщо коротко, під час роботи з lazy loading Google рекомендує дотримуватися наступних правил:

  1. Переконайтеся, що всі матеріали на вашій сторінці доступні Googlebot.
  2. Перевірте, чи завантажується весь потрібний контент у міру появи в області перегляду.
  3. Забезпечте підтримку сторінкового завантаження для бескінечного прокручування.
  4. Перевірте, як працює відкладене завантаження за допомогою скрипта Puppeteer.

Переваги використання lazy loading для SEO

1. Це прискорює завантаження сторінок сайту

Ліниве завантаження — це золота середина між швидким доступом до інформації для користувачів та економією ресурсів завантаження сторінки. При використанні цієї технології користувачі швидше одержують інформацію, за якою вони прийшли на ваш сайт. А сам сайт тим часом підвантажуватиме решту її частини, яка знаходиться нижче першого екрану.

2. Це утримує користувачів на сайті довше

Швидкість доступу до інформації в наш час є дуже важливим фактором. Якщо на вашому сайті відвідувач отримав інформацію швидко й не пішов назад у видачу через повільне завантаження сторінки, він залишиться з вами ще довше. Швидкі сайти зараз користуються популярністю та викликають довіру.

3. Допомагає максимізувати ресурси

Оскільки сайт не завантажує сторінку повністю, а робить це поступово, у міру прокрутки — він не витрачає зайві ресурси, показує відповідь швидше й допомагає заощаджувати пропускну здатність, якщо користувач не збирається дивитися сайт далі першого екрану. У такий спосіб, навантаження на сайт розподіляється рівномірніше й більша кількість користувачів зможе отримати доступ до вашої інформації в коротші терміни.

Основні правила ефективного використання лінивого завантаження

Ліниве завантаження може бути дуже ефективним для SEO-просування. Проте, щоби досягти максимального ефекту слід дотримуватися кількох рекомендацій.

Використовуйте відкладене завантаження лише для контенту нижче першого екрана

Ліниве завантаження ефективне лише тоді, коли використовується для нижньої частини сторінки. Якщо інтегрувати технологію на самому початку сторінки, то вся вона завантажуватиметься повільніше.

Розміщуйте корисний контент або його частину на першому екрані сайту

Щоби зацікавити користувача, спонукати його залишитися на сторінці та перегорнути інформацію далі за перший екран варто розмістити на початку сторінки частину корисної інформації, за якою прийшов користувач. Це може бути часткова відповідь на його запит або отримання повнішої відповіді. Так, користувач зацікавиться вашою сторінкою й буде готовий ознайомитися з рештою контенту в пошуках повноцінної відповіді на своє запитання.

Оптимізуйте відео та зображення на сторінці

Картинки та відеоролики мають найбільший вплив на швидкість завантаження вашої сторінки. Розмір цих файлів, як правило, більший, ніж усі інші файли. Якщо хочете прискорити завантаження сторінки, крім lazy loading необхідно також оптимізувати найважчі файли на сторінці.

Для оптимізації та стиснення картинок можна використовувати сервіс tiny png. Що стосується оптимізації відео, найкраще розміщувати їх на зовнішньому сайті, як, наприклад, YouTube. Такі відео потім можна вбудовувати у вміст сторінки й вони не будуть використовувати її додаткові ресурси, уповільнюючи відображення вмісту.

tiny png для стиснення картинок

Висновки

Ліниве завантаження може допомогти скоротити час завантаження вашого сайту. Замість того, щоби чекати на повне завантаження сторінок, ви можете швидко віддавати контент своєї аудиторії. Для більш ефективної роботи технології достатньо налаштувати її правильно й дотримуватися простих рекомендацій пошукової системи Google, оптимізувати подачу контенту на першому екрані та оптимізувати найбільші за розміром файли на сторінці.


Читайте схожі матеріали:

Залишити коментар