×
Россия +7 (495) 139-20-33

Как ускорить сайт на WordPress, чтобы получить 100/100 в Google PageSpeed Insights

Россия +7 (495) 139-20-33
Шрифт:
15 36214
Подпишитесь на нас в Telegram

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

Западный SEO-консультант Ник Лерой (Nick Leroy) рассказал, что много внимания уделял скорости загрузки сайтов своих клиентов, а его собственный сайт на WordPress был довольно медленный. Чтобы не быть сапожником без сапог, он решил начать работу по ускорению ресурса. В итоге он сумел добиться максимальной скорости загрузки 100 в Google Page Speed Insights для десктопной версии сайта NickLeRoy.com. Мобильную версию удалось ускорить до 89.

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

Как получить оценку 100 в Google PageSpeed Insight

Операция «Ускорить WordPress»

Существует множество факторов, которые влияют на скорость загрузки сайта: число и размер объектов на страницах, время ответа сервера, ненужные редиректы и многое другое.

Прежде чем приступить к ускорению своего ресурса, Ник Лерой решил понять, с чем предстоит работать. Так как сайт построен на CMS WordPress, были проанализированы следующие области:

  • хостинг,
  • тема,
  • плагины,
  • изображения,
  • ресурсы.

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

Проблема: хостинг и TTFB

Первое, что бросалось в глаза при поверхностном анализе — большое время до получения первого байта после отправки запроса со стороны клиента (Time To First Byte или TTFB) для всех страниц сайта: от 1,5 до 2 секунд. И это было просто время, которое необходимо для первоначального соединения со страницей без ее загрузки.

Помимо этого были и другие проблемы, связанные с хостингом: отсутствие HTTP/2 setup/configured (проблему можно было бы исправить, используя CDN), отсутствие кеширования и т.п. Общий хостинг на Hostgator не способствовал достижению цели увеличения скорости загрузки сайта.

Решение: смена хостинг-провайдера

В качестве альтернативы существующему хостингу были выбраны два провайдера: FlyWheel и Kinsta. Оба провайдера:

  • предлагали услуги хостинга специально для WordPress-сайтов,
  • относительно доступны по цене ($25-30 в месяц),
  • предлагали решения для кеширования на сервере,
  • имели встроенную технологию CDN,
  • предлагали бесплатный SSL-сертификат (и протокол HTTP/2).

В итоге было решено остановиться на хостинге FlyWheel. Этот провайдер был немного дешевле и предоставлял локальные решения для разработки новых сайтов на WordPress.

После некоторых раздумий Ник Лерой решил создать новый сайт NickLeRoy.com. И вот, почему.

Проблема: оптимизация тем, плагинов, изображений, ресурсов

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

Тема WordPress

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

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

Плагины

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

Изображения

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

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

Ресурсы

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

На сайте NickLeRoy.com использовалось большое количество ресурсов, даже там, где они не были необходимы. Шрифты, javascript-файлы для ненужных функций, CSS для стилей и эффектов и многое другое, от чего можно было бы избавиться.

Решение: создание нового сайта

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

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

  • чистая установка WordPress на Local by Flywheel с чистой базой данных и кодом,
  • установка облегченной темы,
  • установка конструктора страниц Elementor, чтобы сайт выглядел так же, как изначально, но загружался быстрее,
  • перестройка всего сайта,
  • оптимизация изображений с помощью imageOptim. Для этого все картинки были загружены в папку wp-content/uploads, пропущены через сервис imageOptim, и выложены обратно на сайт. Суммарное сжатие составило около 90% по сравнению с исходным размером файлов,
  • установка Autoptimize и Async Javascript, что позволило объединить JS и CSS и уменьшить / удалить блокировку рендеринга.

После реализации описанных выше действий сайт был перемещен из локальной среды разработки в промежуточную. Затем специалисты настроили SSL и HTTP/2 и после тестирования обновили DNS.

Результаты

Скорость загрузки страниц в Google Page Speed оценивалась с помощью сервиса SanityCheck.io. На скриншоте видно, как после внесения всех изменений улучшились показатели для мобильной версии сайта (синяя линия) и для десктопной (черная линия).

После перезапуска сайта скорость загрузки страниц стала значительно меньше

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

  • отказаться от Google Fonts и полностью перейти на системные шрифты или загрузить Google Fonts на сервер,
  • удалить из верхней части страницы код CSS и Inline,
  • оптимизировать файлы JS / CSS,
  • установить стороннюю CDN (например, CloudFlare) или использовать сторонний сервис для оптимизации изображений, например, в формате WebP,
  • улучшить кеширование для ресурсов.

Заключение

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

Источник: NickLeRoy

