Полное руководство по оптимизации скорости WordPress

Представьте, что у вас большое собрание, а ваша команда репетирует весь месяц. После всех этих приготовлений за вами бежит товарищ по команде, которому поручено принести ноутбук, необходимый для презентации. И товарищ по команде появляется на десять минут позже запланированного, и ваш потенциальный клиент устает ждать.

Что ж, это звучит слишком пагубно и не понравится клиенту. Теперь вы можете представить, что чувствуют ваши посетители, когда им нужно сидеть и ждать, пока ваш сайт загрузится в их браузере. Как вы думаете, что они будут делать, если какая-то веб-страница загружается более десяти секунд? Или даже шесть? Четыре?

Ни для кого не секрет, что скорость сайта имеет значение. Никому не нужен сайт с медленной загрузкой, особенно Google. Итак, если вы не хотите создать плохой пользовательский опыт и снизить свои шансы на ранжирование в Google, самое время что-то сделать с оптимизацией скорости WordPress.

Поскольку почти 40,0% Интернета работает на WordPress, существуют сотни тысяч плагинов, тем и других технологий, которые должны сосуществовать, чтобы оптимизировать скорость WordPress. Обычный пользователь WordPress может найти это кошмаром, когда его веб-сайт настроен на узкое место, и они даже не знают, почему.

Здесь мы поделимся абсолютно всем, что нужно знать об оптимизации скорости WordPress, чтобы вы могли начать ускорять свой сайт уже сегодня. Будем надеяться, что мы сможем управлять оптимизацией производительности WordPress, не вдаваясь в технические подробности или «на основе кода». На самом деле, мы стараемся избегать примеров кода здесь.

Итак, вы готовы? Давайте начнем.

i) Что замедляет работу вашего сайта WordPress?

Прежде всего, давайте рассмотрим некоторых серьезных виновников, которые замедляют работу вашего сайта. Это разделы, на которых вы должны сосредоточить свое внимание.

а. Картинки

Невероятный размер изображения убивает скорость сайта.

б. Видео

Функции WordPress, такие как видеофоны, — это круто, но они также влияют на производительность сайта.

в. Плагины WordPress

Плагины WordPress, безусловно, спасают жизнь, но вопрос «какой именно» и «сколько» будет иметь значение.

д. Темы WordPress

То же правило относится и к темам. Хороший веб-дизайн WordPress является обязательным. Однако плохо закодированная тема имеет слишком много файлов и скриптов, чтобы вызвать у вас проблемы.

е. Скрипты

Все, что содержит чрезмерное количество JavaScript, jQuery или других сторонних скриптов, может замедлить работу ваших веб-страниц.

ф. API

API определенно помогают в управлении контентом. Но если серверы, к которым подключен ваш сайт, работают медленно, то и ответ сайта будет медленным.

грамм. небрежность

Неряшливость может случиться в вашей медиа-папке, плагинах, контенте вашего блога или вашей базе данных.

час Неработающие ссылки

Одна-две битые ссылки не страшны. Но сайт, полный неработающих ссылок, может сказаться на пользовательском опыте и снизить скорость, поскольку ваш сервер продолжает работать с этим неработающим соединением.

я. перенаправление

Опять же, перенаправление не позволяет посетителям столкнуться с неработающими ссылками/старыми URL-адресами, но их слишком много — это нагрузка на сервер.

Прежде чем мы начнем…

ii) Резервное копирование, подготовка и тестирование

Лучшая стратегия для резервного копирования веб-сайта WordPress — создать новый поддомен (например, testing.domain.com) и выполнить всю работу по оптимизации на нем. Большинство поставщиков хостинговых услуг, таких как WPEngine, Siteground, Kinsta и другие популярные компании, предоставляют постановку одним щелчком мыши. Если ваша хостинговая компания не обеспечивает создание промежуточного сайта, вы можете использовать бесплатные или платные плагины для резервного копирования, чтобы получить резервную копию. Когда вы будете удовлетворены результатами на тестовом сайте, вы можете внести свои фундаментальные изменения в свой реальный сайт. Теперь ваш сайт оптимизирован для скорости без проблем.

