Определение пороговых значений показателей Core Web Vitals

Исследования и методология, лежащие в основе пороговых значений Core Web Vitals

Брайан Маккуэйд
Брайан Маккуэйд

Core Web Vitals — это набор полевых показателей, которые измеряют важные аспекты реального взаимодействия пользователей с Интернетом. Core Web Vitals включает метрики, а также целевые пороговые значения для каждой метрики, которые помогают разработчикам качественно понять, является ли впечатление от их сайта «хорошим», «нужно улучшить» или «плохим». В этом посте будет объяснен подход, используемый для выбора пороговых значений для показателей Core Web Vitals в целом, а также то, как были выбраны пороговые значения для каждой конкретной метрики Core Web Vitals.

Курс повышения квалификации: показатели и пороговые значения Core Web Vitals

В 2020 году основными веб-показателями являются три показателя: наибольшая отрисовка контента (LCP), первая задержка ввода (FID) и совокупный сдвиг макета (CLS). Каждая метрика измеряет отдельный аспект взаимодействия с пользователем: LCP измеряет воспринимаемую скорость загрузки и отмечает точку на временной шкале загрузки страницы, когда, вероятно, загрузился основной контент страницы; FID измеряет скорость реагирования и количественно оценивает впечатления, которые испытывают пользователи при первой попытке взаимодействия со страницей; а CLS измеряет визуальную стабильность и количественно определяет величину неожиданного смещения макета видимого содержимого страницы.

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

Рекомендации по максимальному пороговому значению Contentful PaintРекомендации по пороговому значению первой входной задержкиРекомендации по пороговым значениям совокупного смещения макета
Хороший Бедный процентиль
Самая большая содержательная краска ≤2500 мс >4000 мс 75
Первая входная задержка ≤100 мс >300 мс 75
Совокупный сдвиг макета ≤0,1 >0,25 75

Кроме того, чтобы классифицировать общую производительность страницы или сайта, мы используем значение 75-го процентиля всех просмотров этой страницы или сайта. Другими словами, если по крайней мере 75 процентов просмотров страниц сайта соответствуют «хорошему» порогу, сайт классифицируется как имеющий «хорошую» производительность по этому показателю. И наоборот, если по крайней мере 25 процентов просмотров страниц соответствуют «плохому» порогу, сайт классифицируется как имеющий «плохую» производительность. Так, например, LCP 75-го процентиля в 2 секунды классифицируется как «хороший», а LCP 75-го процентиля в 5 секунд классифицируется как «плохой».

Критерии для пороговых значений показателей Core Web Vitals

Устанавливая пороговые значения для показателей Core Web Vitals, мы сначала определили критерии, которым должно соответствовать каждое пороговое значение. Ниже я объясняю критерии, которые мы использовали в Google для оценки пороговых значений показателей Core Web Vitals в 2020 году. В последующих разделах будет более подробно описано, как эти критерии применялись для выбора пороговых значений для каждой метрики в 2020 году. В последующие годы мы планируем внести улучшения и дополнения в критерии и пороговые значения, чтобы еще больше улучшить нашу способность измерять удобство взаимодействия с пользователем на платформе. сеть.

Высококачественный пользовательский опыт

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

Чтобы определить порог, связанный с высоким качеством пользовательского опыта, мы обращаемся к человеческому восприятию и исследованиям HCI. Хотя это исследование иногда обобщается с использованием единого фиксированного порога, мы обнаруживаем, что лежащее в его основе исследование обычно выражается в виде диапазона значений. Например, исследование количества времени, в течение которого пользователи обычно ждут, прежде чем потерять фокус, иногда описывается как 1 секунда, в то время как лежащее в его основе исследование на самом деле выражается в диапазоне от сотен миллисекунд до нескольких секунд. Тот факт, что пороги восприятия различаются в зависимости от пользователя и контекста, дополнительно подтверждается агрегированными и анонимизированными данными метрик Chrome, которые показывают, что пользователи не ждут ни единого промежутка времени, пока веб-страница отобразит контент, прежде чем прервать загрузку страницы. Скорее, эти данные показывают плавное и непрерывное распределение. Для более подробного изучения порогов человеческого восприятия и соответствующих исследований HCI см. The Science Behind Web Vitals .

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

Достижимо с помощью существующего веб-контента

Кроме того, чтобы владельцы сайтов могли успешно оптимизировать свои сайты для достижения «хороших» порогов, мы требуем, чтобы эти пороги были достижимы для существующего контента в Интернете. Например, хотя ноль миллисекунд является идеальным «хорошим» порогом LCP, приводящим к мгновенной загрузке, в большинстве случаев порог в ноль миллисекунд практически недостижим из-за задержек обработки сети и устройства. Таким образом, ноль миллисекунд не является разумным «хорошим» порогом LCP для Core Web Vitals.

При оценке кандидатов на «хорошие» пороговые значения Core Web Vitals мы проверяем, что эти пороговые значения достижимы, на основе данных из отчета об опыте пользователей Chrome (CrUX). Чтобы подтвердить, что порог достижим, мы требуем, чтобы по крайней мере 10% источников в настоящее время соответствовали «хорошему» порогу. Кроме того, чтобы гарантировать, что хорошо оптимизированные сайты не будут ошибочно классифицированы из-за изменчивости полевых данных, мы также проверяем, что хорошо оптимизированный контент постоянно соответствует «хорошему» порогу.

И наоборот, мы устанавливаем «плохой» порог, определяя уровень производительности, которому в настоящее время не соответствует лишь меньшинство стран происхождения. Если нет доступных исследований, касающихся определения «плохого» порога, по умолчанию 10–30% стран с наихудшими показателями классифицируются как «плохие».

Заключительные мысли о критериях

При оценке пороговых значений кандидатов мы обнаружили, что критерии иногда противоречили друг другу. Например, может возникнуть противоречие между последовательно достижимым порогом и обеспечением стабильно хорошего пользовательского опыта. Кроме того, учитывая, что исследования человеческого восприятия обычно дают диапазон значений, а показатели поведения пользователей показывают постепенные изменения в поведении, мы обнаружили, что часто не существует единого «правильного» порога для показателя. Таким образом, наш подход к основным веб-показателям 2020 года заключался в выборе пороговых значений, которые лучше всего соответствуют вышеуказанным критериям, признавая при этом, что не существует одного идеального порогового значения и что иногда нам может потребоваться выбирать из нескольких разумных возможных пороговых значений. Вместо того, чтобы спрашивать: «Каков идеальный порог?» вместо этого мы сосредоточились на вопросе: «Какой порог кандидата лучше всего соответствует нашим критериям?»

Выбор процентиля

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

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

Учитывая, что эти цели немного расходятся, после анализа мы пришли к выводу, что 75-й процентиль обеспечивает разумный баланс. Используя 75-й процентиль, мы знаем, что большинство посещений сайта (3 из 4) имели эффективность целевого уровня или выше. Кроме того, выбросы с меньшей вероятностью будут влиять на значение 75-го процентиля. Возвращаясь к нашему примеру, для сайта со 100 посещениями 25 из этих посещений должны будут сообщать о больших выборках выбросов, чтобы значение в 75-м процентиле подвергалось влиянию выбросов. Хотя 25 из 100 выборок могут оказаться выбросами, это гораздо менее вероятно, чем в случае 95-го процентиля.

Самая большая содержательная краска

Качество опыта

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

Двумя часто упоминаемыми источниками порога в 1 секунду являются Кард и др. и Миллер . Кард определяет порог «немедленного ответа» в 1 секунду, ссылаясь на «Единые теории познания» Ньюэлла. Ньюэлл объясняет немедленные реакции как «реакции, которые необходимо дать на какой-либо стимул в течение примерно одной секунды (то есть примерно от ~0,3 до ~3 секунд)». Это следует за обсуждением Ньюэлла «ограничений познания в реальном времени», где отмечается, что «взаимодействия с окружающей средой, вызывающие когнитивные размышления, происходят порядка секунд», которые варьируются примерно от 0,5 до 2-3 секунд. Миллер, еще один часто цитируемый источник определения порога в 1 секунду, отмечает, что «задачи, которые люди могут и будут выполнять с помощью машинной связи, серьезно изменят свой характер, если задержка ответа превысит две секунды, с некоторым возможным продлением еще на секунду или около того».

