Исследования и методология, лежащие в основе пороговых значений Core Web Vitals
Опубликовано: 21 мая 2020 г.
Core Web Vitals — это набор полевых показателей, которые измеряют важные аспекты реального взаимодействия пользователей с Интернетом. Core Web Vitals включает метрики, а также целевые пороговые значения для каждой метрики, которые помогают разработчикам качественно понять, является ли впечатление от их сайта «хорошим», «нужно улучшить» или «плохим». В этом посте будет объяснен подход, используемый для выбора пороговых значений для показателей Core Web Vitals в целом, а также то, как были выбраны пороговые значения для каждой конкретной метрики Core Web Vitals.
Курс повышения квалификации: показатели и пороговые значения Core Web Vitals
Основные веб-показатели — это три показателя: наибольшая отрисовка контента (LCP), взаимодействие с следующей отрисовкой (INP) и совокупный сдвиг макета (CLS). Каждая метрика измеряет отдельный аспект взаимодействия с пользователем: LCP измеряет воспринимаемую скорость загрузки и отмечает точку на временной шкале загрузки страницы, когда, вероятно, загрузился основной контент страницы; INP измеряет скорость реагирования и количественно оценивает впечатления, которые испытывают пользователи при попытке взаимодействия со страницей; а CLS измеряет визуальную стабильность и количественно определяет величину неожиданного смещения макета видимого содержимого страницы.
Каждый показатель Core Web Vitals имеет соответствующие пороговые значения, которые классифицируют производительность как «хорошую», «требует улучшения» или «плохую»:
| Хороший | Бедный | процентиль | |
|---|---|---|---|
| Самая большая содержательная краска | ≤2500 мс | >4000 мс | 75 |
| Взаимодействие со следующей отрисовкой | ≤200 мс | >500 мс | 75 |
| Совокупный сдвиг макета | ≤0,1 | >0,25 | 75 |
Кроме того, чтобы классифицировать общую производительность страницы или сайта, мы используем значение 75-го процентиля всех просмотров этой страницы или сайта. Другими словами, если по крайней мере 75 процентов просмотров страниц сайта соответствуют «хорошему» порогу, сайт классифицируется как имеющий «хорошую» производительность по этому показателю. И наоборот, если по крайней мере 25 процентов просмотров страниц соответствуют «плохому» порогу, сайт классифицируется как имеющий «плохую» производительность. Так, например, LCP 75-го процентиля в 2 секунды классифицируется как «хороший», а LCP 75-го процентиля в 5 секунд классифицируется как «плохой».
Критерии для пороговых значений показателей Core Web Vitals
В этом разделе мы рассмотрим критерии оценки пороговых значений показателей Core Web Vitals. В последующих разделах будет более подробно описано, как эти критерии применялись для выбора пороговых значений для каждого показателя. В будущем мы планируем внести улучшения и дополнения в критерии и пороговые значения, чтобы еще больше улучшить нашу способность измерять удобство работы пользователей в Интернете.
Высококачественный пользовательский опыт
Наша основная цель — оптимизировать работу для пользователей и качество их работы. Учитывая это, мы стремимся обеспечить, чтобы страницы, соответствующие «хорошим» пороговым значениям 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% стран с наихудшими показателями классифицируются как «плохие».
Должны ли быть одинаковые или разные критерии для каждого устройства
Использование мобильных и настольных компьютеров обычно имеет очень разные характеристики в отношении возможностей устройства и надежности сети. Это сильно влияет на критерии «достижимости» и поэтому предполагает, что нам следует рассмотреть отдельные пороговые значения для каждого из них.
Однако ожидания пользователей относительно хорошего или плохого опыта не зависят от устройства, даже если критерии достижимости зависят. По этой причине рекомендуемые пороговые значения Core Web Vitals не разделяются по устройствам, и для обоих используется одно и то же пороговое значение. Это также имеет дополнительное преимущество, заключающееся в упрощении понимания пороговых значений.
Кроме того, устройства не всегда хорошо вписываются в одну категорию. Должно ли это зависеть от форм-фактора устройства, вычислительной мощности или условий сети? Наличие одинаковых порогов имеет дополнительное преимущество, позволяющее избежать этой сложности.
Более ограниченный характер мобильных устройств означает, что большинство пороговых значений устанавливаются на основе достижимости мобильных устройств. Скорее всего, они представляют собой мобильные пороговые значения, а не настоящий общий порог для всех типов устройств. Однако, учитывая, что мобильный трафик зачастую составляет большую часть трафика для большинства сайтов , это не вызывает особого беспокойства.
Заключительные мысли о критериях
При оценке пороговых значений кандидатов мы обнаружили, что критерии иногда противоречили друг другу. Например, может возникнуть противоречие между последовательно достижимым порогом и обеспечением стабильно хорошего пользовательского опыта. Кроме того, учитывая, что исследования человеческого восприятия обычно дают диапазон значений, а показатели поведения пользователей показывают постепенные изменения в поведении, мы обнаружили, что часто не существует единого «правильного» порога для показателя. Таким образом, наш подход к основным веб-показателям заключался в выборе пороговых значений, которые лучше всего соответствуют критериям, признавая при этом, что не существует одного идеального порогового значения и что иногда нам может потребоваться выбирать из нескольких разумных возможных пороговых значений. Вместо того, чтобы спрашивать: «Каков идеальный порог?» вместо этого мы сосредоточились на вопросе: «Какой порог кандидата лучше всего соответствует нашим критериям?»
Выбор процентиля
Как отмечалось ранее, для классификации общей эффективности страницы или сайта мы используем значение 75-го процентиля всех посещений этой страницы или сайта. 75-й процентиль был выбран на основе двух критериев. Во-первых, процентиль должен гарантировать, что большинство посещений страницы или сайта имели целевой уровень эффективности. Во-вторых, выбросы не должны сильно влиять на значение выбранного процентиля.
Эти цели несколько противоречат друг другу. Для достижения первой цели обычно лучшим выбором является более высокий процентиль. Однако при более высоких процентилях вероятность того, что на результирующее значение повлияют выбросы, также увеличивается. Если несколько посещений сайта происходят из-за нестабильных сетевых подключений, что приводит к чрезмерно большим выборкам LCP, мы не хотим, чтобы классификация наших сайтов определялась этими выборками-выбросами. Например, если бы мы оценивали эффективность сайта со 100 посещениями, используя высокий процентиль, например 95-й, потребовалось бы всего 5 выборок с выбросами, чтобы на значение 95-го процентиля повлияли выбросы.
Учитывая, что эти цели немного расходятся, после анализа мы пришли к выводу, что 75-й процентиль обеспечивает разумный баланс. Используя 75-й процентиль, мы знаем, что большинство посещений сайта (3 из 4) имели эффективность целевого уровня или выше. Кроме того, выбросы с меньшей вероятностью будут влиять на значение 75-го процентиля. Возвращаясь к нашему примеру, для сайта со 100 посещениями 25 из этих посещений должны будут сообщать о больших выборках выбросов, чтобы значение в 75-м процентиле подвергалось влиянию выбросов. Хотя 25 из 100 выборок могут оказаться выбросами, это гораздо менее вероятно, чем в случае 95-го процентиля.
Самая большая содержательная краска
Пороги LCP были установлены с учетом следующих соображений качества опыта и достижимости.
Качество опыта
1 секунду часто называют временем, в течение которого пользователь будет ждать, прежде чем он начнет терять концентрацию на задаче. При более тщательном изучении соответствующих исследований мы обнаружили, что 1 секунда — это приближение, описывающее диапазон значений, примерно от нескольких сотен миллисекунд до нескольких секунд.
Двумя часто упоминаемыми источниками порога в 1 секунду являются Кард и другие и Миллер . Кард определяет порог «немедленного ответа» в 1 секунду, ссылаясь на «Единые теории познания » Ньюэлла. Ньюэлл объясняет немедленные реакции как «реакции, которые необходимо дать на какой-либо стимул в течение примерно одной секунды (то есть примерно от ~0,3 до ~3 секунд)». Это следует за обсуждением Ньюэлла «ограничений познания в реальном времени», где отмечается, что «взаимодействия с окружающей средой, вызывающие когнитивные размышления, происходят порядка секунд», которые варьируются примерно от 0,5 до 2-3 секунд. Миллер, еще один широко цитируемый источник определения порога в 1 секунду, отмечает, что «задачи, которые люди могут и будут выполнять с помощью машинной связи, серьезно изменят свой характер, если задержка ответа превысит две секунды, с некоторым возможным продлением еще на секунду или около того».
Исследование Миллера и Карда описывает количество времени, которое пользователь будет ждать, прежде чем потеряет фокус, в диапазоне примерно от 0,3 до 3 секунд, что предполагает, что наш «хороший» порог LCP должен находиться в этом диапазоне. Кроме того, учитывая, что существующий «хороший» порог первой содержательной отрисовки составляет 1 секунду и что самая большая содержательная отрисовка обычно происходит после первой содержательной отрисовки, мы дополнительно ограничиваем диапазон возможных пороговых значений LCP от 1 секунды до 3 секунд. Чтобы выбрать порог в этом диапазоне, который лучше всего соответствует нашим критериям, мы далее посмотрим на достижимость этих потенциальных порогов.
Достижимость
Используя данные 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, чтобы определить порог, которому соответствует большинство источников:
| 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 секунды — разумный «плохой» порог для наибольшего содержания.
Взаимодействие со следующей отрисовкой
Пороги INP были установлены с учетом следующих соображений качества опыта и достижимости.
Качество опыта
Исследования достаточно последовательны в заключении, что задержки визуальной обратной связи до 100 мс воспринимаются как вызванные соответствующим источником, например, вводом пользователя. Это говорит о том, что идеальный «хороший» порог взаимодействия с следующей отрисовкой будет близок к этому.
Часто цитируемая книга Якоба Нильсена «Время отклика: 3 важных ограничения» определяет 0,1 секунды как предел, при котором пользователь чувствует, что система реагирует мгновенно. Нильсен цитирует Миллера и Карда, которые цитируют книгу Мишотта «Восприятие причинности» 1962 года. В исследовании Мишотта участникам эксперимента показывают «два объекта на экране. Объект А трогается и движется к Б. Он останавливается в тот момент, когда вступает в контакт с Б, а последний затем стартует и удаляется от А». Мишотт варьирует временной интервал между остановкой объекта А и началом движения объекта Б. Мишотт обнаружил, что при задержках примерно до 100 мс у участников создается впечатление, что Объект А вызывает движение Объекта Б. При задержках примерно от 100 до 200 мс восприятие причинно-следственной связи является смешанным, а при задержках более 200 мс движение Объекта Б больше не рассматривается как вызванное Объектом А.
Точно так же Миллер определяет порог реакции для «Реакции на активацию элемента управления» как «индикацию действия, вызываемого, как правило, движением ключа, переключателя или другого элемента управления, который сигнализирует о его физической активации. Этот ответ должен… восприниматься как часть механического действия, вызываемого оператором. Временная задержка: не более 0,1 секунды» и далее «задержка между нажатием клавиши и визуальной обратной связью должна составлять не более 0,1–0,2 секунды».
Совсем недавно в книге «На пути к идеальной во времени виртуальной кнопке » Кааресоя и другие исследовали восприятие одновременности между касанием виртуальной кнопки на сенсорном экране и последующей визуальной обратной связью, указывающей на нажатие кнопки, с различными задержками. Когда задержка между нажатием кнопки и визуальной обратной связью составляла 85 мс или меньше, участники сообщали, что визуальная обратная связь появлялась одновременно с нажатием кнопки в 75% случаев. Кроме того, при задержках в 100 мс или меньше участники сообщили о стабильно высоком воспринимаемом качестве нажатия кнопки, причем воспринимаемое качество падало при задержках от 100 до 150 мс и достигало очень низкого уровня при задержках в 300 мс.
Учитывая это, мы приходим к выводу, что исследования указывают на 100 мс как на «хороший» порог взаимодействия с следующей отрисовкой для Web Vitals. Кроме того, учитывая, что пользователи сообщают о низком уровне качества при задержках 300 мс и более, в идеале это будет «плохой» порог.
Достижимость
Используя данные CrUX, мы определяем, что большинство источников в сети соответствуют «хорошему» порогу INP в 200 мс на 75-м процентиле:
| 100 мс | 200 мс | 300 мс | 400 мс | 500 мс | |
|---|---|---|---|---|---|
| телефон | 12% | 56% | 76% | 88% | 92% |
| рабочий стол | 83% | 96% | 98% | 99% | 99% |
Мы также уделили особое внимание возможности прохождения INP для мобильных устройств более низкого уровня, на которые приходится большая доля посещений сайтов. Это еще раз подтвердило пригодность порога в 200 мс.
Принимая во внимание порог в 100 мс, подтвержденный исследованиями качества опыта и критериев достижимости, мы приходим к выводу, что 200 мс — это разумный порог для хорошего опыта.
Чтобы определить «плохой» порог для LCP, мы используем данные CrUX, чтобы определить порог, которому соответствует большинство источников:
| 100 мс | 200 мс | 300 мс | 400 мс | 500 мс | |
|---|---|---|---|---|---|
| телефон | 88% | 44% | 24% | 12% | 8% |
| рабочий стол | 17% | 4% | 2% | 1% | 1% |
Это говорит о том, что у нас может быть «плохой» порог в 300 мс.
Однако, в отличие от LCP и CLS, INP имеет обратную корреляцию с популярностью — более популярные сайты часто более сложны, что приводит к большей вероятности более высокого INP. Когда мы смотрим на 10 000 самых популярных сайтов, которые составляют подавляющее большинство посещений Интернета, мы видим более сложную картину:
| 100 мс | 200 мс | 300 мс | 400 мс | 500 мс | |
|---|---|---|---|---|---|
| телефон | 97% | 77% | 55% | 37% | 24% |
| рабочий стол | 48% | 17% | 8% | 4% | 2% |
На мобильных устройствах порог «плохо» в 300 мс классифицирует большинство популярных сайтов как «плохие», что расширяет наши критерии достижимости, тогда как порог 500 мс лучше подходит для диапазона 10–30% сайтов. Следует также отметить, что порог «хорошо» в 200 мс также является более жестким для этих сайтов, но, поскольку 23% сайтов по-прежнему проходят его на мобильных устройствах, это все равно соответствует нашим критериям минимальной проходимости в 10%.
По этой причине мы пришли к выводу, что 200 мс — это разумный «хороший» порог для большинства сайтов, а более 500 мс — разумный «плохой» порог.
Совокупный сдвиг макета
Пороги CLS были установлены с учетом следующих соображений качества опыта и достижимости.
Качество опыта
Совокупное смещение макета (CLS) — это новый показатель, который измеряет, насколько смещается видимое содержимое страницы. Поскольку CLS является новым явлением, нам неизвестны исследования, которые могли бы напрямую определить пороговые значения этого показателя. Таким образом, чтобы определить порог, соответствующий ожиданиям пользователей, мы оценили реальные страницы с разной степенью смещения макета, чтобы определить максимальную величину смещения, которая воспринимается как приемлемая, прежде чем вызывать значительные сбои при потреблении контента страницы. В ходе нашего внутреннего тестирования мы обнаружили, что уровни сдвига от 0,15 и выше всегда воспринимались как разрушительные, тогда как сдвиги от 0,1 и ниже были заметными, но не слишком разрушительными. Таким образом, хотя нулевой сдвиг макета является идеальным, мы пришли к выводу, что значения до 0,1 являются кандидатами на «хорошие» пороги CLS.
Достижимость
Основываясь на данных CrUX, мы видим, что почти 50% источников имеют CLS 0,05 или ниже.
| 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, чтобы определить порог, которому соответствует большинство источников:
| 0,15 | 0,2 | 0,25 | 0,3 | |
|---|---|---|---|---|
| телефон | 31% | 25% | 20% | 18% |
| рабочий стол | 31% | 23% | 18% | 16% |
При пороге 0,25 примерно 20% телефонных версий и 18% настольных компьютеров будут классифицированы как «плохие». Это попадает в наш целевой диапазон 10–30%, поэтому мы пришли к выводу, что 0,25 — приемлемый «плохой» порог.