Другой метод, который вы можете использовать, — это создание дочерней темы. Использование дочерней темы гарантирует, что изменения, внесенные в файлы вашей темы, не будут перезаписаны в родительской теме.

Наконец, проверьте свою текущую скорость с помощью этих тестовых сайтов WordPress Speed.

• Скорость страницы Google
• GTmetrix
• Пингдом

Теперь давайте начнем шаги по оптимизации производительности WordPress.

1. Выберите высокопроизводительного хостинг-провайдера

Начнем с хостинговой компании, которая имеет следующие характеристики:

• Тот, кто специализируется на хостинге WordPress — они понимают присущие CMS проблемы с производительностью.
• Предлагает некоторые варианты управляемого хостинга
• Использует новейшие и самые быстрые технологии
• Включает кэширование и CDN
• И отличная поддержка клиентов не повредит

Но как выбрать лучший?

Самый простой способ измерить качество хостинга — проверить TTFB. Время до первого байта обозначает время ответа сервера, которое в основном показывает, насколько быстр сервер. Вы можете использовать ByteCheck для бесплатного тестирования TTFB. WPengine, Kinsta, SiteGround, Bluehost, HostGator и т. д. — это некоторые провайдеры хостинга веб-сайтов, которым можно доверять.

2. Используйте кеширование

Кэширование веб-сайта — это метод, при котором статическая HTML-версия вашей веб-страницы сохраняется и повторно используется, когда посетители заходят на веб-сайт. Таким образом, в браузере уже будет необходимая информация о сайте, что улучшит скорость WordPress.

Особенно для статического сайта, который не часто обновляется, использование плагина кэширования было бы крайне полезным. WP Rocket, Cache Enabler, WP Super Cache, W3 Total Cache и т. д. — лучшие на рынке.

Эти плагины снижают время загрузки вашего сервера и решают другие задачи оптимизации скорости, такие как:

• Браузер и кэширование на уровне страниц
• Gzip-сжатие файлов
• Объедините файлы CSS и JavaScript
• Минимизация CSS, HTML и JavaScript
• CDN-интеграция

Если у вашего хостинг-провайдера уже есть система кэширования, добавлять дополнительный плагин не нужно.

3. Выбирайте плагины и темы с умом

Знаете ли вы о нагрузке, которую тема и плагин могут создать на своем сервере? Вот почему вам нужно быть разборчивым в использовании тем и плагинов WordPress.

а. Правильная тема WordPress

Плохо закодированная и необновленная тема добавляет бесполезные скрипты на страницы, что ухудшает загрузку страниц. Итак, установите свой выбор для контроля качества, прежде чем устанавливать его на свой сайт. К сожалению, большинство бесплатных тем WordPress на рынке выглядят хорошо по дизайну и полны дополнительных функций, но игнорируют производительность.

Наша хорошая тема поставляется с набором специальных функций повышения производительности и устраняет необходимость в дополнительных сторонних плагинах.

б. Используйте только самый необходимый плагин

При выборе плагинов WordPress помните о следующих советах:

• Знание необходимости плагина или некоторых функций WordPress / простого кодирования доступно в качестве дополнения к плагину.
• Просмотрите каждый плагин вместе с отмеченными проблемами производительности — никогда не устанавливайте то, что имеет сомнительную историю.
• Ищите плагины с множеством функций и функций, чтобы вы могли использовать только один вместо многих
• Обновление тем и плагинов необходимо для обеспечения безопасности и скорости вашего сайта. Но в то же время некоторые обновления могут сделать темы/плагины и WordPress несовместимыми. Поэтому устанавливайте только в том случае, если обновление полезно.

в. Переосмысление использования вашего плагина

Да, использование слишком большого количества плагинов WordPress каким-то образом замедлит работу вашего сайта. Но количество плагинов не так важно, как качество плагинов, которые вы используете. На самом деле важно то, как был разработан этот конкретный плагин — был ли он создан с учетом производительности? Это означает, что вы также можете просмотреть некоторые из своих старых плагинов и заменить их новыми и облегченными.

4. Используйте PHP 7 и выше

