Как и почему нужно использовать отложенную загрузку на сайтах WordPress
Опубликовано: 01.09.2018
Разработчики всего мира начали активно использовать отложенную загрузку на сайтах WordPress с тех пор, как они поняли, что это может не только позитивно повлиять на взаимодействие с пользователями, но и показать поисковым системам, что их сайт грузится быстро.
постраничная навигация по сайту wordpress
Термин отложенная загрузка (англ. lazy loading) мы бы могли перевести, как ленивая загрузка, и это бы во многом соответствовало реальности. Она действительно становится ленивой, когда дело доходит до загрузки контента (изображений, видео, текста) на веб-страницу.
7. 10 шагов к быстрому сайту
Смотрите также :
Но перед тем, как вы начнете искать какой-то негативный подтекст в слове ленивый, давайте все же узнаем, что такое отложенная загрузка, и какие у нее преимущества.
Плюсы отложенной загрузки
Отложенная загрузка имеет много преимуществ. Вместо загрузки всего контента она загружает только ту часть, которая видна пользователю в окне браузера. Это может выражаться по-разному, начиная от просто задержки загрузки изображений и заканчивая полномасштабным бесконечным скроллингом контента.
Выше скорость загрузки сайта
Загрузка происходит только тогда, когда это необходимо. Подобная функция помогает значительно увеличить скорость работы сайта в целом. Это отличный способ уменьшить количество посетителей, которые покинули ваш сайт из-за медленной загрузки.
Улучшение SEO
При сканировании вашего сайта боты будут обращать внимание и на скорость его загрузки. Исследования показали, что сайты с более высокой скоростью загрузки, как правило, занимают выше позицию в поисковых системах.
Интуитивно понятный пользовательский интерфейс
Посетителям больше не понадобится нажимать на новую страницу и ждать, пока она загрузится. У них появляется возможность абсолютно спокойно и естественно прокручивать информацию, пока они не найдут то, что искали.
Минусы отложенной загрузки
Конечно, со стороны данный вариант кажется просто идеальным, однако и у него есть свои минусы.
Ущерб для SEO
Да, мы писали, что скорость позитивно повлияет во время сканирования вашего сайта. Однако тут есть и негативное влияние. С учетом того, что некоторый контент просто не появляется до того момента, пока пользователь до него не дойдет, то при сканировании поисковые системы, такие как Google, могут просто его не увидеть. Но такое могло бы случиться и при фиксированном количестве сообщений на сайте. Это просто означает, что поисковая система не может принять во внимание некоторую важную информацию, которая существует ниже в ваших архивах.
Низкая производительность на старых браузерах
С учетом того, что контент загружается только тогда, когда пользователи прокручивают сайт до него, могут возникать проблемы с просмотром содержимого из-за производительности, особенно на старых браузерах или при медленном интернете.
Вы, возможно, замечали это во время работы на сайтах с отложенной загрузкой, если вы хотите быстро проскроллить вниз, то вам придется подождать несколько секунд, пока все загрузится.
Кроме того, пользователи не смогут контролировать свои переходы по содержимому или использовать кнопку браузера "Назад", когда будут искать контент, который они недавно просмотрели.
Когда использовать отложенную загрузку
Как вы могли заметить, преимущества и недостатки отложенной загрузки попадают в одни и те же области: поисковая оптимизация и взаимодействие с пользователем.
Чтобы получить максимальную отдачу от отложенной загрузки, нужно использовать ее экономно. Попробуйте использовать ее только на вашей домашней странице или страницах с большим количеством изображений и отключать на страницах, которые размещают ценный SEO контент.
Экспериментируйте и проверяйте ваши данные, используя Google Analytics (для трафика сайта и SEO), Pingdom (для скорости сайта) и просто обращайте внимание на пользовательский фидбэк.
Как добавить отложенную загрузку на WordPress сайт
К счастью, у вас есть много вариантов создания отложенной загрузки на WordPress сайте.
Вы можете добавить отложенную загрузку, создавая свои собственные функции. Можно использовать отложенную инициализацию, виртуальные прокси, контейнеры значений и ghost-объекты. Этот метод даст вам наибольшую гибкость, но его вряд ли осилят пользователи без знаний и опыта в программировании.
Ознакомьтесь с некоторыми аспектами написания кода отложенной загрузки на Code Project или Elegant Themes .
Однако, поскольку кодинг у многих не является сильной стороной, владельцы сайтов WordPress часто предпочитают использовать плагины. К счастью, есть много инструментов, которые могут помочь в данном вопросе.
Lazy Load
Этот плагин разработан в сотрудничестве с Automattic и 10up. Он использует jQuery.sonar от Dave Artz (AOL).
BJ Lazy Load
Этот плагин поможет вам создать код для отложенной загрузки изображений на WordPress сайте.
Image Lazy Load (Unveil.js)
Этот плагин, благодаря unveil.js, поможет увеличить производительность вашего сайта.
Rocket Lazy Load
Плагин добавляет небольшой скрипт, который также используется и в WP Rocket.
Unveil Lazy Load
Данный плагин использует jQuery, чтобы загрузка контента происходила по мере необходимости, что ускорит работу вашего сайта.
Бесконечная прокрутка
Если вы хотите постоянно загружать новый контент на странице своего сайта по мере прокрутки вниз, вам потребуется более мощные инструменты, чем перечисленные выше плагины отложенной загрузки. Обратите внимание на функцию Infinite Scroll в Jetpack или на плагин Ajax Load More .
Заключение
У вас есть много вариантов для осуществления отложенной загрузки на вашем сайте WordPress. После реализации отслеживайте свой рейтинг в Google и показатель отказов вашего сайта. Эти факторы помогут определить, выгодно ли влияет отложенная загрузка на поисковую оптимизацию и взаимодействие с пользователями. Проверяйте и обязательно оставляйте в комментариях свои отзывы.