С 28% веб-сайтов, созданных с помощью OpenSource CMS, WordPress является наиболее широко используемой системой управления контентом в мире для создания сайтов и блогов. Вот 17 способов (среди многих других), которые можно использовать для оптимизации времени загрузки сайта, работающего под управлением WordPress.
Как проверить время загрузки вашего сайта/блога WordPress?
Чтобы проверить время загрузки вашего сайта или блога WordPress, несколько онлайн-ресурсов и инструментов позволяют вам проводить бесплатные тесты.
Среди имеющегося широкого выбора мы рекомендуем в приоритете эти 4 бесплатных инструмента:
Зачем оптимизировать время загрузки вашего сайта WordPress?
- Google использует время загрузки как один из многих факторов SEO-позиционирования. : поэтому более быстрое время загрузки дает вам больше шансов хорошо позиционироваться в поисковой системе, которую используют более 90% людей.
- Лучшее взаимодействие с пользователем = больше продаж/конверсий :
- сайт, который загружается более 5 секунд, имеет показатель отказов в 2 раза выше, чем сайт ниже.
- 53% мобильных пользователей покидают сайт, если загрузка на их смартфоне занимает более 3 секунд.
Теперь, когда вы знаете, почему вы должны оптимизировать скорость загрузки вашего сайта или блога WordPressвот как это сделать с помощью 17 практических советов.
17 советов по оптимизации времени загрузки блога или сайта WordPress:
(Важно отметить, что эти 17 советов перечислены не в порядке приоритета)
1- Максимально ограничьте количество плагинов WordPress: этот совет действителен для оптимизации времени загрузки, а также для ограничения риска нарушений безопасности. Хорошей практикой является наличие менее 20 активных плагинов, чем меньше, тем лучше и безопаснее.
2- Оптимизируйте вес и размер изображений, отображаемых на сайте: например, нет необходимости интегрировать изображение размером 1200 x 900 пикселей на ваш сайт WordPress, если последний будет отображаться для пользователей Интернета только в размере 600 x 450 пикселей. Также рекомендуется указывать размеры изображений непосредственно в HTML, чтобы идти еще быстрее (через атрибуты ширины и высоты, которые должны быть интегрированы непосредственно в тег и заполните точными размерами изображения).
3- Выберите правильный формат изображения (.jpg / .png / .svg / .webp) : для векторных изображений (логотипы, определенная инфографика, графические элементы без слишком большого количества цветов) предпочтительнее .png или .svg. Для других более сложных растровых изображений (фотографий) предпочтительнее формат .jpg или .webp. Например, наше избранное изображение для этой статьи весит всего 11 КБ при разрешении 834*467 пикселей. Мы использовали Photoshop и сохранили как PNG 8 в 16 цветах, чтобы добиться этого.
4- Сжатие ресурсов HTML, CSS и JS: если вы редактируете файлы CSS, HTML, JS, конечно, лучше иметь много пробелов, но они излишне замедляют работу вашего сайта WordPress. Многие бесплатные и платные плагины сделают всю работу за вас, среди них мы можем упомянуть: Fast Velocity Minify (все в одном), Minify HTML (только для минимизации HTML), Better WordPress Minify (CSS и JS), WP Rocket (все в одном). но платно). Если вы выберете плагин «все в одном», на вашем сайте WordPress будет достаточно только одного.
5- Включить кеширование сервера/браузера : Без включения кэширования сервера/браузера многие статические ресурсы на вашем сайте будут загружаться каждый раз, даже если они не изменяются. Чтобы активировать это, вы должны либо знать, как изменить свой файл .htaccess, либо использовать сторонние плагины, такие как W3 Total Cache, WP Fastest Cache и другие (достаточно одного плагина).
6- Используйте CDN (сеть доставки контента) : ваш сайт WordPress получает трафик из многих стран мира? Если это так, вам следует подумать о выборе CDN, чтобы ускорить загрузку ваших изображений и других ресурсов. На рынке существует множество CDN, таких как Cloudfare, MaxCDN и т. д.
7- Очистите базу данных от ненужных данных: со временем в базе данных вашего WordPress-сайта накапливается много бесполезных данных (заспамленные комментарии, мусор и т. д.). Регулярная очистка ограничивает его вес и, следовательно, время загрузки. Чтобы очистить его без риска, рекомендуется плагин WP Optimize (не нужно держать его активным после очистки).
8- Ограничьте внешние ресурсы, загружаемые на ваш сайт: Facebook Likebox, кнопка Twitter Twitter, кнопка LinkedIn Follow, Google Fonts и другие используют внешние ресурсы, которые способствуют замедлению (весьма существенному) времени загрузки вашего сайта WordPress. Например, на LEPTIDIGITAL, заменяющем лайкбокс Facebook, мы недавно выбрали очень легкое изображение, которое перенаправляет на нашу страницу в Facebook (вероятно, по пути мы теряем несколько лайков, но люди, которые действительно хотят следить за нашей страницей в Facebook, не будут заблокированы). тем).
9- Загружать ресурсы JS асинхронно: разница между синхронной и асинхронной загрузкой довольно проста: синхронный ресурс JS будет загружаться одновременно с остальной частью страницы, асинхронный ресурс будет ждать загрузки всех остальных ресурсов. загружается до загрузки (именно поэтому при загрузке страницы реклама часто появляется чуть позже).
10- Выберите хороший веб-хостинг: если выделенный сервер самый оптимизированный, то он и самый дорогой. Однако вы можете получить хорошую производительность с общим хостингом, оптимизированным для WordPress. Среди интересных хостов O2switch (тот, который мы исторически использовали для LEPTIDIGITAL) — мощный и недорогой хост.
11- Ограничьте количество сохраненных версий ваших статей через файл wp-config.php. : эта более продвинутая оптимизация WordPress требует модификации файла wp-config.php. Это особенно рекомендуется для сайтов с сотнями статей, хотя это также может повлиять на небольшие сайты.
Вот строка кода, которую нужно добавить в файл wp-config.php (вы можете изменить значение «3», чтобы разрешить большее или меньшее число изменений:
define('WP_POST_REVISIONS', 3);
12- Выберите плагин для обмена в социальных сетях, который не влияет на время загрузки вашего сайта. : счетчики обмена, как правило, жадные, и их следует избегать, но они также могут стимулировать обмен в будущем. Наиболее оптимизированным является создание кнопок общего доступа в HTML / CSS и JS без использования специализированных плагинов, которые, тем не менее, очень интересны, таких как SumoMe или MashShare (те, которые установлены на LEPTIDIGITAL на сегодняшний день).
13- Максимально ограничьте количество рекламных объявлений на страницах. : рекламные скрипты нельзя оптимизировать, так как они являются внешними ресурсами, поэтому загружайте их как можно меньше.
14- Ограничьте количество вызовов скрипта Google Adsense. : вы используете несколько рекламных блоков Google Adsense? Просто ограничьте количество вызовов рекламного скрипта AdSense, интегрировав его на страницу только один раз. Вот пример кода, который должен присутствовать в вашем исходном коде только один раз:
15- Оптимизируйте время загрузки мобильных страниц, выбрав AMP: если очень легко переключить блог WordPress на AMP с помощью официального плагина, однако необходимо будет оптимизировать CSS и исходный код, чтобы получить форматирование, близкое к вашей текущей мобильной версии. В качестве альтернативы у вас также есть плагин AMP для WordPress (непроверенный), который выглядит довольно хорошо.
16- Забудьте о HTTP, переключитесь на HTTP/2: протокол HTTP/2 немного экономит время загрузки. Единственное «неудобство», вы должны быть в HTTPS, чтобы иметь возможность воспользоваться преимуществами HTTP/2. Ваш хост также должен его поддерживать (o2switch поддерживает).
17- Активируйте поддержку активности в файле .htaccess: если это еще не сделано на вашем сайте WordPress с помощью плагина или в вашем файле .htaccess, мы настоятельно рекомендуем вам активировать HTTP Keep-Alive. Эта активация позволит передавать ваши файлы в ограниченном количестве подключений. Чтобы проверить, использует ли ваш сайт Keep-Alive, перейдите на этот сайт и вставьте любой URL-адрес с вашего сайта.
Если на вашем сайте не активирован keep-alive, вам просто нужно добавить эти 3 строчки кода в ваш файл .htaccess, расположенный в корне вашего сайта/хостинга:
Header set Connection keep-alive