Скорость – это ключ к успеху в интернете. Если вы хотите больше обсуждений, больше трафика, больше довольных пользователей, то стоит оптимизировать скорость загрузки вашего сайта WordPress. Но что, если вы уже используете CDN, и оптимизировали размер своих картинок? Как можно добиться ещё большей скорости?
Решением может стать отложенная загрузка изображений!
С отложенной загрузкой (lazy load) WordPress загружает изображения только тогда, когда пользователи прокрутили страницу до них. На сайтах с большим количеством изображений это может значительно ускорить загрузку страницы, поскольку будут загружаться только те фотографии, которые отображаются на экране до прокрутки страницы.
Смотрите также:
В этой статье мы обсудим достоинства и недостатки отложенной загрузки и покажем наилучшие плагины WordPress для Lazy Load.
Преимущества отложенной загрузки изображений
Главные преимущества отложенной загрузки делятся на две категории.
1. Ускорение загрузки сайта
Основным достоинством является достижение первоначальной скорости загрузки сайта. Если вы в своих записях используете много изображений, то они увеличат размер вашей страницы. Нет никакой необходимости загружать их до того, как посетитель увидит их (кроме соображений о SEO, которые мы озвучим позже).
Лучше сразу загружать страницу, а потом, если понадобятся, изображения по мере прокрутки страницы. Вы не можете быть уверенными, что пользователь долистает до них.
Что подводит нас к следующему пункту…
2. Экономия трафика пользователей
Не все используют безлимитный интернет. Вы можете сделать огромное одолжение людям с ограниченным 3G тарифным планом (или с ужасным интернет провайдером) просто отложив загрузку ваших изображений. Они будут использовать трафик только для изображений, которые видят.
Пользователи, скорее всего, об этом никогда не узнают, но это будет очень любезно с вашей стороны.
Недостатки отложенной загрузки изображений
Есть несколько потенциальных недостатков отложенной загрузки изображений, о которых вы обязаны помнить.
Оптимизация поисковой системы и отложенная загрузка
Если вы не загружаете контент до того, как пользователь его увидит, то у поисковых систем могут возникнуть сложности со сканированием и индексацией. У вас могут возникнуть проблемы с SEO вашего сайта, если вы не будете осторожны. Но только с отложенной загрузкой можно получить одновременно и правильное расположение текста, и индексирование, и ускорение загрузки страницы.
Однако, если вы попытаетесь ранжировать изображения в чем-то типа Google Image Search, то вам не стоит забывать об этом.
И всегда помните – если вы хотите отложить загрузку всего контента (включая текст), то используйте инструмент Fetch as Googlebot, чтобы проверить, не вызовет ли это проблем у Google.
UX и отложенная загрузка
Иногда отложенная загрузка является причиной отображения контента, если изображение не загрузилось вовремя. Это может раздражать, но если вы правильно установите отложенную загрузку, то эта проблема не будет вас беспокоить.
Как использовать Lazy Load на WordPress
Если вы нуждаетесь в новой функции на WordPress, то всегда будет для этого какой-то плагин. Это же касается и отложенной загрузки. Мы хотим вам представить несколько лучших плагинов WordPress для настройки отложенной загрузки изображений.
Lazy Load
Наиболее популярным бесплатным плагином для реализации отложенной загрузки является Lazy Load.
Это простой плагин, который использует jQuery.sonar для загрузки изображений только тогда, когда они попадают в поле зрения пользователя. Просто загрузите его и нажмите Activate. Не требуется никаких настроек.
Rocket Lazy Load
Rocket Lazy Load – это лёгкий бесплатный плагин для реализации отложенной загрузки. Он занимает не более 2 KB и не использует библиотеки JavaScript.
Он работает с изображениями и миниатюрами в записях и виджетах. Как и Lazy Load, вам нужно просто установить плагин и нажать Activate.
Image Lazy Load
Image Lazy Load – это свободно распространяемый плагин, который использует библиотеку unveil.js для отложенной загрузки ваших изображений. Он обрабатывает изображения на главной странице, в записях и пользовательских типах записей. И в отличии от Rocket Lazy Load, не откладывает загрузку виджетов.
Если вы загрузите премиум версию, то получите поддержку горизонтальной прокрутки, избранных фотографий и многое чего ещё.
Бесплатная версия отлично подходит для базовой отложенной загрузки.
BJ Lazy Load
BJ Lazy Load – это бесплатный плагин, который не использует внешние библиотеки JavaScript и насчитывает более 40,000 активных установок. Мы поместили его не сверху списка только потому, что он не обновлялся уже 11 месяцев.
Плагин загружает изображения, миниатюры, gravatar, iframe содержимое и видео с YouTube.
WordPress Advanced Image Lazy Load
Это премиум плагин, доступный на CodeCanyon. Вы получите поддержку всех изображений, независимо от их местонахождения: запись, страница, боковая панель, избранной или ещё где-то.
Он дружен с поисковыми системами, поэтому у вас не будет проблем с индексацией.
Еще одной приятной функцией является возможность включить или выключить отложенную загрузку для отдельных записей, что даёт вам дополнительный контроль над функционированием вашего сайта.
Плагин стоит $15.
JCH Optimize Pro
- Минимизированные запросы HTTP
- Уменьшенный размер страниц
- Оптимизированные изображения
- Несколько небольших функций, как поддержка CDN
Если вы хотите получить полный комплекс услуг, то выбирайте JCH Optimize Pro. Его цена начинается от $29 за 6 месяцев пользования.
Бонус: Crazy Lazy
У Crazy Lazy около 3,000 активных установок, и он постоянно выпускает обновления. Это отличный бесплатный и лёгкий вариант для отложенной загрузки картинок на WordPress.
Итоги
Если вы искали ещё способы для оптимизации вашего сайта WordPress, вам стоит задуматься об отложенной загрузке.
Если у вас записи преимущественно текстовые, то вы не заметите особого улучшения. Но если вы используете много изображений, то тогда отложенная загрузка определённо ускорит загрузку вашего сайта.
Сейчас доступно огромное количество плагинов для этого. Просто не забывайте проверять ваш сайт на Fetch as Googlebot, чтобы убедиться в правильном индексировании.
Комментарии к записи: 2
У меня лучше всех сработал Crazy Lazy (на глазок, естественно). С видеороликами получил неуд (предупреждали же).
А ничего, если установлен плагин W3 Total Cache?
Если я, к примеру, захочу поставить Lazy Load и у меня установлен W3 Total Cache. Они между собой конфликтовать не будут?