Из-за медленной загрузки страницы многие компании теряют потенциальных клиентов. Считается, что если для перезагрузки страницы вашего сайта требуется более 3-х секунд, отложенная загрузка контента — именно то, что может помочь и ускорить загрузку страницы.
Далее рассмотрим, что такое отложенная загрузка, как ее настроить и как она влияет на SEO-продвижение.
Что такое отложенная загрузка
Предположим, вы создаете сайт, что самой собой представляет набор совершенно разных файлов — html, php, css, js, изображений, видео и т.д. Если этих элементов на сайте много или они имеют значительный «вес» — все это может замедлить работу вашего сайта. Так как большие файлы, особенно такие как изображения и видео, долго загружаются.
Когда посетители переходят на страницу сайта, начинает загружаться его контент. Это позволяет браузеру кэшировать всю информацию, однако это не значит, что все пользователи смогут увидеть весь контент, которые расположен на странице.
Если данные будут загружаться долго — не факт, что все пользователи будут дожидаться этого, ведь в пору информационных технологий люди уже привыкли быстро получать информацию или быстро уходить в поисках того ресурса, который даст им необходимую информацию быстрее. Быстро загружающийся сайт — уже давно первое требование современных веб ресурсов.
Вы можете рассчитывать, что пользователи будут ждать загрузки страницы до конца, а на самом деле они могут посмотреть первый экран и то, как медленно он грузится, и уйти. Это значит, что вы зря потратили память и пропускную способность, загружая нижнюю половину страницы, до которой они никогда не доскроллят.
При отложенной загрузке ваш сайт загружается постепенно, по мере того, как пользователь перемещается вниз по странице. При такой настройке на странице загружается только верхняя часть страницы, а нижняя ее часть будет содержать «заглушку».
Когда пользователь прокручивает страницу вниз контент под «заглушкой» постепенно подгружается и подменяется на фактическое содержимое. При ленивой загрузке вы не загружаете весь контент страницы сразу. Он загружается, когда пользователи прокручивают страницу.
Ленивая загрузка — это альтернатива массовой загрузке всего вашего контента. Вместо того чтобы ждать, пока загрузится весь ваш сайт, ваша аудитория может быстро получить доступ к информации. Ваша страница загружается только тогда, когда это необходимо.
Когда у вас есть сайт, который загружается слишком долго, вы получаете более высокий показатель отказов, а высокий показатель отказов негативно влияет на ваше SEO-продвижение.
Как отложенная загрузка влияет на SEO
Из вышеописанного может показаться, что ленивая загрузка — решением всех проблем, так как страница загружается быстро и при этом не тратит лишние ресурсы. Однако есть некоторые особые моменты, когда речь идет о SEO оптимизации.
Отложенная загрузка влияет на то, как поисковые системы сканируют ваш сайт. Если ваша страница не загружается сразу, поисковые системы не могут просканировать всю страницу. Это грозит тем, что ваш контент будет проигнорирован или неверно истолкован.
Вряд ли вы согласитесь на то, чтоб поисковые системы получали неполную информацию о вашем сайте, ведь это негативно влияет на ранжирование ресурса в результатах поиска. С другой стороны, это вовсе не означает, что вы не можете использовать отложенную загрузку. Если вы используете ленивую загрузку вам нужно убедиться, что весь соответствующий контент виден в области просмотра. Это реализуется с помощью IntersectionObserver API и polyfill — и гарантирует, что боты Google увидят весь ваш контент при сканировании сайта.
Следует убедиться, что страницы сайта поддерживают постраничную загрузку даже когда вы реализуете бесконечную прокрутку. Это нужно для того, чтоб поисковые системы могли просканировать все страницы сайта до конца, а пользователи могли делиться вашим контентом.
Рекомендации от Google по отложенной загрузке
Чтобы помочь компаниям адаптировать сайты для отложенной загрузки, Google создал документ, который поможет вебмастерам настроить сайты для корректного сканирования при использовании отложенной загрузки.
В этом документе Google рекомендует обеспечить загрузку контента в области просмотра. В документе также подчеркивается необходимость предоставления уникальных ссылок на контент, который не загружается сразу.
Если кратко, при работе с lazy loading Google рекомендует придерживаться следующих правил:
- Убедитесь, что все материалы на вашей странице доступны роботу Googlebot.
- Проверьте, загружается ли весь нужный контент по мере появления в области просмотра.
- Обеспечьте поддержку постраничной загрузки для бесконечной прокрутки.
- Проверьте, как работает отложенная загрузка с помощью скрипта Puppeteer.
Преимущества использования lazy loading для SEO
1. Это ускоряет загрузку страниц сайта
Ленивая загрузка — это золотая середина между быстрым доступом к информации для пользователей и экономией ресурсов загрузки страницы. При использовании этой технологии пользователи быстрее получают информацию, за которой они пришли на ваш сайт. А сам сайт тем временем будет подгружать остальную ее часть, которая находится ниже первого экрана.
2. Это удерживает пользователей на сайте дольше
Скорость доступа к информации в наше время очень важный фактор. Если на вашем сайте посетитель получил информацию быстро и не ушел обратно в выдачу из-за медленной загрузки страницы — он останется с вами еще дольше. Быстрые сайты сейчас пользуются популярностью и вызывают доверие.
3. Помогает максимизировать ресурсы
Так как сайт не загружает страницу полностью, а делает это постепенно, по мере прокрутки — он не тратит лишние ресурсы, показывает ответ быстрее и помогает экономить пропускную способность, если пользователь не собирается смотреть сайт дальше первого экрана. Таким образом нагрузка на сайт распределяется равномернее и большее количество пользователей сможет получить доступ к вашей информации в более короткие сроки.
Основные правила эффективного использования ленивой загрузки
Ленивая загрузка может быть очень эффективной для SEO-продвижения. Однако, чтоб достичь максимального эффекта следует придерживаться нескольких рекомендаций.
Используйте отложенную загрузку только для контента, который ниже первого экрана
Ленивая загрузка эффективна только тогда, когда используется для нижней части страницы. Если интегрировать технологию в самом начале страницы, то вся она будет загружаться медленнее.
Размещайте полезный контент или его часть на первом экране сайта
Чтоб заинтересовать пользователя, побудить его остаться на странице и пролистать информацию дальше первого экрана стоит разместить в начале страницы часть полезной информации, за которой пришел пользователь. Это может быть частичный ответ на его запрос или вступление к более полному ответу. Таким образом пользователь заинтересуется вашей страницей и будет готов ознакомиться с остальным контентом в поисках полноценного ответа на свой вопрос.
Оптимизируйте видео и изображения на странице
Картинки и видеоролики оказываются наибольшее влияние на скорость загрузки вашей страницы. Размер этих файлов, как правило, больше, чем все остальные файлы. Если хотите ускорить загрузку страницы, помимо lazy loading необходимо также оптимизировать самые «тяжелые» файлы на странице.
Для оптимизации и сжатия картинок можно использовать сервис tiny png. Что касается оптимизации видео, лучше всего размещать их на внешнем сайте, как например, YouTube. Такие видео потом можно встраивать в контент страницы и они не будут использовать ее дополнительные ресурсы, замедляя отображение контента.
Выводы
Ленивая загрузка может помочь сократить время загрузки вашего сайта. Вместо того чтобы ждать полной загрузки страниц, вы можете быстро отдавать контент своей аудитории. Для более эффективной работы технологии достаточно настроить ее правильно и следовать простым рекомендациям поисковой системы Google, оптимизировать подачу контента на первом экране и оптимизировать самые большие по размеру файлы на странице.
Читайте похожие материалы:
