{"id":14277,"url":"\/distributions\/14277\/click?bit=1&hash=17ce698c744183890278e5e72fb5473eaa8dd0a28fac1d357bd91d8537b18c22","title":"\u041e\u0446\u0438\u0444\u0440\u043e\u0432\u0430\u0442\u044c \u043b\u0438\u0442\u0440\u044b \u0431\u0435\u043d\u0437\u0438\u043d\u0430 \u0438\u043b\u0438 \u0437\u043e\u043b\u043e\u0442\u044b\u0435 \u0443\u043a\u0440\u0430\u0448\u0435\u043d\u0438\u044f","buttonText":"\u041a\u0430\u043a?","imageUuid":"771ad34a-9f50-5b0b-bc84-204d36a20025"}

В Google запустили Web Vitals: важные показатели здоровья вашего сайта

5 мая Google анонсировала запуск Web Vitals — важные показатели для оценки качественного сайта. Расскажу, почему это важно для SEO и конверсий вашего сайта.

Web Vitals Источник: blog.chromium.org

Что такое Core Web Vitals

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

Поэтому в Google решили объединить все инструменты, которые измеряют производительность сайтов и вывести их в отдельное ядро сервисов.

Компания сообщает, что сервисы Lighthouse, Chrome DevTools, PageSpeed Insights, Search Console’s Speed Report вскоре будут обновлены и интегрированы друг в друга так, чтобы все владельцы сайтов знали, что требуется сделать для того, чтобы их сайт был еще лучше для пользователей и для поисковой машины. Про обновление PageSpeed упоминалось ранее здесь.

Что измеряет Core Web Vitals

Главные показатели ядра Web Vitals Источник: blog.chromium.org

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

Google выделяет три основных показателя, на которых держится ядро Core Web Vitals:

Подробнее об этих показателях:

LCP — измеряет время отрисовки самой большой и видимой части содержимого на первом экране вашего сайта. Это может быть картинка, заголовок или текст. Более подробно описано в черновике документа здесь (английский язык).

FID — измеряет время отзывчивости вашего сайта. Чем этот показатель ниже, тем больше у посетителей уверенности, что с вашим сайтом можно взаимодействовать. В новом PageSpeed этот параметр заменят на TBT (Total Blocking Time), который вычисляет блокировку содержимого сайта.

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

Все эти показатели можно уже сейчас тестировать в новой версии Lighthouse 6 для PageSpeed:

Что еще интересного приготовили в Google

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

Молниеносный определитель скорости сайтов

Для простоты определения скорости загрузки страниц, компания выпустила новый тип расширения для браузера web-vitals-extension. Это расширение для Chrome (в Яндекс.Браузер тоже можно) позволяет определить достаточно ли быстрая страница, на которой вы находитесь.

Выглядит это так:

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

Зеленый или красный. При клике на зеленый квадрат выпадает окно с конкретными цифрами замера:

Как установить web-vitals-extension в браузер

Для продвинутых пользователей опишу процесс установки:

  1. Зайти на официальный репозитория Chrome.
  2. Скачать архив с кодом из раздела инсталляция.
  3. Распаковать архив, убедиться, что папка называется "web-vitals-extension-master".
  4. Открыть страницу расширений в браузере chrome://extensions.
  5. Включить режим разработчика.
  6. Перенести папку web-vitals-extension-master в любую область окна.
  7. Не удалять папку или файлы из папки загрузки.

Готово. Теперь открывайте любой сайт и смотрите, каким цветом сигнализирует вам квадрат.

Если у вас возникнут любые сложности с этим — смело пишите мне в личные сообщения, помогу.

Планы Google 2021

Как заявлено в пресс релизе компании, Гугл инвестирует внимание в Core Web Vitals и на данный момент мониторит три важные параметра. Постепенно Core Web Vitals будет обновляться и пополняться новыми метриками, которые уже есть в разных отчетах и тех, которые еще в разработке.

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

Выводы

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

Мы в loading.express не только измеряем сайты из разных городов России, но и разработали систему автоматических проверок, с помощью которой можно знать в любой момент времени скорость загрузки вашего сайта.

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

Другие статьи автора:

0
52 комментария
Написать комментарий...
Денис Русланович

У меня постоянно проблема lcp, причем при ручной проверке зеленая зона, а в серчконсоли все равно желтое и красное.
Мне кажется, что это самый странный показатель из всех метрик скорости.
Я научился решать проблему тем, что вывожу на первый экран минимум информации - revalin.com, aerosfera.com.ua, считай выводим заголовок, а остальное сбиваем ниже. Если даже кнопку/фото чуть выше поднять, на первый экран - все, беда, приплыли в красную зону.
Через год, после выпуска этого требования, встречали более адекватные способы обойти эту проверку? Например, на сайте клиента anga.ua мы не можем добиться нормальных показателей, колдуем уже не один месяц. Получается, что нужно убирать все картинки, и фоны.... беда... 

Ответить
Развернуть ветку
Алексей из LOADING.express
Автор

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

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