Исследование Миллера и Карда описывает количество времени, которое пользователь будет ждать, прежде чем потеряет фокус, в диапазоне примерно от 0,3 до 3 секунд, что предполагает, что наш «хороший» порог LCP должен находиться в этом диапазоне. Кроме того, учитывая, что существующий «хороший» порог первой контентной отрисовки составляет 1 секунду, а самая большая контентная отрисовка обычно происходит после первой контентной отрисовки, мы дополнительно ограничиваем диапазон возможных пороговых значений LCP от 1 секунды до 3 секунд. Чтобы выбрать порог в этом диапазоне, который лучше всего соответствует нашим критериям, мы рассмотрим достижимость этих потенциальных порогов ниже.

Достижимость

Используя данные CrUX, мы можем определить процент источников в сети, которые соответствуют «хорошим» пороговым значениям нашего кандидата LCP.

% источников CrUX, классифицированных как «хорошие» (для потенциальных пороговых значений LCP)

1 секунда 1,5 секунды 2 секунды 2,5 секунды 3 секунды
телефон 3,5% 13% 27% 42% 55%
рабочий стол 6,9% 19% 36% 51% 64%

Хотя менее 10% источников соответствуют порогу в 1 секунду, все остальные пороги от 1,5 до 3 секунд удовлетворяют нашему требованию, чтобы как минимум 10% источников соответствовали «хорошему» порогу и, таким образом, оставались действительными кандидатами.

Кроме того, чтобы гарантировать, что выбранный порог постоянно достижим для хорошо оптимизированных сайтов, мы анализируем производительность LCP для самых эффективных сайтов в Интернете, чтобы определить, какие пороговые значения стабильно достижимы для этих сайтов. В частности, мы стремимся определить порог, который постоянно достижим на уровне 75-го процентиля для наиболее эффективных сайтов. Мы обнаружили, что пороги в 1,5 и 2 секунды не всегда достижимы, тогда как порог в 2,5 секунды постоянно достижим.

Чтобы определить «плохой» порог для LCP, мы используем данные CrUX, чтобы определить порог, которому соответствует большинство источников:

% источников CrUX, классифицированных как «плохие» (для потенциальных пороговых значений LCP)

3 секунды 3,5 секунды 4 секунды 4,5 секунды 5 секунд
телефон 45% 35% 26% 20% 15%
рабочий стол 36% 26% 19% 14% 10%

При пороге в 4 секунды примерно 26% исходных сообщений с телефонов и 21% исходных сообщений с настольных компьютеров будут классифицированы как плохие. Это попадает в наш целевой диапазон 10–30 %, поэтому мы приходим к выводу, что 4 секунды — это приемлемый «плохой» порог.

Таким образом, мы приходим к выводу, что 2,5 секунды — это разумный «хороший» порог, а 4 секунды — разумный «плохой» порог для наибольшего содержания.

Первая входная задержка

Качество опыта

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

Часто цитируемая книга Якоба Нильсена «Время отклика: 3 важных ограничения» определяет 0,1 секунды как предел, позволяющий пользователю почувствовать, что система реагирует мгновенно. Нильсен цитирует Миллера и Карда, которые цитируют книгу Мишотта «Восприятие причинности» 1962 года. В исследовании Мишотта участникам эксперимента показывают «два объекта на экране. Объект А трогается с места и движется к Б. Он останавливается в тот момент, когда вступает в контакт с Б, а последний затем стартует и удаляется от А». Мишотт варьирует временной интервал между остановкой объекта А и началом движения объекта Б. Мишотт обнаружил, что при задержках примерно до 100 мс у участников создается впечатление, что Объект А вызывает движение Объекта Б. При задержках примерно от 100 до 200 мс восприятие причинности является смешанным, а при задержках более 200 мс движение Объекта B больше не рассматривается как вызванный Объектом A.

Точно так же Миллер определяет порог реакции для «Реакции на активацию элемента управления» как «индикацию действия, вызываемого, как правило, движением ключа, переключателя или другого элемента управления, который сигнализирует о его физической активации. Этот ответ должен… восприниматься как часть механического действия, вызываемого оператором. Временная задержка: не более 0,1 секунды» и далее «задержка между нажатием клавиши и визуальной обратной связью должна составлять не более 0,1–0,2 секунды».

