Улучшаем скорость загрузки сайта WordPress
Опубликовано: 15.03.2018
Каждый сайт создается ради посещаемости, даже сайт-визитка, который вы заказываете у Вэбмастера или студии, предназначен для посетителя, но отличие сайта-визитки или лэндинга от многостраничного сайта, то что многостраничник можно продвигать по поисковым запросам, а это ряд мероприятий, который необходимо выполнить. Некоторые из них выполняются на этапе проектирования сайта, некоторые немного попозже, одно из таких мероприятий — оптимизация скорости загрузки сайта.
На что влияет скорость загрузки сайта
Влияет это в первую очередь на количество отказов, которые вы можете увидеть в Яндекс Метрике, во вторых со временем повлияет на поисковую выдачу, поисковые системы не любят выдавать пользователю «тормозные» сайты, которые будут у него долго загружаться, ведь медленный интернет или мобильное соединение не дают возможности загружать «тяжелые» страницы быстро, поэтому ваш посетитель скорее всего закроет вкладку браузера с вашим сайтом, если он будет долго грузиться, и откроет следующий после вашего, который ему предлагает поисковая выдача. Приведу пример показателей отказов в Яндекс Метрике, для тех кто не знает что это.
Как увеличить скорость загрузки сайта: неочевидные возможности ускорения работы сайта
Пример статистики отказов в Метрике
Сразу начнем с реального скриншота метрики, одного из проекта, которым я занимаюсь. Не спишите бросать в меня тапками, я не криворукий вэбмастер-оптимизатор, читайте дальше ))) 
6 советов, как улучшить скорость сайта. Академия SEO
У этого сайта плохой показатель, большой процент отказа. Дело в том что его мне заказали переделать, на этом домене был старый сайт, его взломали, и заказчик принял решение его переделать совсем, в итоге пользователи приходят по старым url из поисковиков, в основном Google, на которые сайт отдает ошибку 404 (нет этой страницы), в итоге пользователь просто закрывает ее.
Опытные вэбмастера могут задаться вопросом, почему не поставил редирект на новые страницы по новым url’ам,
Ответ: они более не актуальны. изменился ассортимент компании которая заказала сайт, на нужные запросы, редирект поставил ))
Идем далее, раз есть плохой пример, значит должен быть хороший, хотелось бы реабилитироваться, вот держите.
Те кто ушли, просто они не из нашего региона, запросы геозависимые, все вопросы к поисковику ))) Поговаривают что можно эту статистику вообще свести в ноль, но это тема совсем другой статьи, и в жизни сайта так не бывает.
Оптимизация кода сайта плагином
Для начала нужно оптимизировать CSS, HTML коды и коды скриптов, для этого есть специальный плагин, он называется , его скрин приведен ниже
Настройки не очень сложные, есть для продвинутых пользователей, есть для новичков, в общем смотрите сами
Тут все ясно, ставите галочки напротив блоков с типами кодов, но при этом смотрите что бы у вас на сайте что либо не отказало, может отключиться галерея, или перестанут открываться спойлеры, в общем экспериментируйте с настройками, не забываете при этом чистить кэш, или на время отключите плагин кэширования, о котором мы поговорим ниже.
Включаем кэширование на сайте
Кэширование на сайте под управление WordPress это просто необходимая штука, без него, по мере наполнения сайта контентом и увеличению числа посетителей в онлайне, возрастет нагрузка на хостера, а они этого очень не любят, поэтому ресурсы на каждом сервере ограничены для каждого договора хостинга, поэтому сайт начнет подтормаживать. Почему так происходит, дело в том что при обращении страницы, сервер каждый раз должен будет выполнить php код, прочитав при этом css стили и выполнив все скрипты. Что делает плагин кэширования? Он просто сохраняет созданные сервером страницы из ваших php в виде html файлов, которые складывает в свою папку, и когда в очередной раз к этой странице обращается пользователь, он просто отдает сохранную страницу, которая не нуждается в сложных процессах генерации ее сервером вашего хостера.
Я как и многие вэбмастера, использую плагин пробовал несколько других. на разных проектах, но этот понравился больше всего. Сразу перейду к настройкам. Я пользуюсь двумя кнопками в нем, после установки его нужно ключить, выбрать чекбокс 1, и нажать 2 «Обновить».
При дальнейшей работе над сайтом, вам понадобится кнопка (3), «Удалить весь кэш», если вы что то поменяли на сайте, цвет блока, шрифт, еще какой то элемент дизайна, обязательно удаляйте кэш смело, дело в том что вы можете не увидеть изменений, ведь сервер отдаст вам кэшированную страницу. После нажатия кнопки «Удалить кэш». будет это
Удаляйте весь кэш, потом обновляйте страницу.
Есть еще кэш браузера, его делает сам браузер, и хранит у себя в папке. сделано это тоже для скорости загрузки, его тоже нужно иногда удалять, для этого когда обновляете страницу, вместо F5, нажимайте Ctrl + F5
Оптимизация изображений на сайте
Теперь займемся медиаконтентом (фоточки, картиночки) нашего сайта, в современном сайтостроении без фото и картинок никуда, поэтому будем оптимизировать изображения, но тут я предлагаю обойтись без плагина. Я исключаю в этом вопросе видеоконтент, его есть смысл хранить на видеохостингах типа youtube.com, там они сами занимаются оптимизацией без нашего участия.
Почему без плагина? У нас оптимизация сайта, а установка кучи плагинов нам в этом деле точно не поможет, поэтому предлагаю использовать для этого заранее оптимизированные изображения, т.е. в реальном размере, не более разрешения экранов, я для этого использую программу для скриншотов с экрана, она выдает уже более менее оптимизированные изображения, но для достижения максимального эффекта, можно воспользоваться онлайн сервисом для оптимизации jpg и png файлов , просто нажимаем сверху на картинку, и выбираем что мы хотим оптимизировать.
Справа в желтой рамке, можно увидеть процент сжатия изображения, при этом без потери качества, данный сервис постоянно совершенствует алгоритмы сжатия изображений, поэтому стоит им пользоваться.
Для WordPress есть плагин от этого сервиса, если у вас на сайте ооочень много изображений, то тогда наверное стоит поставить его, для того что бы его установить наберите в поиске репозиторя WordPress — TinyPNG, и установите плагин стандартной процедурой, после чего его нужно будет активировать, подтвердив свою почту.