Как улучшить скорость сайта на WordPress подробный гид для чайников | дизайнер Алла Краснова

Как улучшить скорость сайт на WordPress

| Опубликовано:

Хотите узнать как улучшить скорость сайта на WordPress? Вам нужны проверенные простые способы ускорить сайт на WordPress?

Ознакомьтесь и примените эти простые рекомендации из моего пошагового руководства по оптимизации скорости сайта. И результаты вас обязательно порадуют!

С 2018 года Google четко обозначил свое отношение к скорости загрузки сайта и назвал ее как один из факторов ранжирования, особенно для мобильного поиска.

Медленные сайты предлагают плохой пользовательский опыт, поэтому из–за низкой скорости загрузки теряют посетителей и клиентов.

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

Основные выводы: оптимальная скорость загрузки сайтадо 3 секунд, обращать внимание на скорость загрузки первого байта — до 1,3 секунды, количество объектов на странице — до 50, вес страницы — 500 КВ.

Хорошо– хорошо, а как достичь таких прекрасных показателей? Что делать, если вы не технический специалист?

Я подготовила для вас 15 простых способов, с помощью которых можно ускорить скорость загрузки сайта.

Перед выполнением работ по оптимизации сайта следует предварительно сделать бэкап (резервную копию) вашего сайта. Это важно, т.к. в результате действий с сайтом его работа может быть нарушена и вам нужно будет «откатиться» на предыдущую версию сайта. Сделайте заблаговременно копию сайта, это не займет много времени.

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

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

Самые типичные ошибки редизайна сайта на WordPress чек лист | дизайнер Алла Краснова

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

Можно сделать таблицу в тетради или в гугл документах.

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

Я рекомендую тестировать скорость сайта при помощи следующих сервисов: Pingdom Website Speed Test, GTmetrix, PageSpeed Insights.

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

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

Как улучшить скорость сайта на WordPress (простые способы) | дизайнер Алла Краснова
Как улучшить скорость сайта на WordPress (простые способы) | дизайнер Алла Краснова

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

Давайте с этого и начнем.

Быстрая навигация

#1. Оптимизация изображений для сайта

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

Это важный шаг! Ваш сайт заметно прибавит в скорости!

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

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

Проверьте параметры изображений в медиатеке вашего сайта. Даже если вес изображения около 100 КБ, то такие картинки все равно надо подвергать компрессии.

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

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

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

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

Что можно сделать? Можно установить один из плагинов оптимизации изображений, который будет проводить компрессию изображений сразу на сайте при загрузке в медиатеку.

Например, я использую плагин Smush. Но еще до загрузки на сайт я провожу компрессию файлов изображений на онлайн–сервисах. Даже те, которые создаю сама в Adobe Photoshop. Так я стараюсь не нагружать плагин и предоставить ему немного работы.

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

#2. Ограничить количество элементов на странице до 50

Раньше на моей главной странице было больше элементов в блоке с услугами, я больше показывала примеров из своего портфолио. Потом сократила, оставила только 3 элемента в блоке услуг и 4 примера из портфолио. Это немного прибавило скорости и сократило количество запросов к серверу.

Как эти действия еще сказываются на скорости сайта — так мы уменьшаем вес страницы, тоже следуем рекомендации Гугл.

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

#3. Отложенная загрузка изображений (Lazy Load)

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

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

Установите для этих целей один из плагинов отложенной загрузки. Например, Smusha3 Lazy Load справляются с этой задачей.

#4. Оптимизация видео на сайте

Если у вас на сайте есть видео, то его тоже стоит оптимизировать.

Кроме того, не используйте автозапуск видео. И, самое главное, я думаю, вам это известно, не загружайте ваши видео ролики напрямую на сайт (хотя Вордпресс и позволяет).

Используйте для этих целей видео–сервисы, например, YouTube, Vimeo. Размещайте видео там, а на сайте встраивайте проигрыватель.

#5. Удалите неиспользуемые плагины

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

Если плагин вас так уж сильно заинтересовал, то запишите его название. Если он не задействован в работе сайта, его надо удалить.

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

И есть различные споры до сих пор, сколько плагинов допустимо устанавливать на сайт без угрозы скорости загрузки сайта. Есть мнения, что и 40 вполне допустимо. Я сомневаюсь, если честно.

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

Все просто: если плагин не имеет функциональной значимости, от него нужно отказаться.

#6. Удалите неиспользуемые темы оформления

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

#7. Оптимизируйте базу данных

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

Если вы работаете над объемной статьей, длиной более 2000 слов, представьте, сколько вариантов отправиться на вечное сохранение?

Ясное дело, что так база данных вашего сайта просто «разрастается» от такого количества данных. Соответственно, и вес сайта растет тоже.

Что нужно предпринять?

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

На помощь приходит замечательный плагин WP Optimize.

