4 главных совета по улучшению аудита основных веб-показателей

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

• Работа со страницей и Google Search Console
• Недостатки PageSpeed ​​Insights
• Рекомендуемые сторонние инструменты аудита
• Понимание каскадных диаграмм

1. Запустите рабочий процесс аудита Core Web Vitals с помощью Search Console.

При проверке веб-сайта на предмет проблем со скоростью сайта и Core Web Vitals мы рекомендуем всегда начинать процесс устранения неполадок с просмотра раздела «Опыт работы» в Search Console — при наличии доступа. Консоль поиска собирает данные о реальных пользователях (полях) из отчета Chrome UX, поэтому это простой способ понять, какие проблемы LCP, CLS или FID влияют на ваш пользовательский опыт и, в конечном итоге, на потенциал ранжирования сайта.

Перейдите к разделу «Впечатления от страницы» > «Основные веб-жизненные показатели», и на отображаемом графике будет показано количество URL-адресов, которые классифицируются как «Хорошие», «Требуется улучшение» или «Плохо» для свойства веб-сайта. Например:

См. приведенную ниже диаграмму по времени и показателям от Google для вышеуказанных пороговых значений Core Web Vitals.

Отсюда мы можем оценить, классифицируются ли большинство URL-адресов как «хорошие» и, таким образом, проходят все 3 основных показателя Web Vitals, или же большинство страниц оцениваются как «плохие» или «требуют улучшения», что указывает на наличие некоторых нерешенных технических проблем. которые необходимо решить, чтобы они прошли.

Полезный совет. Чтобы перейти в статус «Хорошо», страницы должны пройти все три веб-жизненных показателя, и недостаточно, чтобы большинство URL-адресов сайта находились в диапазоне «Требуется улучшение».

Затем вы можете углубиться в каждый раздел, чтобы обнаружить конкретные URL-адреса, на которые влияют проблемы со скоростью и которые нуждаются в аудите. Они сгруппированы по тем, которые похожи на уровне шаблона. Таким образом, вместо того, чтобы пытаться проверить все различные типы URL-адресов, которые могут быть на сайте, например, домашнюю страницу, страницы категорий, страницы продуктов, сообщения в блогах и т. д., проблемы, с которыми сталкиваются реальные пользователи при посещении веб-сайта, могут быть сосредоточены только вокруг 1 или 2. из них, что означает, что вы можете сосредоточить свои усилия исключительно на этих шаблонах, что может значительно сэкономить время.

2. Используйте PageSpeed ​​Insights экономно

Хотя PageSpeed ​​Insights (PSI) — полезный бесплатный инструмент от Google, который дает общий обзор потенциальных возможностей для устранения проблем, это действительно ленивый способ проверки скорости сайта, если он используется изолированно. Мы видели, как многие SEO-специалисты принимают рекомендации, иногда слово в слово, и представляют их разработчикам клиентов или технической команде, не понимая, почему или какой-либо контекст, стоящий за ними.

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

Например, мы все слышали о рекомендации «Устранить блокирующие ресурсы рендеринга», чтобы ускорить загрузку элемента LCP, но что происходит, когда этот ресурс имеет решающее значение для первой отрисовки, например скрипт баннера cookie или затронутые активы являются сторонними ресурсами? Разработчики, скорее всего, отбросят этот вопрос, так как они мало что смогут сделать, поэтому очень важно, чтобы любые технические рекомендации, взятые из PSI, воспринимались с долей скептицизма и подвергались дальнейшему изучению, прежде чем передавать их обратно в Разработчики.

Также полезно знать, что PSI использует установленное эмулируемое устройство (Moto G4) с Lighthouse, но проблемы могут значительно различаться в зависимости от устройства, которое чаще всего используют реальные пользователи, как в случае с «лабораторным» тестированием. Часто это может означать, что PSI не будет сообщать о проблемах или возможностях для тестирования на этом конкретном устройстве, даже если вы знаете, что существует проблема для реальных пользователей сайта из отчета Chrome UX.

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

3. Изучите альтернативные инструменты аудита скорости

Наряду с PageSpeed ​​и другими инструментами Google мы также рекомендуем изучить другие бесплатные и бесплатные инструменты для тестирования скорости, такие как WebPageTest (WPT) или GTMetrix.

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

Здесь вы также можете настроить параметры подключения по умолчанию для быстрого подключения 3G, а также заблокировать определенные URL-адреса, если вы хотите протестировать повышение производительности для проблемных сценариев. Существует множество других параметров конфигурации, которые мы не перечислили для изучения, но приведенные выше — это те, которые мы сочли наиболее полезными при аудите основных жизненно важных веб-приложений.

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

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

GTMetrix имеет те же функции, что и WebPageTest, однако многие расширенные опции, которые бесплатны в WPT, доступны только в платных пакетах.

4. Ознакомьтесь с диаграммами водопада

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

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

Если вы привыкли использовать WebPageTest для аудита жизненно важных веб-ресурсов, мы находим их каскадные диаграммы наиболее удобными для пользователя. WebPageTest предоставляет ключ с цветовой кодировкой над диаграммой, обозначающий информацию о подключении, запрашиваемые типы ресурсов и другие события, такие как выполнение JS. Он также визуально отображает ресурсы блокировки рендеринга, а также выделяет запрошенные ресурсы, которые имеют ответ 3xx или 4xx.

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

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

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