Вы когда-нибудь слышали о версиях PHP? Вы должны иметь. PHP — это серверный язык сценариев с открытым исходным кодом. Большинство ваших тем и плагинов, наряду с основным программным обеспечением WordPress, в основном написаны на PHP.

Во-первых, убедитесь, что ваш хост WordPress использует как минимум PHP 7 или выше. Согласно данным, только 6,8% всех сайтов WordPress используют PHP 7.3, но еще колоссальные 28,6% все еще используют PHP 5.6 (выпущенный в 2014 году).

Что, если бы кто-то подарил вам телефон, выпущенный еще в 2014 году? У него будет медленный и вялый отклик, который сведет вас с ума.

Именно так ваши посетители будут чувствовать себя с PHP 5.6.

5. Используйте SSL/HTTPS

SSL-сертификат напрямую не влияет на скорость WordPress, но все же настоятельно рекомендуется его получить. Во-первых, и это важно, Google подтверждает, что правильное использование HTTPS/SSL дает вам более высокие рейтинги.

Более того, поскольку веб-сайты с сертификатом SSL отмечены небольшим зеленым значком замка, расположенным над адресной строкой, они повышают доверие клиентов.

Другая причина — безопасность. Наличие SSL-сертификата на вашем сайте зашифрует передачу данных/информации на ваш сайт и с него, что сделает ваш сайт более безопасным.

6. Оптимизация изображения

Наличие изображений на вашем сайте всегда хорошо. Но неправильный тип может стать самой большой катастрофой для вашего сайта. Быстрый способ ускорить работу вашего сайта — оптимизировать изображения.

Знаете ли вы, как оптимизация изображений может ускорить ваш сайт? Это может уменьшить использование пропускной способности вашего веб-сайта, быстро открываться, чтобы поддерживать интерес пользователей, и не дает поисковым системам Google еще одну причину ненавидеть ваш веб-сайт.

Существуют различные способы оптимизации изображения. Все о них мы узнаем здесь.

а. Выбор правильного формата изображения

Наиболее часто используемыми форматами изображений в этом десятилетии являются JPG, PNG, SVG и GIF. GIF в основном предназначен для анимированных изображений, а JPG и PNG — для неподвижных изображений. Среди этих двух формат JPG (или JPEG) идеально подходит для отображения многоцветных изображений. Формат SVG явно используется для логотипов. PNG используются только в тех случаях, когда SVG невозможен и необходимо сохранить прозрачность изображения, поэтому JPG также не подходит.

Но с таким количеством приложений для редактирования в Интернете вы не должны путаться в том, какой формат изображения выбрать. Одним из таких инструментов является XnConvert. Вы можете просто перетащить сюда свое изображение и сохранить его в формате наименьшего размера. Вы также можете использовать XnConvert для изменения размера, обрезки, изменения форматов изображений и многого другого в количестве сотни.

б. Используйте сжатие изображений

Теперь вы сохранили файл в формате JPG или PNG; пришло время сжать файл.

Это что?

Когда вы впервые делаете снимок, он считается со 100% качеством. Вы можете понизить качество изображения (сжать) его до меньшего размера. Вы можете сжать файл изображения JPG до 85-90% без каких-либо изменений.

Вы можете конвертировать изображения вручную перед их загрузкой или просто использовать плагин. Известно множество плагинов для сжатия изображений в WordPress. Полезными являются ShortPixel Image Optimizer, reSmush.it, оптимизатор изображений EWWW и компрессор WP.

Но неправильная оптимизация изображений также снижает производительность вашего сайта. Одними из лучших методов оптимизации изображений являются оптимизация изображений на основе сервера и локальная оптимизация изображений перед их загрузкой.

В качестве альтернативы можно использовать плагин LiteSpeed, который в основном представляет собой плагин кэширования, который также позволяет сжимать изображения с помощью надстройки Google Pagespeed. Поскольку LiteSpeed ​​сжимает все изображения на своем сервере, время отклика вашего сервера не повлияет на работу. Но вам нужно сжимать их партиями.

в. Укажите размеры изображения

Указание размеров изображения в основном связано с взаимодействием с пользователем. Давайте узнаем, как.

