{"id":14268,"url":"\/distributions\/14268\/click?bit=1&hash=1e3309842e8b07895e75261917827295839cd5d4d57d48f0ca524f3f535a7946","title":"\u0420\u0430\u0437\u0440\u0435\u0448\u0430\u0442\u044c \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u043a\u0430\u043c \u0438\u0433\u0440\u0430\u0442\u044c \u043d\u0430 \u0440\u0430\u0431\u043e\u0447\u0435\u043c \u043c\u0435\u0441\u0442\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e?","buttonText":"\u0423\u0437\u043d\u0430\u0442\u044c","imageUuid":"f71e1caf-7964-5525-98be-104bb436cb54"}

Google CoreVitals - или что нужно делать чтобы ваш сайт рос в 2021

В мае 2020 официальный блог Центр Google Поиска опубликовал важную информацию о возможных обновлениях среди факторов ранжирования страниц при формировании результатов поисковой выдачи. Ключевым посылом для грядущих обновлений стал рост интереса пользователей к инструментам оценки качества и удобства страниц. Так, использование Google PageSpeed и Lighthouse возросло почти на 70%.

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

Вкратце остановимся на факторах ранжирования.

Страница результатов поиска, также часто называемая SERP (Search Engine Results Page), состоит из натуральных и оплаченных результатов.

Натуральные, либо органические результаты поиска - это подобранные поисковым алгоритмом ссылки наиболее соответствующие введенному запросу.

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

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

Один из них - геолокация пользователя. Поисковая выдача будет сильно отличаться в зависимости от местоположения (IP адреса) того, кто отправил запрос. В этих целях принято делить запросы на:

► геозависимые

► геонезависимые.

Помимо этого, набор ключевых слов сильно зависит от региона, а не только от языка. Например, для англоязычного запроса “books” выдача в США и Великобритании будет очень сильно отличаться.

И последний - актуальность. При прочих равных, выдача будет совершенно разной для чувствительных ко времени запросов. Например, если информация связана с последними событиями, акциями или новостями.

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

Именно эти положения составляли основу выступления продакт-менеджера Google Chrome, Эмили Шехтер, на Саммите Прогрессивных Веб-Приложений в 2016. Примечательно, что за два года до этого выступления - 6 августа 2014, Гарри Илиес выступил соавтором поста, подтверждающего роль HTTPS как положительного сигнала при ранжировании, а Пьер Фар и Илья Григорик посвятили этой теме совместное выступление “HTTPS Everywhere” на саммите Google I/O. Еще через год, 17 декабря 2015, команда безопасности и индексирования опубликовала новость об индексации HTTPS-версий страниц по умолчанию. 8 сентября 2016 Эмили Шехтер опубликовала пост о нововведении в идентификации небезопасных сайтов, вступившем в силу с 56 версии Chrome, запланированной на январь 2017. И наконец, уже в 2018, Адриэн Портер Фелт, от лица команды инженеров Google Chrome, обратилась к сообществу в своем Твиттере, еще раз перечислив основные причины, по которым Google так отстаивает переход на HTTPS. При этом доля HTTPS страниц в органических поисковых результатах достигала порядка 30% в апреле 2016 и до конца 2017 года достигла более 70%.

Возвращаясь к пользовательскому опыту, отметим, что ранжирование требует также провести оценку качества страниц. Это объединяет как уровень технической реализации - то есть надежность, скорость и удобство пользования, так и релевантность содержимого веб-сайта и каждой из его страниц. Эти данные также подкреплялись более ранними исследованиями Google 2009 года. Как результат, май 2020 стал месяцем обновления сервиса оценки основных показателей интернет-страниц, известных как Core Web Vitals.

В Google представили три основных показателя, которые будут использоваться для оценки пользовательского опыта и удобства при взаимодействии с теми или иными сайтами:

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

First Input Delay или FID - это условная задержка во времени, между моментом, когда пользователь может совершить действие на странице и когда браузер может это действие обработать. Например, кнопка или фильтр на сайте могут загрузиться намного раньше, чем все необходимые для их функционирования элементы и сценарии. Таким образом, иногда мы сталкиваемся с задержкой между нажатием на кнопку и фактическим выполнением действия. Именно продолжительность такой задержки и будет FID.

Cumulative Layout Shift или CLS - это показатель стабильности отображения содержимого страницы. Его основная задача - измерить, насколько сильно загрузка страницы может влиять на смену их визуального положения и как это влияет на пользователей. Например, если страница загружает CSS или внешние сценарии намного позже своего содержимого, то пользователи могут увидеть как содержимое резко смещается после того, как страница закончит свою загрузку. Также CLS относится к неправильно реализованным всплывающим модулям, блокам объявлений и прочим элементам, способным влиять на положение содержимого страницы.

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

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

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

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

