Клиенты ждать не будут
Быстрая загрузка страниц WooCommerce – очень важное условие, чтобы посетители вашего интернет-магазина могли чувствовать себя комфортно во время просмотра товаров и совершения покупок. Сегодня моментальное удовлетворение потребительского спроса в сети является нормой. Даже в супермаркете не все готовы ждать на кассе, чтобы сделать покупку. А о том, чтобы «отстоять очередь» в интернет-магазине и речи быть не может. Вероятнее всего потенциальный покупатель уйдет к конкурентам и даст заработать им, а не вам.
Согласно исследованию юзабилити, почти половина потребителей готовы ждать не более 2-х секунд пока загрузится страница, а если она открывается дольше 3-х секунд, с сайта моментально уходят четверо из пяти оставшихся пользователей. При этом каждая лишняя секунда ожидания загрузки страницы может снизить конверсию на 7%. Представим, что ваш интернет-магазин, ежедневно продает товаров на сумму 100 000 долларов США, таким образом секундная задержка в загрузке страницы может стоить вам целых 2,5 млн долларов упущенной прибыли в год.
Чтобы избежать подобных потерь, вам срочно нужна оптимизация WooCommerce. Это позволит достичь важной цели – создать быстрый и эффективный сайт. В этой статье мы попытались рассказать как следует вести кампанию по оптимизации WordPress, которая должна повысить производительность сайта и обеспечить быструю загрузку страниц.
Насколько велик ваш магазин?
Когда дело доходит до интернет-магазинов, размер имеет значение. Общий объем вашего сайта, включая HTML, JavaScript и CSS-файлы, а также изображения могут замедлять скорость загрузки страниц. Поэтому, если размер файла страницы товара слишком большой, это означает, что клиентам придется ждать, пока медиафайлы полностью загрузятся у него в браузере, прежде чем они смогут просмотреть товары или совершить покупку.
Чтобы определить размер вашего сайта и скорость загрузки страниц вам пригодятся такие сервисы, как Pingdom и GTmetrix. Они могут бесплатно проанализировать ваш сайт. После чего вы получите оценку производительности по 100-балльной шкале. Сюда входит статистика по времени загрузки страницы ее размер и количество запросов с сервера. Таким образом, у вас появится понимание что тормозит работу сайта и как должна проводиться оптимизация WooCommerce.
Используйте CDN
Технология CDN помогает решить проблему географического расстояния между интернет-пользователями и сервером. Представьте, пользователь открывает сайт, сервер которого находится в его городе, регионе, стране и т.д. Значит информация загрузится быстро. С точностью до наоборот будет если сервер находится на отдаленной территории. Поэтому, если у вас много клиентов, проживающих в других странах, вам стоит приобрести хороший CDN в стране где эти пользователи находятся.
Данная технология сохраняет копии файлов вашего сайта на серверах, расположенных по всему миру. Поэтому, когда клиент посещает ваш магазин, его браузер подгружает копию сайта с ближайшего к нему сервера, что сокращает время ожидания.
Мы можем показать вам как влияет географическое отдаление сервера от местонахождения пользователя. И просканировали один интернет-магазин на платформе Pingdom из разных точек мира (Азия, Северная Америка, Европа):
Наихудший результат по времени загрузки получили бы клиенты из Японии. Им пришлось бы ждать почти 7 секунд. А это стопроцентный провал.
Второе исследование показало, что будь пользователь из Северной Америки, ему пришлось бы ждать почти 5 секунд. Это тоже неприемлемо.
А в третьем отчете видно, что потенциальный европеец откроет страницу за 2,41 сек, что в два раза быстрее, чем у американца. Следовательно, сервер интернет-магазина находится ближе к Европе, чем к Америке и Азии. Вывод такой: если наша основная аудитория не европейцы, тогда нужен CDN.
Сервисы-гиганты, предоставляющие услуги CDN, такие как Cloudflare имеют больше сотни центров обработки данных по всему миру. Именно по этой причине сети доставки контента настолько эффективны. Но прежде чем начинать работу с CDN выясните, какая часть вашей аудитории сталкивается трудностями ожидания при пребывании на сайте.
Настройка менеджера скриптов и стилей
Вы знаете, что полезные функции woocommerce, такие как как например карточка товаров используются на определенных страницах сайта. В то время как плагин устанавливает свои скрипты и стили на все страницы, что перегружает сайт. По такому принципу работают десятки плагинов.
Бесплатный плагин Clearfy оптимизирует ваш сайт, решая одну из самых главных проблем, влияющих на скорость: избыточную нагрузку из-за файлов CSS и JavaScript (JS).
Это легко проверить, если нажать на странице сочетание клавиш Сtrl+U и найти Woocommerce в исходном коде. Мы увидим, что плагин загружает на главной странице лишние скрипты.
Анализ статистики по скорости загрузки файлов на домашней странице WooCommerce отображает файлы и сторонние службы, которые загружаются всякий раз, когда кто-то обращается к сайту.
Оптимизация WooCommerce. Установите и активируйте бесплатный плагин Clearfy. Переходим в его меню:
Для работы нам понадобится менеджер скриптов.
По умолчанию менеджер скриптов будет активен. Но если у вас он неактивен, то перейдите во вкладку Производительность -> Менеджер скриптов и убедитесь, что настройки выглядят следующим образом:
Отключите неиспользуемые скрипты, стили и шрифты. В админбаре есть кнопка под названием “Менеджер скриптов”, если на нее нажать вы увидите список загружаемых скриптов, стилей и шрифтов на текущей странице вашего сайта.
Если вы считаете, что какой-то из ресурсов лишний на этой странице, вы можете индивидуально его отключить, чтобы он не создавал лишних запросов при загрузке. Используйте менеджер скриптов аккуратно. Мало того, что ускорить WordPress не получится, так еще и сайт будет работать некорректно. Советуем вам использовать локальный сервер для тестирования этой функции.
Вы можете включить/отключить использование CSS и JS файлов в записях, произвольных типах записей или страницах. Мы рекомендуем вам экспериментировать со скриптами на локальном хостинге или тестовом сайте, так как вы можете нарушить работу сайта, если отключите системные файлы скриптов, без которых невозможна полноценная работа сайта. Если вы не уверены, для чего используется тот или иной файл, попробуйте нажать на ссылку под его заголовком, в открывшемся файле вы можете увидеть комментарий разработчика с ссылкой на описание плагина. Получив достаточную информацию о функциях плагина, вы сможете более уверенно включать или отключать его стили и скрипты.
Используйте только качественный хостинг
Львиная доля интернет-магазинов начинает развиваться на дешевом хостинге. И это в какой-то степени правильно. Ведь на первых парах ваш сайт не может похвастаться мощным трафиком. Поэтому стартовать с дорогостоящего виртуального сервера не стоит. Но со временем, по мере роста вашего магазина, увеличится трафик, и ваш сайт начнет испытывать перегрузки. Грубо говоря, вам станет тесно работать на бюджетном хостинге и вы поймете, что пришло время найти тариф помощней, который удовлетворял бы запросы вашего ресурса.
Важно как минимум раз в месяц анализировать показатели нагрузки, которые испытывает ваш сайт. Это позволит вам вовремя среагировать и сменить хостинг или предложенный тариф. Выбрав один из вариантов, ваш магазин будет иметь больше пространства для развития и будет загружаться быстрее.
Оптимизация WooCommerce и сжатие изображений в WordPress
В каталогах хорошего интернет-магазина содержатся тысячи изображений электроники, косметики, книг и т.д. И от размера этих картинок будет зависеть производительность сайта. Поэтому изображения необходимо сжать без потери качества. Оптимизация woocommerce картинок должна проходить в автоматическом режиме, потому что у вас не хватит времени на сжатие изображений вручную. Эту задачу сможет выполнить плагин Robin image oprimizer. Скачайте и активируйте его.
Зайдите в Настройки => Robin image oprimizer.
Перед вами два раздела: «Основные» и «Основные настройки». В них вам и предстоит выполниь необходимые настройки.
Подробнее о функциях оптимизации и настройке плагина вы узнаете в нашей основной статье про плагин оптимизации изображений на WordPress.
Следите за обновлениями
Если вы пренебрегаете обновлением WordPress, WooCommerce и расширений, которые активируют ваш магазин, вы, вероятно, не заметите улучшения производительности. С каждым выпуском WooCommerce основные разработчики работают над добавлением улучшений на платформу, что часто включает в себя улучшения скорости и производительности.
Запуск последних версий основного программного обеспечения и любых расширений, которые вы используете, также обеспечит защиту вашего сайта от известных угроз безопасности и уязвимостей, которые могут сломать ваш магазин. Поэтому, если вы используете более старую версию WooCommerce или устаревшие расширения, пришло время сделать апгрейд. О том, как настроить автоматическое обновление WordPress ранее рассказывали наши разработчики.
Заключение
Мы рассмотрели с вами Топ-5 самых актуальных решений по ускорению интернет-магазина на WP. Поэтому, если вашему сайту нужна оптимизация woocommerce, то пора приступать ее выполнению: настройке менеджера скриптов и стилей, оптимизации изображений. Также следует задуматься о приобретении качественного хостинга, CDN. И не забудьте автоматизировать нужные обновления в woocommerce, так как разработчики периодически вносят изменения и устраняют накопленные ошибки. Наши советы еще раз доказывают, что для улучшения показателей сайта и привлечения новых клиентов не обязательно сразу заказывать услуги по оптимизации сайта у веб-разработчиков. Можно самостоятельно попробовать сделать сайт лучше.