Блог

Как добиться ускорения загрузки страниц сайта при помощи инструмента Google PageSpeed Insights?

Александр Шут / 18.05.2017723

Скорость загрузки страниц — невероятно важный фактор, влияющий не только на отношение потенциальных клиентов к вашему ресурсу, но и на позиции сайта в Google!

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

Не можешь сделать так, чтобы сайт работал быстро — «Ты кто такой, давай, до свидания!». 

Google PageSpeed Insights — что это? 

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

Что сервис может:

  • Проанализировать страницу сайта по ее адресу;
  • Рассказать, что именно тормозит ее загрузку;
  • Посоветовать, что с этим делать.

Что сервис не может, так это сделать оптимизацию за вас.

Если вы все еще сомневаетесь, на кой вам сдался Google PageSpeed Insights, читайте дальше, будем обращать вас в свою веру.

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

В начале 2017 года представители компании Google официально заявили: "Чем быстрее будет грузиться ресурс, тем больше шансов у него занять хорошие позиции в поисковой выдаче."

От чего зависит скорость загрузки страниц веб сайта?

Скорость загрузки страниц — это целый перечень показателей, которые нельзя вылечить одной таблеткой.

Причин может быть несколько:

  • Скорость подключения пользователя к сети

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

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

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

  • Хостинг, где живет сайт

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

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

  • Размер страницы

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

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

Google PageSpeed Insights: как работает лечебная пилюля

Чтобы воспользоваться инструментом Google PageSpeed Insights, перейдите по адресу: https://developers.google.com/speed/pagespeed/insights

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

Сервис предлагает нам две категории оценки ресурса: для мобильной версии и для ПК, поэтому оценки и советы для вашего сайта также будут поделены на две категории.

Шкала оценки: от 0 до 100. Соответственно, чем выше цифры, тем лучше грузится ваша страница.

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

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

  • Красный – хода нет! 

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

Смотрите, как это выглядит в жизни.

На версии для ПК:

На мобильной версии:

  • Оранжевый – скоро можно ехать!

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

  • Зеленый – погнали!

Вас можно только поздравить: все оформлено правильно.

Обратите внимание: Один из проектов нашей веб-студии — разработка сайта для стоматологической клиники Дентал Студио.

Одной из задач этого проекта была оптимизация скорости веб сайта под требования Google PageSpeed Insights.

Делимся с вами результатами.

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

На версии для ПК:

На мобильной версии:

Как видите, показатели отличные!

Google PageSpeed Insights: как улучшить скорость загрузки веб страниц?

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

Не забудьте проверить сайт при помощи http://validator.w3.org и устранить все ошибки.

Кроме этого, у сайта могут быть другие пробелы:

  • Сервер тормозит или медленно отвечает 

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

  • Большие картинки

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

  • «Тяжелый» javascript

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

 Услуги по ускорению скорости загрузки страниц сайта от Zwebra

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

При размещении заказа на разработку корпоративного сайта в Zwebra услугу по оптимизации скорости загрузки сайта вам предложат в качестве дополнительной опции.

Да, добиться «зеленой» зоны достаточно нелегко, поэтому оптимизация Google PageSpeed требует примерно неделю дополнительной работы нашего верстальщика и программиста.

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

В нашем портфеле более 25 примеров работ по ускорению сайтов на WordPress, ModX, OpenCart, Magento и кастомных CMS. Давайте рассмотрим одну из них поподробнее.

Как исправить плохую статистику WordPress в сервисе Google PageSpeed

Если у вас стоит задача оптимизировать скорость загрузки сайта под управлением Wordpress, то первое, что нужно сделать — это провести тестирование скорости страницы. Для этого используется онлайн-инструмент, позволяющий проверить текущую оценку для десктопной версии и для мобильных устройств, что в свою очередь дает возможность получить перечень рекомендаций от Google PageSpeed.

Так какая же оценка Google PageSpeed является хорошей?

Эта оценка формируется на основе таких факторов:

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

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

Речь идет о плагинах Wordpress. Первый из них — Google Pagespeed Insights, одноименный плагин для удобного анализа и создания отчетов по существующим проблемам, влияющим на скорость загрузки веб-сайта.

Далее мы можем использовать плагины для сжатия всех изображений и их «ленивой» подгрузке. Это особенно важно для мобильной версии веб-ресурса.

Последующие важные шаги для увеличения скорости загрузки страниц на Wordpress:

  1. кеширование страниц;
  2. оптимизация базы данных;
  3. отключение ненужных функций и плагинов;
  4. интеграция с сервисом CDN.

Услуга оптимизации скорости загрузки веб-сайта на Wordpress — пожалуй, одна из самых распространенных наших услуг и это неудивительно, ведь сегодня оценка Google Pagespeed Insights является одним из факторов SEO и высокого ранжирования в Google.

Если «вылечить» все болезни сайта, можно добиться очень хорошей оценки.

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

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

Подпишитесь на рассылку

Наш Twitter

У вас есть проект?

Давайте обсудим его!

Свяжитесь с нами, или оставьте заявку онлайн

+38 (098) 455 35 55

Заказать звонокОтправить запрос

Остались вопросы?
Мы ответим

Оставьте заявку

и мы свяжемся с Вами в ближайшее время

Бриф

Заполните бриф по интересующему направлению и мы свяжемся с вами в ближайшее время

Оставьте свой номер

и мы свяжемся с Вами в ближайшее время