Как следствие, в мае 2021 года, показатели Google Core Web Vitals будут включены в ряд основных факторов ранжирования, о чем сообщили 10 ноября 2020 в официальном твиттер-аккаунте Центра Google Поиска.

Остановимся немного подробнее на самом понятии Web Vitals. Это инициатива, запущенная Google несколько лет назад с целью создать наиболее практичную систему оценки производительности и качества веб-страниц на основе реальных данных.

Не смотря на множество сервисов и инструментов способных решить подобную задачу, в Google подошли к этому вопросу постепенно и структурировано. Согласно публикации Ильи Григорика в блоге Chromium от 5 мая 2020, Google планирует расширять список ключевых параметров Core Vitals ежегодно. Этот процесс будет во многом зависеть от обратной связи и информации от пользователей, потому планируется регулярно публиковать актуальную информацию о потенциальных кандидатах, методологии их оценки и сбора данных. Отслеживать новости можно в этом журнале обновлений.

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

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

В свете декабрьского обновления корневого алгоритма Google основное внимание на профильных событиях и конференциях уделялось именно этой теме. Тем не менее, Дмитрий Бондарь в своем выступлении 22 октября 2020 года на пятнадцатой конференции NaZapad выделил новости о Core Web Vitals как одно из ключевых событий, не менее важное, нежели крупное обновление поискового алгоритма. Рассмотрим факторы Core Web Vitals на практическом примере. Для этого, воспользуемся сервисом аналитики Google PageSpeed Insights и введем нужный адрес в строку поиска.

Оценка по основным факторам Core Web Vitals будет отображена в первом блоке результатов:

Еще одна особенность, о которой стоит упомянуть - оценка будет отличаться для версий сайта под мобильные и стационарные устройства.

Мобильная версия сайта

Стационарная версия сайта

Также остановимся немного подробнее на этой фразе:

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

Например, чтобы определить оптимальную скорость загрузки, используются все собранные данные по проанализированным за период обновления страницам. Далее выделяют 10% самых быстрых и по ним очерчивают границу “зеленой” зоны - то есть наилучшего показателя. Следующие 40% формируют пограничную “оранжевую” зону, а оставшиеся 50% уже включают в “красную” зону наименьшей производительности.

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

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

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

Раздел Диагностики больше относится к технической реализации страницы и ее соответствию существующим рекомендациям по качеству веб-разработки. Именно поэтому данные представлены рядом со значениями в секундах и объеме загружаемых данных.

Возвращаясь к основным показателям Core WebVitals, можно выделить 4 основные метрики, доступные в отчете на данный момент:

► Первая отрисовка контента или First Contentful Paint (FCP),

► Отрисовка наиболее крупного элемента или Largest Contentful Paint (LCP),

► Первая задержка при вводе - First Input Delay (FID) и Cumulative Layout Shift (CLS), то есть Совокупное смещение содержимого.

► Еще 3 дополнительных фактора Web Vitals, доступные в отчете - это: Индекс скорости загрузки, Время загрузки для взаимодействия и Приблизительное время задержки при вводе. И несколько дополнительных расчетных факторов, таких как Время загрузки достаточной части контента и, например, Время окончания работы ЦП.

Еще один источник данных - это непосредственный аудит веб-страницы при помощи Lighthouse и Google Chrome Dev Tools. Для этого нужно открыть интересующую страницу в браузере Google Chrome.

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

В открывшейся панели выберите вкладку Lighthouse, либо, если такой нет - откройте выпадающий список справа и выберите нужный раздел как показано на скриншоте

На вкладке аудита выберите интересующие вас разделы, поставив напротив них галочки и нажмите “Сгенерировать отчет”.

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

И детальный отчет по каждому из выбранных разделов.

Для удобства пользователей, Lighthouse можно установить отдельно в виде расширения для Chrome, либо через командную строку, воспользовавшись командой

npm install -g lighthouse

Что можно сделать, чтобы ваша страница лучше проходила проверки Google Core Web Vitals?

Во-первых, далеко не все действия требуют знания основ веб-разработки или языков программирования. Но если ваш сайт построен на базе автоматизированной CMS, например Shopify или Wordpress, то будет ряд ограничений, которые вам не удастся обойти просто в виду того, как работает выбранная площадка для создания сайтов.

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

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

Либо провести аналогичную проверку при помощи бесплатного сервиса GTMetrix, который предоставит намного более понятный результат.

Это также полезно для того, чтобы на практике понять, что именно относится к некоторым показателям Core Vitals и на каком этапе отрисовки могут возникать проблемы. Еще один удобный инструмент аналитики в отчете GTMetrix - распределение трафика по типам контента.

Здесь вы сможете увидеть не только данные по объему, занимаемому определенным типом содержимого страницы, например, изображениями:

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