Когда страница сначала загружает текст, размер изображения также определяется макетом страницы. Но после того, как изображения загружаются одновременно, браузер находит изображения разных размеров и автоматически настраивает макет страницы. По сути, для каждой последующей загрузки изображения через некоторое время браузеру необходимо заново создавать макет страницы. При таких изменениях посетитель не может прочитать текст, когда страница продолжает двигаться.

Указание размеров изображения заранее избавит вас от этой проблемы.

д. Подавать масштабированные изображения

Это необходимо сделать, если ваша тема не оптимизирована для обработки изображений. В идеале вы можете просто изменить используемую тему на тему с оптимизацией изображения. Или вы также можете использовать плагины, такие как Force Regenerate Thumbnails или Regenerate Thumbnails, для создания миниатюр. Просто установите правильные размеры для миниатюр, прежде чем использовать такие плагины.

7. Оптимизация Граватара

Глобальный аватар позволяет вам, а также комментаторам вашего веб-сайта получать изображения в своем профиле. Без сомнения, использование Gravatar имеет огромные преимущества, но наиболее существенным недостатком является медленное время загрузки. В довершение всего, Gravatar также включает в себя несколько перенаправлений, чтобы еще больше замедлить работу вашего сайта.

Вы можете избежать раздувания, вызванного Gravatar, следующими способами:

• Отключите Gravatar на своих сайтах
• Удаляйте лишние и спам-комментарии к постам
• Добавьте reCAPTCHA в форму комментариев
• Настройте параметр WordPress для отображения только нескольких комментариев за раз.
• И, наконец, используйте плагин кэширования для Gravatar.

8. Ленивая загрузка видео и изображений

Отложенная загрузка изображений — это эффективный и простой способ оптимизации, позволяющий значительно сократить время загрузки вашего веб-сайта. Без отложенной загрузки все медиафайлы, такие как изображения и видео, загружаются еще до того, как они прокрутятся до этого раздела. Это, очевидно, делает ваш сайт медленнее, особенно если на вашем сайте много изображений/видео. Ленивая загрузка загружает изображения и другие тяжелые ресурсы только после того, как посетитель прокручивает до раздела на веб-странице, где они появляются. Если все сделано правильно, отложенная загрузка может значительно повысить скорость веб-сайта.

Давайте научимся использовать отложенную загрузку

1. Во-первых, получите плагин отложенной загрузки из каталога WordPress и установите его.
2. Зайдите в настройки плагина и настройте его

Помните, что ленивая загрузка связана со сложной техникой. Если не настроить правильно, это может испортить весь ваш сайт.

9. Ленивая загрузка Disqus

Возможно, пришло время заменить классическую систему комментариев WordPress на Disqus. Несмотря на то, что передовые, высокоэффективные функции предотвращения спама и модерации заслуживают похвалы, за это приходится платить, т. е. время загрузки.

Всякий раз, когда Disqus загружается на ваш сайт, он вызывает десять дополнительных запросов, замедляющих работу вашего сайта. К счастью, есть плагин, такой как Disqus Conditional Load, который вызывает ленивую загрузку самого Disqus. Эта условная загрузка Disqus загружает комментарий только тогда, когда посетитель прокручивает страницу до конца.

10. Ограничьте количество ревизий постов

По умолчанию WordPress сохраняет все редакции постов, даже если вы вносите малейшие изменения. Таким образом, для часто редактируемого/обновляемого поста создаются десятки копий одного и того же поста, чтобы заполнить вашу базу данных.

Чтобы избежать этого, вы можете ограничить количество ревизий/обновлений, сохраняемых в WordPress. Обычно от 3 до 5 должно быть достаточно. Вы можете сделать это, поместив простой код в файл wp-config.php .

 определить ('WP_POST_REVISIONS', 3);

Вы можете изменить число в коде, чтобы настроить количество ревизий, которые вам могут понадобиться.

Но этот код будет работать только для нового поста. Чтобы удалить старые версии сообщений, вы можете использовать плагины для очистки базы данных, такие как WP-Optimize и Advanced Database Cleaner. После использования плагинов вы можете просто удалить плагин.

11. Ограничьте количество пауков и сканеров

