Слушайте выпуск подкаста про обновленный Google PageSpeed Insights! 🎧


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

Google Webmaster Central Blog говорит

9 июля 2018 в блоге Гугл написали: The Speed Update is now rolling out for all users. Что значило, что алгоритм вышел и на мобильные версии сайтов.
Что говорится в сообщении от Гугл:

Начиная с июля 2018 года, скорость загрузки сайта, будет входить в список факторов ранжирования. Но это будет касаться только самых медленных сайтов и небольшого количества запросов. Алгоритм назвали "Speed Update".

12 ноября 2018 года, Гугл полностью обновил пейджспид. Теперь он замеряет скорость загрузки и даёт совсем другие оценки сайтам. Многие увидели свои сайты в красной зоне с оценками до 50 баллов.

А 15 августа 2019 года W3C Community выпустили спецификацию про Largest Contentful Paint. Считается, что устаревшая метрика DOMContentLoaded. Более новые метрики First Paint (FP) и First Contentful Paint (FCP) не совсем корректные, так как это про то, что пользователь увидел в самом начале загрузки сайта. И если пользователь видит индикатор загрузки или всплывающее окно, то это еще не загруженный сайт.

W3C Web Performance Working Group и исследования от Google привели к тому, что лучше всего замерять тот момент, когда произошел рендеринг самого главного контента страницы.

The Largest Contentful Paint (LCP) API, доступен с версии Chrome 77 в отчетах.

Что такое Google PageSpeed Insights

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

Почему Гугл ПэйджСпид считают важным инструментом измерения скорости сайта

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

Оценка происходит по стобалльной шкале. Те, кто говорит, что 100 баллов — недостижимая планка, не умеют. Не верьте.

Screenshot-at-Aug-16-07-02-23

Стоит ли равняться на этот сервис

Только на него равняться вредно. Нельзя. Это как сходить к нескольким врачам до серьезной операции. Три инструмента проверки смогут дать картину в 3D. Какие три мы советуем и почему:

  1. Loading.express - этот инструмент даст экспресс оценку по всем важным параметрам скорости загрузки сайта. Просто проверяйте и держите вкладку открытой.
  2. GTmetrix - этот сервис поможет понять какой именно скрипт, картинка или стиль даёт нагрузку. И еще он делает замер без ограничений по скорости интернета и процессора.
  3. Пейдж Спид от Гугл.

Кстати, на loading можете сделать замер прямо из этой строки проверки:

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

Screenshot-at-Aug-16-07-51-18

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

Обновление алгоритмов Google PageSpeed Insights

В июле Гугл запустил новый алгоритм — Speed Update, благодаря чему скорость загрузки стала фактором ранжирования поисковика. Ноябрьские обновления PSI (PageSpeed Insights) кардинально изменили сервис. Теперь он работает на базе аналитики Lighthouse , встроенного в браузер Google Chrome. Это инструмент с открытым исходным кодом, созданный для улучшения и контроля качества веб-страниц.

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

В PageSpeed Insights добавлена функция раскадровки, состоящая из десяти слайдов, на которых вы можете увидеть очередность появления контента страницы. Кроме того, теперь сервис дает советы по использованию на ресурсе новых форматов картинок, — JPEG 2000, WebP и JPEG XR — которые весят меньше своих предшественников.

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

Что делать, если показатели Google PageSpeed Insights низкие

Why-your-slow-website-is-losing-business

Для начала важно знать, что нужно делать 5-6 замеров подряд и ориентироваться на средний показатель, потому что сайты не статичны и их скорость тоже.

Фокусируйтесь вот на чём:

  • мобильная версия — к ней Гугл предъявляет более серьезные требования и ставит ее в приоритет. А с 2019 года мобильный трафик превысил десктопный в России.

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

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

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

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

Как получить 100/100 в Google PageSpeed Insights

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

Для того, чтобы скорость загрузки была максимальная, нужно отлично знать CSS, JS и серверную часть. Такие специалисты всегда стоят от 1500 до 5000 рублей за час работы. На средний сайт нужно потратить 10 часов. То есть 20.000 рублей это та цена, от которой начинаются настоящие специалисты.

Если вам предлагают сделать 100/100 за 3000 рублей, то возможно вам сделают костыль, который и правда покажет 100 из 100, потому что Гуглу можно отдать другую версию сайта или просто оптимизированную картинку. Вы ничего и не заметите. Но Гугл видит всё.

Польза сервиса

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

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

22 актуальных инструмента для проверки скорости загрузки страниц сайта в 2019 году

Slow-site-spefgfgted

Мы нашли, протестировали и отобрали для вас эти сервисы. Сверху самые используемые нами, ниже все остальные. Интересные все, наслаждайтесь:

Можно выполнить ту же задачу с помощью полезных инструментов для Chrome — Google Chrome DevTools . А можно и вовсе обойтись без расширений: нажмите Ctrl+Shift+i при открытой вкладке с вашим сайтом в Chrome и в консоли браузера выберите пункт Audits. Затем нажмите Run audits и подождите, пока Lighthouse проанализирует сайт и покажет результаты. Результаты будут именно с вашего устройства и локации. У соседа будут другие показатели.

Какие параметры на самом деле важны при измерении скорости сайта в 2019 году

google-speed-test

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

Largest Contentful Paint (LCP)

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

Время ответа сервера

Это ваш хостинг. Замерить время ответа сервера можно здесь - ping.loading.express .

Время загрузки первого контента

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

Индекс скорости загрузки

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

Время загрузки для взаимодействия

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

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

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

Время окончания работы ЦП

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

Приблизительное время задержки при вводе

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

Чего ждать от обновленного Google PageSpeed Insights в этом году

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

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

Заходите на loading.express и ускоряйте ваши сайты!

Слушайте наш подкаст про обновленный Google PageSpeed! 🎧

Расскажи о статье друзьям!