Google PageSpeed Insights скорость загрузки сайта

Гугл пейдж спид инсайт в разговоре просто «пейджспид», Google PageSpeed Insights это инструмент, который проверяет скорость загрузки сайта и дает рекомендации, как сделать сайт быстрее.

Взаимодействие с Next Paint (INP) больше не является экспериментальной метрикой и находится в Core Web Vital.

Google PageSpeed Insights

Примечание

В частности, для API ответ теперь имеет метрику INTERACTION_TO_NEXT_PAINT, которая содержит те же данные, что и EXPERIMENTAL_INTERACTION_TO_NEXT_PAINTEXPERIMENTAL_INTERACTION_TO_NEXT_PAINT будет удален через 90 дней (8 августа 2023 г.).

Interaction to Next Paint (INP) — это ожидающая метрика Core Web Vital, которая заменит First Input Delay (FID) в марте 2024 года. INP оценивает скорость отклика, используя данные из Event Timing API. Когда взаимодействие приводит к тому, что страница перестает отвечать на запросы, это плохой пользовательский опыт. INP отслеживает задержку всех взаимодействий пользователя со страницей и сообщает об одном значении, ниже которого были все (или почти все) взаимодействия. Низкий INP означает, что страница постоянно могла быстро реагировать на все или подавляющее большинство пользовательских взаимодействий. https://web.dev/inp/

Google PageSpeed Insights

Анонс новой функции в пользовательском интерфейсе: общие ссылки! Теперь анализ URL приведет вас к новому /analysis с уникальным идентификатором в ссылке.

Google PageSpeed Insights скорость загрузки сайта 1

Эта страница содержит общий снимок отчета с отметкой времени вверху, обозначающей время анализа. При нажатии кнопки «Копировать ссылку» ссылка копируется в буфер обмена, которым можно поделиться в течение 30 дней после создания. Обратите внимание, что предыдущий /report будет перенаправлен на /analysis.

#GoogleSEO

О PageSpeed Insights (PSI)

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

PSI предоставляет как лабораторные, так и полевые данные о странице. Лабораторные данные полезны для устранения неполадок, поскольку они собираются в контролируемой среде. Однако он может не охватывать узкие места в реальном мире. Полевые данные полезны для получения истинного, реального взаимодействия с пользователем, но имеют ограниченный набор показателей. См. Как думать об инструментах скорости для получения дополнительной информации о двух типах данных.

Данные реального пользовательского опыта

Данные о реальном взаимодействии с пользователем в PSI основаны на наборе данных Chrome User Experience Report (CrUX). PSI сообщает о первом отрисовке контента (FCP), первой задержке ввода (FID), самом большом отрисовке контента (LCP), совокупном смещении макета (CLS) и взаимодействии до следующей отрисовки (INP) за предыдущий 28-дневный период сбора данных. PSI также сообщает об экспериментальном показателе времени до первого байта (TTFB).

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

Оценка качества опыта

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

МетрикиХорошееТребуется улучшениеПлохое
FCP[0, 1800 мс](1800 мс, 3000 мс]более 3000 мс
FID[0, 100 мс](100 мс, 300 мс]более 300 мс
LCP[0, 2500 мс](2500 мс, 4000 мс]более 4000 мс
CLS[0, 0.1](0.1, 0.25]более 0.25
INP[0, 200 мс](200 мс, 500 мс]более 500 мс
TTFB (experimental)[0, 800 мс](800 мс, 1800 мс]более 1800 мс

Распределение и выбранные значения показателей

PSI представляет распределение этих показателей, чтобы разработчики могли понять диапазон возможностей для этой страницы или источника. Это распределение разделено на три категории: «Хорошо», «Требует улучшения» и «Плохо», которые представлены зелеными, желтыми и красными полосами. Например, 11 % в пределах желтой полосы LCP означает, что 11 % всех наблюдаемых значений LCP находятся между 2500 мс и 4000 мс.

Google PageSpeed Insights скорость загрузки сайта 3

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

Основные веб-жизненные показатели

Core Web Vitals — это общий набор сигналов производительности, критически важных для всех веб-приложений. Метрики Core Web Vitals — это FID, LCP и CLS, и они могут быть агрегированы либо на уровне страницы, либо на уровне источника. Для агрегаций с достаточным количеством данных по всем трем метрикам агрегация проходит оценку Core Web Vitals, если 75-й процентиль всех трех метрик является хорошим. В противном случае агрегат не проходит оценку. Если у агрегации недостаточно данных для FID, то она пройдет оценку, если оба 75-го процентиля LCP и CLS будут хорошими. Если в LCP или CLS недостаточно данных, невозможно оценить агрегацию на уровне страницы или источника.

Различия между полевыми данными в PSI и CrUX