Запускайте очистку всякий раз после внесения изменений на сайте, например, после публикации нового поста в блоге.

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

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

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

Как ограничить количество ревизий статей на сайте WordPress? Есть способ сделать это при помощи вставки небольшого фрагмента кода, но я вам обещала простые способы оптимизации сайта, поэтому мы поступим по–другому.

Плагин Clearfy (я его уже советовала в своем обзоре самых полезных плагинов для сайта на WordPress) поможет нам заставить WordPress «забыть» сохранять все редакции записей.

#9. Обновление ядра сайта WordPress, тем и плагинов до актуальной версии

Что дает своевременное обновление «движка» WordPress?

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

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

#10. Обновление до последней версии PHP

 WordPress работает на PHP. Каждый новый релиз РНР содержит новые решения и улучшения в производительности. Поэтому используйте эту возможность повысить производительность сайта и разогнать свой сайт на WordPress.

Как узнать версию PHP сайта на WordPress? Где найти сведения о РНР своего блога?

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

Еще можно узнать в админке сайта на WordPress. Для этого в административной панели выбираем вкладку «Инструменты» — «Здоровье сайта». Там находим описание свойств сервера. Среди прочих характеристик будет указана версия PHP, на которой работает ваш сайт.

#11. Размер страницы не более 1,5 Мб

В Pingdom и GTmetrix сразу выводят информацию и о размере страниц, поэтому очень удобно отслеживать.

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

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

Кстати, это повод не увлекаться анимацией, а оставить только нужные эффекты. Если на вашем сайте задействована анимация (признаюсь, я тоже фанатею от анимации. Да кто останется равнодушным?), то это сразу добавляет вес странице.

И что делать в этом случае? Я думаю, это ваш выбор. Что важнее: «светяшки –блестяшки» или скорость вместе с удобством для посетителей?

#12. Сократить размер файлов HTML

Как минимизировать файлы с кодом сайта? Как это ускорит сайт на WordPress?

Если вы хоть раз заглядывали в код своего сайта (а это легко сделать, просто в браузере Гугл нажмите клавишу F12 или через правый клик выберите «Просмотреть код»), то, возможно, заметили, что код не идет сплошной стеной, а прерывается на короткие или пустые строки.

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

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

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

Пробелы в тексте очень помогают восприятию смысла, но не случае с кодом.

Поэтому наша задача: убрать лишнее и сомкнуть ряды.

Плагины Clearfy и Autoptimize — поручите им эту работу по оптимизации сайта на WordPress и уборке кода. Но будьте внимательны с настройками, не переусердствуйте.

С осторожностью используйте оба этих плагина одновременно на сайте — они часто входят в конфликт между собой.

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

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

#13. Исправьте неработающие ссылки

Как нерабочие ссылки замедляют скорость загрузки сайта?

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

В случае неработающей ссылки, перехода по ней нет. Как правило, тогда срабатывает ошибка 404 — перебрасывает на страницу «Ой, а такой страницы у нас нет» или что–то в таком же духе.

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

Потому поисковые системы не любят битые ссылки.

Что делать и как отслеживать нерабочие ссылки?

Плагин «must have» для каждого сайта на WordPress — Broken Link Checker. Ваша задача периодически запускать его для проверок всех ссылок на сайте.

>> Проверьте еще мои рекомендации по самым важным плагинам для сайта на WordPress << 

>> Что нужно сделать сразу после установки WordPress <<

#14. Настройте кэширование сайта

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

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

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

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

#15. Отключите трекбеки и пингбеки

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

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

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

Поэтому наша задача не дать доступ ботам к сайту своими действиями — в настройках на вкладке «Обсуждение» НЕ отмечаем чекбоксы с пингбеками и трекбеками, как бы заманчиво не звучали описания к этим пунктам.

#16. Отключите emoji

Чем смайлики не угодили?

Встречный вопрос: а вы хоть ими пользуетесь? А если пользуетесь и они вам жизненно необходимы, то на ваше усмотрение. Решайте сами.

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

#17. На странице блога выводить показ анонсов, а не статей полностью

Об этом я писала в своем руководстве по созданию сайта с нуля на WordPress.

Это важная функция — если у вас на странице блога задан показ 10 публикаций, и все они показаны в полном виде, то только представьте, сколько усилий нужно посетителям, чтобы пролистать страницу до конца!

К тому же, это «отличный» способ потерять посетителя. И так увеличить показатель отказов.

Настроить показ анонсов легко — просто отмечаем чекбокс «Анонсы статей» в настройках на вкладке «Чтение».

#18. На странице блога выводить не более 10 анонсов

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

Чтобы не утяжелять страницу, достаточно 10 фрагментов на странице.

А чтобы подстраховаться, никто не запретит вам настроить показ, например, 8 анонсов статей.

Настроить число анонсов тоже легко, на той же вкладке настроек «Чтение».

#19. Оставьте только нужные кнопки социальных сетей