Совсем недавно в книге «На пути к идеальной во времени виртуальной кнопке » Кааресоя и др. исследовали восприятие одновременности между касанием виртуальной кнопки на сенсорном экране и последующей визуальной обратной связью, указывающей на нажатие кнопки, с различными задержками. Когда задержка между нажатием кнопки и визуальной обратной связью составляла 85 мс или меньше, участники сообщали, что визуальная обратная связь появлялась одновременно с нажатием кнопки в 75% случаев. Кроме того, при задержках в 100 мс или менее участники сообщили о стабильно высоком воспринимаемом качестве нажатия кнопки, причем воспринимаемое качество падало при задержках от 100 до 150 мс и достигало очень низкого уровня при задержках в 300 мс.

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

Достижимость

Используя данные CrUX, мы определяем, что большинство источников в сети соответствуют «хорошему» порогу FID в 100 мс на 75-м процентиле:

% источников CrUX, классифицированных как «хорошие» для порога FID 100 мс

100 мс
телефон 78%
рабочий стол >99%

Кроме того, мы наблюдаем, что ведущие сайты в сети способны постоянно достигать этого порога на уровне 75-го процентиля (и часто достигают его на уровне 95-го процентиля).

Учитывая вышеизложенное, мы приходим к выводу, что 100 мс — это разумный «хороший» порог для FID.

Совокупный сдвиг макета

Качество опыта

Совокупное смещение макета (CLS) — это новый показатель, который измеряет, насколько смещается видимое содержимое страницы. Поскольку CLS является новым явлением, нам неизвестны исследования, которые могли бы напрямую определить пороговые значения этого показателя. Таким образом, чтобы определить порог, соответствующий ожиданиям пользователей, мы оценили реальные страницы с разной степенью смещения макета, чтобы определить максимальную величину смещения, которая воспринимается как приемлемая, прежде чем вызывать значительные сбои при потреблении контента страницы. В ходе нашего внутреннего тестирования мы обнаружили, что уровни сдвига от 0,15 и выше всегда воспринимались как разрушительные, тогда как сдвиги от 0,1 и ниже были заметными, но не слишком разрушительными. Таким образом, хотя нулевой сдвиг макета является идеальным, мы пришли к выводу, что значения до 0,1 являются кандидатами на «хорошие» пороги CLS.

Достижимость

Основываясь на данных CrUX, мы видим, что почти 50% источников имеют CLS 0,05 или ниже.

% источников CrUX, классифицированных как «хорошие» (для потенциальных порогов CLS)

0,05 0,1 0,15
телефон 49% 60% 69%
рабочий стол 42% 59% 69%

Хотя данные CrUX показывают, что 0,05 может быть разумным «хорошим» порогом CLS, мы понимаем, что существуют некоторые случаи использования, когда в настоящее время трудно избежать разрушительных изменений макета. Например, для стороннего встроенного контента, такого как встраивания в социальные сети, высота встроенного контента иногда неизвестна до тех пор, пока он не завершит загрузку, что может привести к сдвигу макета более чем на 0,05. Таким образом, мы приходим к выводу, что, хотя многие источники соответствуют порогу 0,05, немного менее строгий порог CLS, равный 0,1, обеспечивает лучший баланс между качеством опыта и достижимостью. Мы надеемся, что в будущем веб-экосистема найдет решения для устранения изменений макета, вызванных встраиванием третьих сторон, что позволит использовать более строгий «хороший» порог CLS 0,05 или 0 в будущей итерации Core Web Vitals. .

Кроме того, чтобы определить «плохой» порог для CLS, мы использовали данные CrUX, чтобы определить порог, которому соответствует большинство источников:

% источников CrUX, классифицированных как «плохие» (для потенциальных пороговых значений CLS)

0,15 0,2 0,25 0,3
телефон 31% 25% 20% 18%
рабочий стол 31% 23% 18% 16%

При пороге 0,25 примерно 20% телефонных версий и 18% настольных компьютеров будут классифицированы как «плохие». Это попадает в наш целевой диапазон 10–30%, поэтому мы пришли к выводу, что 0,25 — приемлемый «плохой» порог.