Разница между полевыми данными в PSI и набором данных CrUX в BigQuery заключается в том, что данные PSI обновляются ежедневно, тогда как набор данных BigQuery обновляется ежемесячно и ограничивается данными на уровне источника. Оба источника данных представляют конечные 28-дневные периоды.

Справка Google: Как повысить скорость загрузки сайта

Источник developers.google.com

https://developers.google.com/speed/docs/insights/v5/about

#SeobilitySEO

Скорость загрузки сайта

Определение

Термин скорость загрузки сайта относится к скорости загрузки страницы в Интернете и состоит из трех разных промежутков времени. Прежде всего, он содержит время ответа сервера (= время ожидания до первого байта или время до первого байта (TTFB)), а также время загрузки HTML-страницы (= время передачи). Кроме того, продолжительность рендеринга страницы в браузере также учитывается в общем времени загрузки. Таким образом, термин скорость страницы охватывает полный промежуток времени от отправки HTTP-запроса на сервер до полного отображения веб-сайта в браузере.

Важность скорости для UX и SEO

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

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

Как улучшить скорость загрузки сайта

Google PageSpeed Insights скорость загрузки сайта 5

Таким образом, скорость загрузки сайта является важной отправной точкой для улучшения взаимодействия с пользователем (UX) и поисковой оптимизации (SEO) для Google. В следующем разделе можно узнать, как улучшить скорость загрузки сайта.

Общее время: 5 минут

Сжатие файлов HTML, CSS и JavaScript

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

Кроме того, размеры файлов могут быть сжаты для передачи на стороне сервера с помощью gzip. Это стандарт для веб-серверов Apache и Nginx.

Минимизация HTTP-запросов

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

Вы можете минимизировать количество HTTP-запросов, объединив несколько файлов одного типа в один файл (например, объединив несколько файлов CSS в один файл).

Использование поддоменов

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

Сокращение редиректов

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

Кэширование сервера

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

Кэширование браузера

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

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

Сети доставки контента (CDN)

Сеть доставки контента (CDN) — это сеть серверов, используемых для распространения контента сайта. Копии сайта хранятся на территориально распределенных серверах. 
Если пользователь хочет получить доступ к сайту, он доставляется ближайшим к пользователю сервером. Таким образом, сети CDN снижают нагрузку на сервер, поскольку необходимо обрабатывать меньше HTTP-запросов.

Загрузка через AJAX

AJAX — это метод, который позволяет загружать содержимое сайта без отправки нового HTTP-запроса на сервер. С помощью этого метода весь контент веб-сайта не должен загружаться сразу, а только тогда, когда пользователи прокручивают страницу вниз. Это особенно рекомендуется для отображения веб-сайта на мобильных устройствах, где скорость передачи данных обычно ниже. Даже сайт, который загружается за считанные секунды на настольном компьютере, может вызвать проблемы на смартфонах.

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

Асинхронная загрузка

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

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

Оптимизация времени отклика сервера

Чем быстрее сервер отвечает на входящий запрос, т.е. чем короче время до первого байта (TTFB), тем быстрее может загружаться сайт. Время отклика сервера зависит от трафика, ресурсов, необходимых для страницы, серверного программного обеспечения и хостинг-провайдера. Оно не должно превышать 200 мс. В противном случае Google Bot больше не будет регулярно сканировать URL-адрес, что может отрицательно сказаться на индексации. Вы можете оптимизировать время отклика, выявляя и устраняя уязвимости сервера, такие как медленные запросы к базе данных.

Оптимизация изображений

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

Например, рекомендуется не загружать графику, такую ​​как кнопки, значки или фон, в виде файлов изображений, а создавать их с помощью CSS. Это не только требует меньше кода и HTTP-запросов, но и гарантирует четкое отображение этой графики на всех размерах экрана.

Еще один важный аспект касается размера файлов изображений. Его следует свести к минимуму, чтобы сократить время загрузки изображений. Кроме того, вы можете использовать элемент HTML5 <picture>, чтобы предоставить разные версии изображения для разных размеров экрана. Это предотвращает загрузку изображений с очень большим размером файла на мобильные устройства, что излишне увеличивает время загрузки сайта.

Кроме того, изображения можно сжимать с помощью многочисленных онлайн-сервисов, таких как kraken.io. Инструмент позволяет уменьшить размер файла без потери качества.

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

Поставка:

Инструменты:

Материалы: Page Speed

Проверить скорость загрузки сайта с Google PageSpeed ​​Insights

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

pagespeed mobile 1200 px

Предлагаемые ссылки

Google I/O 2023 топ-100 новинок

Домены Google Domains регистратор доменов

Google Search Console добавить сайт в Гугл Серч Консоль

WordPress SEO plugin Rank Math

WordPress UA сайт на ВордПресс