Для того чтобы найти наиболее затратные по объему или времени загрузки элементы страницы, воспользуйтесь инструментами разработчика Chrome. Выберите вкладку “Сеть” или “Network” и перезагрузите страницу. Предпочтительно проводить такие проверки в режиме Инкогнито, чтобы получить наиболее точные результаты. Дождитесь окончания загрузки страницы и вы получите возможность фильтровать элементы по размеру или времени, которое потребовалось на их загрузку.

Также вы получите еще один срез информации по общей статистике страницы в строке состояния в конце отчета:

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

Для этого рекомендуем снова обратиться к отчету Google PageInsights. Например, в этом случае можно сэкономить более 7 секунд времени загрузки за счет оптимизации изображений.

Если вы откроете выпадающий список, то там будут отображены конкретные элементы страницы, которые нужно оптимизировать с соответствующими ссылками.

Чтобы найти такое изображение на вашей странице, скопируйте указанную в отчете ссылку, откройте инструменты разработчика и выполните поиск по скопированному адресу.

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

Данный элемент отчета указывает на два листа стилей, загрузка которых мешает отрисовке страницы

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

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

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

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

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

Можно сделать много предположений о возможном пути развития и значении Core Web Vitals для поисковой оптимизации и ранжирования в частности.

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

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

Скорее всего, это еще один этап в многолетней стратегии Google, уходящей корнями еще в 2010 года, когда впервые пошла речь о важности перехода на более безопасный протокол передачи данных HTTPS. Как и в том случае, реализация заняла более 8 лет перед тем как Google решились на более резкие шаги. В частности, принудительные меры были приняты после того, как браузер Chrome занимал более 50% рынка США, а большинство поисковых запросов итак проходило через серверы компании.

То же самое можно сказать и о приоритетном мобильном индексировании, структурированных данных и множестве прочих инициатив, которые активно поддерживает и продвигает Google.

Скорее всего мы можем ожидать множество мелких, но частых изменений в алгоритме расчета и оценки Google Core Web Vitals, равно как и несколько крупных апдейтов в год. По аналогии с обновлениями поисковых алгоритмов, сейчас заявлено одно крупное обновление Web Vitals в течение года, но можно предположить, что их число будет возрастать до 2-3 в течение ближайших нескольких лет. Здесь важно учитывать и прямую взаимосвязь с живыми пользовательскими данными.

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

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

0
13 комментариев
Написать комментарий...
Евгений Калинский

Эта статья скорее подбор ссылок на материалы, чем практическая рекомендация. Да, тут есть ссылки кто, что и когда сказал про PageSpeed .... и всё. Явно видно, что человек, который это писал, сам сайты не разгоняет. В целом ничего ценного.

Ответить
Развернуть ветку
Alex Trud

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

Ответить
Развернуть ветку
Андрей Семёнов

Задайте блоку примерную высоту, например в 300px. Тогда при загрузке страницы получится, что область для рекламы уже выделена (необязательно на 100% попадающая в размерность рекламного блока), поэтому дёргаться будет значительно меньше. Например так: div.ads{
min-height:266px} @media screen and (min-height:40em){div.ads{min-height:200px}}

Ответить
Развернуть ветку
Alex Trud

Благодарю. Задавал. Это поможет, если в этот ДИВ вставляется баннер своими ручками. А тут Гоша сам вставляет, куда хочет свои "автоматизированные объявления." Отключил их.

Ответить
Развернуть ветку
Андрей Семёнов

О, это не проблема. Просто в это место ставите свой банер (адаптивный в AdSense), но при этом автоматизированный не отключаете. Тогда получается, что Google видит, это место занято и ставит в других местах, если посчитает нужным. Но главное, что это место уже вами забито и с нужными стилями.

Ответить
Развернуть ветку
Alex Trud

Спасибочки!

Ответить
Развернуть ветку
Андрей Семёнов

У тебя на сайте, когда появляется тётка - половина экрана вправо улетает.

Ответить
Развернуть ветку
Alex Trud

Спасибки? Только эта страница? На чем смотришь: десктоп, смартфон, ноутбук ?

Ответить
Развернуть ветку
Андрей Семёнов

Я не ходил по другим страницам и не хочу.
Это Safari

Ответить
Развернуть ветку
Alex Trud

Спасибки! Поставлю сафари, проверю! Другие страницы НЕ смотри, ну, чтобы не портить настроение.

Ответить
Развернуть ветку
Alex Trud

Ну, так что опытные сеошники скажут про мою проблему на https://www/assessor.ru

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Колесов Василий

Отличный материал. Без воды. Начало положено.

Ответить
Развернуть ветку
Андрей Семёнов

Настолько без воды, что одна вода.

Ответить
Развернуть ветку
10 комментариев
Раскрывать всегда