Есть о чем рассказать? Тогда присылайте свои материалы Марине Ибушевой


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
  • Usy_dobra
    1
    комментарий
    0
    читателей
    Usy_dobra
    больше года назад
    Это все прекрасно, но, если чекнуть сайт этого типа, то там оказывается как бэ 50/82 prntscr.com/qumqnf, а на словах-то Лев Толстой..
    -
    5
    +
    Ответить
  • Георгий
    1
    комментарий
    0
    читателей
    Георгий
    больше года назад
    Все что рекомендуется в этой статье есть у w.tools. Ни разу не пожалел что подключился. Своя CDN сеть, кеш статики и динамики, минификация js\css и кешируемого html,  оптимизация всех типов картинок и еще куча всего полезного. Сайт летает и я не знаю проблем. Могу рекомендовать от души.
    -
    0
    +
    Ответить
  • Guest123
    1
    комментарий
    0
    читателей
    Guest123
    больше года назад
    Вот какой смысл писать бесполезную с точки зрения практики статью, что ссылку просто проставить на NickLeRoy, ну поставьте тогда и на меня заодно pyatilistnik.info
    -
    4
    +
    Ответить
  • 1qa
    1
    комментарий
    0
    читателей
    1qa
    больше года назад
    87
    Performance
    95
    Accessibility
    79
    Best Practices
    95
    SEO
    аудит точнее будет
    -
    0
    +
    Ответить
  • Vova Dren
    1
    комментарий
    0
    читателей
    Vova Dren
    больше года назад
    Такое ощущение, что статья написана ради ссылки в конце. Сеоньюс, сделайте уже раздел "реклама" ...
    -
    0
    +
    Ответить
    • Марина Ибушева
      64
      комментария
      0
      читателей
      Марина Ибушева
      Vova Dren
      больше года назад
      Здравствуйте! Все рекламные материалы на SEOnews помечаются. В данном случае мы решили перевести и опубликовать эту статью совершенно бесплатно, так как она показалась нам интересной и вызвала бурное обсуждение среди западных SEO-специалистов.
      Ссылки мы ставим в конце ко всем материалам, если у них есть первоисточник.
      -
      1
      +
      Ответить
  • Alex Beglov
    1
    комментарий
    0
    читателей
    Alex Beglov
    больше года назад
    Еще достаточно важный пункт по ускорению - оптимизация и сжатие картинок на сайте. Можно оптимизировать вручную каждую картинку (через Photoshop к примеру), можно автоматически (через специальные сервисы). Вот интересная статья на эту тему: pr-cy.ru/news/p/6831-kak-i-zachem-optimizirovat-izobrazheniya-na-sayte
    -
    0
    +
    Ответить
  • Влад
    1
    комментарий
    0
    читателей
    Влад
    больше года назад
    Статья ни о чём.
    1) Ускорение сайта и переделка с нуля - две разные вещи.
    2) Если его переделали с нуля, почему сразу было не перенести и не оптимизировать css и js.
    3) Где с равнение с другими 500 хостингами, которые предоставляют все эти стандартные функции и стоят дешевле. И зачем писать про CDN, если ей не пользовались.
    4) Есть множество статей, которые более подробно рассматривают проблемы оптимизации и на примере российских сайтов.
    -
    14
    +
    Ответить
  • Дарья Пынзарь
    4
    комментария
    0
    читателей
    Дарья Пынзарь
    больше года назад
    98 или 99 на мобильной и 100 на пк. www.rusguardsecurity.ru/
    Сайт на  вордпресс, некоторые страницы ещё не доделаны, но вы ещё покликайте на нем, думаю вам понравится
    -
    -10
    +
    Ответить
    • Дарья Пынзарь
      4
      комментария
      0
      читателей
      Дарья Пынзарь
      больше года назад
      Непонятно почему заминусили)) вы попробовали хоть переходить по страницам?
      -
      -8
      +
      Ответить
    • Михаил Букатый
      3
      комментария
      0
      читателей
      Михаил Букатый
      Дарья Пынзарь
      больше года назад
      Скорость высокая, как на турбо-страницах от Яндекс. Как вы добились?
      -
      0
      +
      Ответить
      • Дарья Пынзарь
        4
        комментария
        0
        читателей
        Дарья Пынзарь
        Михаил Букатый
        больше года назад
        Посмотрите в коды, может быть поймёте как работает.
        Интересно будет посмотреть как повлияет на сео, ведь поведенческие факторы должны быть очень высокие . Это Тестовый сайт и он ещё наполняется,  поэтому пока результаты получить не удастся, пока его не залью на постоянный сайт
        -
        0
        +
        Ответить
      • DeepOD
        7
        комментариев
        0
        читателей
        DeepOD
        Михаил Букатый
        больше года назад
        Сайт без дизайна, плагинов, шрифтов, анимации. Сайт где только картинки и текст. Естественно будет грузится очень быстро.
        -
        3
        +
        Ответить
        • Дарья Пынзарь
          4
          комментария
          0
          читателей
          Дарья Пынзарь
          DeepOD
          больше года назад
          Шрифты подгружаются Robots, анимация есть, видео тоже присутствуют, плагинов штук 15, просто над сайтом проведена очень серьёзная работа и много допиливалось вручную, а не бралось из коробки как есть.
          -
          -6
          +
          Ответить
  • Михаил Букатый
    3
    комментария
    0
    читателей
    Михаил Букатый
    больше года назад
    Вот бы оценивать скорость не в попугаях различных сервисов, а в фактической скорости загрузки страниц как было и стало. Google признает, что данные рекомендации и факторы ранжирования это разные вещи.
    -
    4
    +
    Ответить
ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
Как мы увеличили число посетителей сайта на 89 000 человек и индекс качества на 30 единиц за 4 месяца
Никита Ширяев
4
комментария
0
читателей
Полный профиль
Никита Ширяев - Здравствуйте, 1. ТЗ на создание контента, это всего лишь одна из задач, которую мы делаем на проекте. 2. Получаемый текст обязательно проходит проверки на спам. 3. ТЗ на создание контента, это ориентир для авторов. 4. Как раз таки ТЗ помогает не переспамить в тексте, так как мы замеряем показатели ТОПа и ориентируемся на него. И опять приведу Вам скриншот, который подтверждает постоянный рост рейтинга домена. DR имеет сильную прогрессию.
Алексей Романенков (Rookee): как обеспечить проекту видимость в интернете и какими инструментами ее наращивать
Rookee
3
комментария
0
читателей
Полный профиль
Rookee - Добрый день. Взяли на заметку, спасибо. Чтобы не пропустить материал на тему репутационной стратегии от Алексея, следите за Rookee в соцсетях :)
Михаил Сливинский (Яндекс): об алгоритмах качества в поиске, сгенерированных текстах и накрутке ПФ
Анна Макарова
389
комментариев
0
читателей
Полный профиль
Анна Макарова - Владимир, спасибо за комментарий! Если вдруг Михаил сюда не придет, то мнением и мыслями можно напрямую поделиться в ТГ амбассадора. В этой новости оставляли контакт: www.seonews.ru/events/vebmasterskaya-2024-v-yandekse-poyavilsya-ambassador-internet-ploshchadok-v-poiske/
Матвей Северянин дает экспертный отзыв: 788 000 ₽ за месяц на продаже Telegram-каналов – реально
Александр
1
комментарий
0
читателей
Полный профиль
Александр - Согласен с Матвеем. Сам покупаю- продаю Тг каналы на бирже : t.me/birga_prodagi_tg_kanalov - Биржа продажи ТГ каналов | Альянс-А
Зачем вам доверие поисковиков, как его укреплять и привлекать клиентов на сайт
Rookee
3
комментария
0
читателей
Полный профиль
Rookee - Рекомендуем задуматься как можно скорее, потому что даже только что созданный сайт чаще всего нуждается в оптимизации. Битые ссылки, лишние редиректы, низкая скорость загрузки - от всего этого нужно избавляться, чтобы сайт успешно продвигался в поиске и удерживал внимание пользователей. Тарифы на оптимизацию бывают разные, в Rookee базовая техническая оптимизация стоит 13 090, а в рамках Комплексного продвижения может обойтись дешевле или дороже в зависимости от потребностей сайта.
Как вырастить трафик из блога в 9,7 раз за год. Кейс
Сергей Шабуров
1
комментарий
0
читателей
Полный профиль
Сергей Шабуров - Константин, здравствуйте! Лид-формы у нас прямо в статьях, так что трафик идет с самих статей.
Яндекс Маркет представил собственный бренд велосипедов Raskat
Анна Макарова
389
комментариев
0
читателей
Полный профиль
Анна Макарова - Для городского велосипеда 14-16 кг - вполне ок, можно сказать легкий. Почему нет? )) Понятно, что есть варианты и легче, но они уже скорее всего будут спортивного плана, где каждый грамм имеем значение.
В какой поисковой системе продвигать финансовый сайт: выводы исследования Sape
Sape
3
комментария
0
читателей
Полный профиль
Sape - Добрый день! Спасибо за вашу обратную связь. Да, действительно, метрика DA не обновляется последние три месяца из-за проблем с поставщиком данных. Мы уже работаем над этим, в ближайшее время исправим. На данный момент для отбора сайтов в системе доступны десятки других метрик, которые обновляются регулярно. Касательно цен — с ними всё в порядке. Если у вас есть вопросы относительно ценообразования, мы готовы на них ответить. Благодарим, что поделились мнением. Мы всегда рады конструктивному диалогу!
Как продвигать сайты на Tilda и стоит ли это делать
Екатерина
1
комментарий
0
читателей
Полный профиль
Екатерина - "таких как канонические URL" - настройки страницы --> SEO --> Продвинутые - Вуаля, присваиваем странице каноникал. "микроразметка Schema.org" - что мешает добавить ее кодом в блок "html-код"
Google AdSense окончательно прекращает работу в России: аккаунты россиян будут деактивированы
Галина Николаева
1
комментарий
0
читателей
Полный профиль
Галина Николаева - а что, разве кто-то еще получал деньги с AdSense? у меня уже 2 года как не работает, деньги там остались, как их вывести, хз
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
389
Комментариев
373
Комментариев
262
Комментариев
249
Комментариев
171
Комментариев
156
Комментариев
141
Комментариев
121
Комментариев
120
Комментариев
100
Комментариев
97
Комментариев
97
Комментариев
96
Комментариев
80
Комментариев
77
Комментариев
74
Комментариев
67
Комментариев
64
Комментариев
60
Комментариев
59

Отправьте отзыв!
Отправьте отзыв!