Если у вас установлен плагин расшаривания в социальных сетях (я надеюсь, что да), то ограничьте количество кнопок.

Показывайте самые основные для вашей аудитории. Если вы делитесь своими рецептами, например, то кнопка для расшаривания в LinkedIn однозначно не нужна.

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

#20. Изменить адрес страницы входа в административную панель сайта

Это одна из самых основных настроек, которые нужно сделать сразу после установки WordPress.

К сожалению, адрес стандартной страницы входа в админку сайта известен не только вам, но и всему интернету. Это сразу ставит ваш сайт под удар: в результате активных атак ботов путем перебора пароль может быть взломан.

Я надеюсь, вы установили надежный пароль? Не менее 8 символов, буквы в разном регистре и специальные символы?

Если пароль отличный, то вы большой молодец.

Почему важно настроить собственную ссылку для страницы входа в админку сайта и как это поможет ускорить сайт?

Дело в том, что во время атак ботов на сайт, когда они «стучатся» в админку, создается большая нагрузка на сервер, сайт замедляется.

Надо сказать, что сама операция по изменению адреса страницы входа никак не отразится на скорости сайта сейчас, при оптимизации сайта.

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

#21. Минимизировать CSS и Java Script

Звучит трудно, но вполне осуществимо.

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

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

Плагины Clearfy, Autoptimize могут произвести сжатие файлов CSS и JS, но будьте предельно внимательны, чтобы не переусердствовать.

Проверяйте работоспособность сайта после всех манипуляций. Одна «галочка» способна отправить весь сайт в нокаут.


#22.Использовать сжатие Gzip

Gzip–сжатие тоже работает на ускорение сайта.

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

В результате Gzip–компрессии файлы сайта архивируются, упаковываются и легко распаковываются при запросе.

Но надо помнить, что это создает дополнительную нагрузку на сам сервер. Учтите этот момент. Если сервер слабоват, то он замедлится.

И вам может прилететь предложение перейти на более дорогой тариф.

На большинстве хостингах эта функция предоставляется по умолчанию. Проверьте, работает ли у вас Gzip–компрессия на этом онлайн–сервисе. 

Gzip–сжатие можно включить при настройках большинства плагинов кэширования.

#23. Пользуйтесь качественным хостингом с сервером в вашей географической зоне

Не стоит размещать свой сайт на серверах в Северной Америке, например, если ваша основная аудитория — жители России и близлежащих стран.

Дело в том, что важен показатель времени ответа сервера, за которое сервер возвращает первый запрашиваемый байт HTML–файла вашего сайта.

Узнать время отклика сервера можно в админке вебмастера в Яндкс и Гугл, и на сайтах для тестирования скорости загрузки сайта: Pingdom, GTmetrix, PageSpeed Insights.

Оптимальное время отклика сервера — до 200 мс.

Это не время загрузки сайта, но важный показатель, на который важно ориентироваться при оптимизации сайта.

Много раз упоминала и еще раз могу: не размещайте свой сайт на  бесплатных хостингах, хорошей скорости загрузки сайта вам там не видать.

#24. Удалите дубли страниц

Речь идет о страницах с записями.

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

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

Избавиться от дублей страниц можно с плагином Clearfy.

#25. Отключить граватары

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

Можно поступить просто — отключить граватары и установить плагин WP User Avatar для образования локальных аватаров.

#26. Отключить Embedes

Этот скрипт помогает легко внедрить видео на ваш сайт. Благодаря этому скрипту, WordPress генерирует превью плеера при вставке видео на страницу.

Но если вы не используете видео на своем сайте, то этот код даром нагружает сайт.

Отключаем его при помощи плагина Clearfy.

#27. Оптимизация производительности шрифтов

Бывает, владелец сайта просит установить на сайт нестандартный шрифт: хочется выделить свой сайт на фоне остальных.

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

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

Может получиться, что красотой нестандартных шрифтов вашего сайта будете любоваться только вы.

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

Еще по теме: >> Типичные ошибки при ведении блога <<

>> Полезные инструменты для ведения блога <<

Спасибо, что дочитали до конца! Публикация вышла приличная, но оно того стоило, не так ли?

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

Если вы тонете в потоке информации или у вас возникли вопросы по настройке сайта, то свяжитесь со мной.

Заключение

Видите, нет одного верного способа ускорить сайт на WordPress. Оптимизация скорости сайта требует комплексного решения.

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

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

Какие способы ускорить сайт на WordPress используете вы? Какие результаты получили? Поделитесь в комментариях!

Одна небольшая просьба: если вам понравилась эта статья, то поделитесь ею на вашей любимой социальной платформе, — это сделает мой день! Спасибо!

Как улучшить скорость сайта на WordPress (простые способы) | дизайнер Алла Краснова
Как улучшить скорость сайта на WordPress (простые способы) | дизайнер Алла Краснова