Как оптимизировать сайт на WordPress

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

По данным сайта Speedtest, Россия находится на 89 месте по рейтингу мобильного интернета со скоростью 27,34 Мбит/с. Если рассматривать широкополосный доступ, то мы имеем 66 место со скоростью 89,7 Мбис/с. Выглядит вполне себе ощутимо. Казалось бы, к чему оптимизация, если средняя скорость по стране легко загрузит любой сайт. Тем не менее, не стоит забывать, что вряд ли никто не сталкивается с низкой скоростью или с иными проблемами, связанными с интернет-соединением. Особенно в дороге эта проблема может быть весьма ощутима. И эти 27,34 в один миг превратятся в 1. Да и в целом чем быстрее — тем лучше. Этот показатель влияет не только на пользовательский опыт, но и на ранжирование в поисковых системах. Поэтому оптимизировать можно до бесконечности.

Выясняем причины долгой загрузки сайта

Перед тем, как нам оптимизировать какой-либо сайт, следует проверить его скорость загрузки, чтобы можно было сравнить «до и после». Я предпочитаю использовать сразу несколько методов: раздел «Сеть» в панели разработчика Google Chrome; какие-либо онлайн-анализаторы. В случае с панелью разработчика, я получил скорость примерно в 2100 мс после сброса кеша. Без него — около 800. Из анализаторов я выбрал привычный PageSpeed Insights от Google и анализатор Loading Express. К сожалению, второй анализатор смог определить только скорость загрузки из Москвы, а мне хотелось бы проверить более дальние точки. Поэтому пришлось добавить сюда ещё и сервис от Ping Admin и оценить скорость загрузки из Токио. Результаты всех трёх тестов на скриншотах ниже. От Google я смотрел лишь мобильную версию, поскольку сейчас мобильные устройства имеют весьма большое значение, потому на них стоит обращать внимание в первую очередь.

Как видим, показатели на втором скриншоте приближены к тем, что я получил из панели разработчика. Оценка производительности — 78. Время загрузки из Японии — около 3 секунд. Учитывая, что сервер у меня в Санкт-Петербурге, 2 секунды это весьма много. Более того, это скорость практически в «простое», что будет при массовом посещении сайта даже страшно представить. Скорость загрузки с кешированием можно не учитывать вовсе, поскольку очевидно что не каждый посетитель будет каждый день заходить на наш сайт. Очень многие люди один раз просмотрят страницу и забудут о нём вовсе. Делаем вывод, что оптимизация и правда необходима.

Как оптимизировать сайт на WordPress: главная страница

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

Я использую плагин PageSpeed Ninja для оптимизации сайта. Чтобы повлиять на скорость решаю включить замену загружаемых шрифтов на автоматически выбранные браузером. Ранее я уже подгонял его под оптимальную работу, на некоторых пунктах сайт мог отображаться некорректно, а на других скорость загрузки и вовсе становилась больше. Поэтому лучше после каждого пункта оптимизации сравнивать скорость до и после изменений. После этого иду чистить CSS от комментариев и иного мусора. Для этого, кстати, тоже есть автоматизированные сервисы. Тут тоже стоит быть осторожным, поскольку таким образом можно сделать CSS нечитабельным или вовсе сломать дизайн. Изменения для разных CSS-файлов составили от 13 до 20%.

В процессе оптимизации я решил поменять PageSpeed Ninja на другой плагин и выяснил, что он уже не так хорош, как тогда, когда я его впервые использовал. Вместо него я установил WP-Optimize и a3 Lazy Load и результаты стали гораздо лучше.

Как оптимизировать сайт на WordPress: изображения

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

Самым базовым решением для ускорения главной страницы является отображение вместо полных изображений в блоках записей обложек формата thumbnail. Они меньше по размеру, потому и страница начинает загружаться быстрее. Это вполне легко сделать, достаточно использовать конструкцию «the_post_thumbnail(‘thumbnail’)» и уменьшенная версия изображений будет отображаться сама. На самих страницах с контентом такое делать нежелательно, поскольку читателям будет неприятно смотреть на эти сжатые изображения.

К слову о том, что я решил использовать ленивую загрузку изображений (Lazy Load). Помню было мнение, что такие изображения губят всю индексацию и отношение поисков к сайтам в целом. Тем не менее, используемый мной плагин делает всё корректно и изображения остаются доступными для индексации. Заглушка этого плагина не мешает индексировать изображения записей, я проверил это и в Google и в Яндекс, проблем нет.

Для оптимизации полных изображений я обычно пользуюсь другими методами. Уменьшаю их размер максимум до 1000 (либо высоту либо ширину, в зависимости от того что из этого больше). Изображения не станут из-за этого нечитабельными и всё будет вполне нормально. Далее я прогоняю их по сайтам с оптимизацией изображений с минимумом потерь по качеству, чтобы сохранить хороший вид картинки. В WP-Optimize, кстати, есть оптимизация изображений. Что мне нравится, так это возможность указать приоритет между качеством и весом картинки.

Как оптимизировать сайт на WordPress: технические моменты

Результаты проверок после изменений приведены на изображениях ниже. Видно, что показатели по Google PageSpeed стали лучше. Проверка через F12 показала загрузку в 1200 мс вместо 2100 мс ранее. Вторая проверка показала изменения загрузки всего на 0,3 секунды, тем не менее, мы видим уменьшение количества HTTP-запросов в 3 раза; уменьшение общего размера страницы более, чем в 2 раза; уменьшение первой отрисовки страницы. Разницы в загрузке с Токио нет, также я добавил Бразилию — 1,8 сек, что вполне неплохо. Вероятно, низкая загрузка из Токио связана с самим сервером. С телефона я также увидел более высокую скорость загрузки.

В зависимости от сервера/хостинга могут быть и технические стороны ускорения работы сайта. Я использую Apache и для лучшего кеширования включил модули headers expires. Консольные запросы для этого приведены ниже.

a2enmod deflate headers expires

Всем остальным, что касается серверной части, я занимался ранее, потому никаких дополнительных действий в этой области для меня не требуется. Если вы этим ещё не занимались, то можете выяснить проблемы с помощью анализаторов.

Иные вопросы оптимизации

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

Следует отказаться от излишних плагинов, особенно если они используют в своей работы Javascript. Они не только замедлят сам сайт, но и увеличат время загрузки ваших страниц. У меня сейчас всего 5 плагинов. Двое указанных выше для оптимизации, один для отключения комментариев, один для перенаправления и ещё один для работы с SEO. Больше мне не требуется.

Если вы делаете вёрстку сайта самостоятельно, то следует отказаться от излишнего использования Javascript и CSS, если это возможно. Сайт ваш, быть может, и будет более красочным и содержательным, но если он будет загружаться больше 5 секунд то многие пользователи этого видеть не захотят. Если в вашем header есть логотип сайта или иные изображения, следует уменьшить их размер до разумного минимума, чтобы сделать загрузку сайта быстрее.

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

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