Пауки и поисковые роботы всегда ищут ресурс на вашем сайте. Помимо полезных пауков поисковых систем, другие боты, такие как спам-боты, скребки, скребки электронной почты, часто сканируют ваш сайт. Они не только крадут информацию с вашего сайта, но серверу приходится тратить ресурсы на их обслуживание.

Таким образом, разумно управлять действиями ботов на вашем веб-сайте, чтобы проверять наличие такого бесполезного сканирования следующими способами.

1. Вы можете использовать файл .htaccess для блокировки известных вредоносных ботов.
2. Вы можете заблокировать ботов на своем веб-сайте, когда такие боты появятся на рынке впервые.
3. Можно использовать плагин безопасности WordFence для ограничения ботов и блокировки IP-адресов вручную.

12. Использование кнопок обмена в социальных сетях без JavaScript

Да, нам понадобятся красивые кнопки социальных сетей, чтобы поощрить наших посетителей. Но кнопки социальных сетей, в основном сделанные на JavaScript, тяжелые. Они отслеживают пользователей в Интернете и долго загружаются.
Таким образом, было бы полезно, если бы вы использовали кнопки социальных сетей без JavaScript. Для этого удалите существующие кнопки и используйте такой сервис, как sharingbuttons.io.

13. Бонус

А если вас пока не устраивает результат, можно пойти еще на несколько хитростей. Эти трюки предназначены в первую очередь для профессиональных кодеров. Давайте перечислим их.

• Отключить смайлики и вставки
• Удалить строки запроса
• Удалить тег короткой ссылки
• Удалить ссылки REST API
• Отключить Google Карты
• Отключить таблицы стилей/виджеты WooCommerce
• Избегайте использования шрифтов Google/серверных шрифтов локально
• Оптимизация значков Font Awesome
• Отключить XML-RPC
• Скрыть версию WordPress
• Удалить тег ссылки RSD
• Объедините CSS и Javascript

iii) Разные проблемы, разные решения

Знание преимуществ оптимизации скорости веб-сайта и ее техники — хорошее начало. Но вам не нужно применять все эти методы к вашему сайту. Мы имеем в виду, что, поскольку не существует двух одинаковых компаний или двух одинаковых сайтов, первым шагом является понимание характера/типа сайта WordPress, которым вы владеете.

Таким образом, если у вас есть статический сайт, вы не будете регулярно обновлять его содержимое; возможно, вы делаете минор только пару раз в месяц. Статический сайт включает в себя локальные бизнес-сайты, блоги, фотографии, частные лица и т. д. Наличие такого сайта означает меньшее количество баз данных, и, следовательно, вам не потребуются многочисленные ресурсы для достижения хорошей производительности.

С другой стороны, имея чрезвычайно динамичный веб-сайт, такой как электронная коммерция, онлайн-форумы и т. д., данные сайта WordPress часто меняются (каждую минуту или даже каждую секунду). В таком случае необходимы дополнительные серверные источники, а также запросы к базе данных.

А еще есть другие виды сайтов, На проходной и потребляющий. Если веб-сайт в первую очередь информационный, посетитель может остаться на 5 или 10 минут и определить, когда ему нужно уйти. С другой стороны, потребляющие веб-сайты удерживают своих посетителей в течение нескольких часов, например, веб-сайт онлайн-курсов. Одновременные посетители таких сайтов приходят на одновременные сеансы.

Вы видите, куда это идет? Одновременным посетителям необходимо быстро накапливать информацию о предыдущем сеансе. Наличие большого количества одновременных посетителей сайта вместе с проблемой «некэшируемого веб-контента» превращает его в кошмар.

По сути, вы не можете работать со всеми своими веб-сайтами WordPress одинаково — решение должно быть принято взвешенно.

Вывод

Без сомнения, существует более чем множество учебных пособий, которые охватывают различные способы оптимизации скорости WordPress. Но может быть сложно найти все в одном месте. Надеюсь, это было полезно для вас, поскольку мы перечислили все методы, которым вы можете следовать, чтобы ваш сайт загружался быстро. Кроме того, если вы хотите получить помощь от эксперта, вы можете найти нашего сертифицированного эксперта WordPress по Codeable или отправить форму запроса на настройку, чтобы связаться с нами.

С наилучшими пожеланиями!!