Сайты, которые долго загружаются, не ценятся пользователями и даже самим Google. С 2018 года скорость загрузки сайта является важным фактором ранжирования для Google. Медленные страницы, будь то на настольных или мобильных компьютерах, наказываются алгоритмом. Страницы, загрузка которых занимает более двух секунд, полностью игнорируются краулерами! Более того, 32% пользователей покидают сайт, если его загрузка занимает более трех секунд.
В связи с этим Google добавил в свой рабочий стол инструмент Google PageSpeed Insights, который помогает анализировать время загрузки сайта и, при необходимости, оптимизировать его.
- Что измеряет Google PageSpeed Insights?
- Показатель производительности
- Полевые данные и резюме происхождения
- Лабораторные данные (лабораторные данные)
- Рекомендации и возможности
- Диагностика
- Что такое «быстро» для Google PageSpeed Insights?
- PageSpeed Insights и индексация с учетом потребностей мобильных устройств
- Google PageSpeed Insights: Три высоко оптимизируемых фактора
- Оптимизация изображений
- Хороший кэш
- Выведение сервера на передний план
Что измеряет Google PageSpeed Insights?
PageSpeed Insights — это инструмент Google SEO, основной функцией которого является измерение и анализ времени загрузки URL-адреса. Для этого просто введите веб-адрес в поле и запустите его. Результат, то есть «понимание скорости страницы», разбивается и отображается как для мобильной, так и для настольной версии. Вы можете легко переключаться с одного вида на другой. С помощью инструмента можно проанализировать любой действующий URL-адрес.
Также учитываются реальные впечатления пользователей, взятые из отчета Chrome User Experience Report (или сокращенно CrUX). Google получает эти данные от пользователей, которые используют собственный браузер Google Chrome и добровольно делятся своей пользовательской статистикой.
Данные из Google Lighthouse также включены в анализ. Этот инструмент оценивает доступ к выбранному веб-сайту, его производительность и удобство пользования.
Результат анализа Google PageSpeed Insights отображается в виде оценки производительности по шкале от 0 до 100. Это позволяет дать общую оценку и быстро получить общее представление о производительности веб-сайта. Однако результаты PageSpeed Insights содержат гораздо больше, чем просто этот балл — они разбиты на ряд различных показателей.
Показатель производительности
В верхней части списка находится оценка производительности по шкале от 0 до 100 и разделена на три категории:
- 90 — 100 (зеленый): быстро
- 50 — 89 (оранжевый): средний
- 0 — 49 (красный): медленно
Полевые данные и резюме происхождения
Ниже приведены данные о полях, взятые из CrUX (данные за последние 28 дней), если они доступны для данного URL. Если они недоступны, вы получите сообщение: «В Chrome User Experience Report нет достаточных данных о реальной скорости для этой страницы».
PageSpeed Insights по-прежнему работает без отчета Chrome User Experience Report!
Если для данного сайта имеются данные о полевых условиях, оценка производится на основе следующих баллов:
- First Contentful Paint (FCP), который определяет, сколько времени требуется для полного рендеринга первого изображения или текста на сайте.
- Первая задержка ввода (FID), которая измеряет время, по истечении которого пользователь может впервые взаимодействовать с веб-сайтом.
- Largest Contentful Paint (LCP), который измеряет, когда основное содержимое веб-сайта отображается на экране.
- Кумулятивный сдвиг макета (Cumulative Layout Shift, CLS), который представляет собой неожиданный сдвиг элементов на странице, пока сайт еще загружается.
Эти показатели еще раз классифицируются по скорости:
Быстро (зеленый):
- FCP: от 0 до 1 секунды.
- FID: от 0 до 0,1 секунды.
- LCP: от 0 до 2,5 секунд.
- CLS: кумулятивный сдвиг раскладки: от 0 до 10%.
Средний (оранжевый):
- FCP: от 1 до 3 секунд.
- FID: от 0,1 до 0,3 секунды.
- LCP: от 2,5 до 4 секунд.
- CLS: сдвиг составляет от 10 до 25%.
Медленно (красный):
- FCP: более 3 секунд.
- FID: более 0,3 секунды.
- LCP: более 4 секунд.
- CLS: сдвиг составляет более 25%.
Четыре типа данных, т.е. FCP, FID, LCP и CLS, также могут быть показаны как «сводка происхождения». Это означает, что они показываются для всего домена. Если их недостаточно или если нет данных по полю для конкретного URL, будут показаны только сводные данные о происхождении.
Лабораторные данные (лабораторные данные)
Google PageSpeed Insights получает лабораторные данные от Lighthouse, который является инструментом с открытым исходным кодом. Этот инструмент определяет, насколько хороша производительность сайта, путем переползания URL-адреса.
Здесь мы снова находим категории «быстро», «средне» и «медленно», а также коэффициенты FCP, LCP и CLS. Однако эти значения имеют разные диапазоны в лабораторных данных. Здесь также представлены еще два значения: Time to Interactive (TTI), которое представляет собой общее время, необходимое для того, чтобы страница стала интерактивной, после Total Blocking Time (TBT) — общего времени, в течение которого она была неотзывчивой.
Шестая метрика, приведенная в лабораторных данных, — это индекс скорости. Индекс скорости измеряет, насколько быстро визуально отображается содержимое при загрузке сайта. Сначала Lighthouse снимает видеозапись страницы в момент ее загрузки в браузере, а затем оценивает видимое продвижение между кадрами.
Эталоны оценки, используемые для лабораторных данных, следующие:
Быстро (зеленый):
- FCP: от 0 до 2 секунд.
- LCP: между 0 и 2 секундами.
- CLS: сдвиг составляет от 0 до 10%.
- TTI: между 0 и 3,8 секунды.
- TBT: между 0 и 0,3 секунды.
- Индекс скорости: между 0 и 4,3 секунды.
Средний (оранжевый):
- FCP: между 2 и 4 секундами.
- LCP: между 2 и 4 секундами.
- CLS: сдвиг составляет от 10 до 25%.
- TTI: между 3,9 и 7,3 секундами.
- TBT: между 0,3 и 0,6 секунды.
- Индекс скорости: между 4,4 и 5,8 секундами.
Медленный (красный):
- FCP: более 4 секунд.
- LCP: более 4 секунд.
- CLS: сдвиг составляет более 25%.
- TTI: более 7,3 секунды.
- TBT: более 0,6 секунды.
- Индекс скорости: более 5,8 секунды.
Одной из практических особенностей Lighthouse является отображение скриншотов с данными о времени, особенно при анализе кумулятивного сдвига макета (CLS), чтобы показать, как загружается страница.
Рекомендации и возможности
В предпоследнем пункте Google PageSpeed Insights дает рекомендации, или «возможности», относительно того, как можно оптимизировать ваш сайт. Конечно, акцент здесь делается на том, как сократить время загрузки.
Диагностика
Этот раздел обычно не влияет на показатели PageSpeed Insights, но дает дополнительную информацию о возможных проблемах или лучших решениях для оптимизации вашего сайта.
Что такое «быстро» для Google PageSpeed Insights?
Время загрузки сайта уже много лет является важным фактором в оптимизации поисковых систем. SEO-специалисты постоянно ссылаются на важность времени загрузки при ранжировании. Однако производительность сайта отражается не только в коротком времени загрузки, но и в малом времени отклика, размере страницы и скорости загрузки. Google учитывает все это при оценке страницы.
PageSpeed Insights показывает лишь некоторые из множества факторов, которые Google использует для оценки веб-сайтов и ранжирования результатов поиска. Чтобы получить полное представление о потенциале URL-адреса в поисковых системах, IONOS предлагает бесплатную программу проверки SEO, которая так же проста в использовании, как и Google PageSpeed Insights.
Скорость веб-сайта — понятие относительное. В целом, однако, время загрузки от 1,5 до 3 секунд в настоящее время считается средним — все, что выше этого показателя, является медленным, а все, что меньше этого показателя, является быстрым и заслуживает рекомендации. Эти показатели меняются с течением времени по мере технического прогресса — в 2016 году среднее время загрузки страницы составляло более 3 секунд.
PageSpeed Insights и индексация с учетом потребностей мобильных устройств
При всем этом перечисленных скоростей самих по себе недостаточно, чтобы Google PageSpeed Insights оценил страницу как быструю. Это зависит не от каждой миллисекунды, а от всего опыта работы пользователя с выбранным сайтом. Это особенно верно для мобильных версий, для которых Google рассчитывает их рейтинг и производительность отдельно.
Десктопная версия сайта может быть оценена как быстрая, но это не обязательно означает, что мобильная версия будет такой же. Поскольку все большее число пользователей чаще просматривают сайты со своих смартфонов, роль мобильных сайтов нельзя игнорировать. Следующие меры особенно полезны для того, чтобы ваш сайт хорошо работал и в мобильной версии:
- Удалите неиспользуемый JavaScript, чтобы уменьшить объем данных, передаваемых через мобильные сети.
- Используйте изображения в современных форматах. Такие форматы изображений, как JPEG 2000, JPEG XR и WebP, часто сжимаются лучше, чем PNG или JPEG, что приводит к более быстрой загрузке и меньшему использованию данных.
- Используйте изображения подходящих размеров, чтобы сэкономить мобильные данные и улучшить время загрузки.
- Удалите ресурсы, блокирующие рендеринг. Важные JavaScript и CSS должны быть написаны в строку, а все несущественные скрипты и стили — с отступом.
- Удалите неиспользуемый код CSS, чтобы избежать ненужного использования мобильных данных.
- Эффективно кодируйте изображения. Оптимизированные изображения загружаются быстрее и потребляют меньше мобильных данных.
- Убедитесь, что текст остается видимым во время загрузки веб-шрифта, используя функцию font-display CSS. Это означает, что текст может быть прочитан пользователями во время загрузки веб-шрифтов.
- Минимизируйте влияние стороннего кода. Сторонний код может значительно повлиять на время загрузки.
- Подготовьте статический контент с помощью эффективной функции кэширования. Длительное время хранения кэша может ускорить загрузку веб-сайтов для повторных посетителей.
- Удалите изображения, которые не видны.
- Сжимайте JavaScript.
- Активируйте сжатие текста.
- Создавайте предварительные подключения к необходимым источникам.
- Избегайте ненужных расширений на странице.
Мобильные результаты Google PageSpeed Insights должны быть так же важны для ранжирования, как и результаты для настольного сайта. Однако, как именно это влияет на аргументацию, Google пока не раскрывает. Тем не менее, поскольку скорость страницы существенно влияет на удобство пользования, мы предполагаем, что этот фактор также имеет большое значение для ранжирования. Тем не менее, поскольку релевантность и качество контента также влияют на ранжирование, вы можете получить высокие позиции даже при средней скорости страницы. В идеале ваша страница должна быть хорошо построена как с точки зрения содержания, так и с точки зрения технической структуры.
Google PageSpeed Insights: Три высоко оптимизируемых фактора
Google PageSpeed Insights — это то, что написано на упаковке: представление о производительности, текущих проблемах и возможных решениях для конкретного URL или всего домена. Три фактора, которые всегда играют решающую роль в этом аспекте, будут описаны в следующих разделах.
Оптимизация изображений
Изображения часто являются самой ресурсоемкой частью веб-сайта. Они обычно слишком большие, имеют неправильный формат и плохо названы. Google наказывает за это, как и любой посетитель сайта, который нетерпеливо закрывает его, если изображения все еще не полностью загрузились через несколько секунд.
Большинство изображений загружается в формате JPEG или PNG. Однако для веб-сайта гораздо больше подходят форматы JPEG 2000, JPEG XR и WebP, поскольку они легче сжимаются без видимого ухудшения качества. Например, изображение размером 440,7 килобайт (КБ) в формате .jpg имеет размер всего 135,1 КБ в формате JPEG 2000. Когда это суммируется, особенно на сайте с большим количеством изображений, разница становится ощутимой.
В современном мире HD-изображений невероятно важно сжимать каждое изображение перед загрузкой на сайт. Изображениям с размером файла в несколько мегабайт не место на сайте. Программы редактирования изображений, такие как Photoshop, предлагают такие функции, как «Сохранить для Web», где изображение сохраняется в более легком формате, оптимизированном для отображения в Интернете.
Для SEO-рейтинга вашего сайта также полезно давать всем изображениям имя файла, соответствующее теме вашего сайта. Таким образом, вы сможете набрать очки в SEO для изображений.
Хороший кэш
Иногда самые незначительные вещи имеют огромное значение. Кэширование браузера облегчает передачу данных от сервера к пользователю, что приводит к ускорению работы страниц. Чтобы избежать перезагрузки всех файлов с сайта при каждом новом посещении, браузер может обращаться к файлам, которые были сохранены за прошедшее время.
Однако, чтобы полностью оптимизировать кэш, браузер должен знать, как долго он должен сохранять файлы. Поэтому файлы с веб-сайта должны иметь срок действия. Например, динамический HTML-код, который постоянно меняется, обычно должен сохраняться чаще, чем изображения.
Лучший способ настроить кэширование в браузере — использовать модуль «mod_expires», если ваш сайт размещен на сервере Apache. Проверить, активен ли модуль, можно с помощью команды «IfModule». Используя команду «ExpiresByType», вы можете получить информацию об отдельных типах данных. Затем можно определить срок действия, набрав «Access plus 7 days», что устанавливает минимальную продолжительность сохранения в браузере на семь дней. Данные будут загружены снова только по истечении этого времени. Вы можете индивидуально настроить этот период и даже варьировать его для разных типов данных. Однако рекомендуемый срок — одна неделя.
Вы можете активировать кэш и сделать другие вещи, используя следующий код в файле .htaccess:
<ifmodule mod_expires.c></ifmodule>
ExpiresActive On
ExpiresByType image/gif "access plus 7 days"
ExpiresByType image/ico "access plus 7 days"
ExpiresByType image/jpeg "access plus 7 days"
ExpiresByType image/jpg "access plus 7 days"
ExpiresByType image/png "access plus 7 days"
ExpiresByType text/css "access plus 7 days"
ExpiresByType text/javascript "access plus 7 days"
ExpiresByType application/x-javascript "access plus 7 days"
ExpiresByType application/javascript "access plus 7 days"
Среднее время загрузки сайта (при условии, что посетитель заходит на него несколько раз) может быть значительно улучшено с помощью этой настройки. Для более тонкой настройки всегда полезно заглянуть в Google PageSpeed Insights, чтобы определить оптимальное время загрузки для всех типов данных.
Выведение сервера на передний план
Здесь есть на что обратить внимание и что улучшить. Большинство веб-сайтов находятся на платформах виртуального хостинга с ограниченными ресурсами. Это может замедлить доступ и время загрузки каждого отдельного сайта. Эту проблему можно решить, приобретя больше производительности (CPU, RAM и т.д.) или перенеся сайт на выделенный сервер. Однако в этом случае необходимо создать соответствующую аппаратную настройку для веб-сайта. Подходящий хостинг-сервер может значительно повысить производительность веб-сайта. Чтобы узнать больше и получить прямое сравнение, вы можете прочитать нашу статью «Shared Hosting vs. Dedicated Hosting».