Новые критерии Google: основные веб-жизненные показатели
Опубликовано: 2020-12-01Обновлено в мае 2021 г.
В SEO-маркетинге ежедневно конкурируют компании, блоги, веб-сайты и онлайн-платформы. В верхней части списка Google они хотят быть.
Из бесчисленных списков в Google 90% перечисленных сайтов никогда не попадают на первую страницу. 10% — это платная реклама, графики знаний и примерно десять органических списков. Движение между ними неравномерное. Менее 3% веб-пользователей доходят до результатов на последующих страницах.
До этого момента основными влияющими на SEO маркетинговыми механизмами были заголовки, контент, теги заголовков, ключевые слова, описания изображений, внутренние ссылки, обратные ссылки и т. д. Сосредоточившись на контроле качества, гигантском движке, Google будет учитывать новый реквизит.
Core Web Vitals должен стать определяющим компонентом технических SEO-агентств в США . Также можно ожидать, что он склонен к переопределению результатов поиска. В то время как традиционный SEO-маркетинг по существу включает в себя релевантность, удаленность и известность, Core Web Vitals будет укреплять ценность.
Оглавление
- Что такое основные веб-жизненные показатели?
- Три элемента основных веб-жизненных показателей
- Самая большая содержательная краска
- Задержка первого входа
- Совокупный сдвиг макета
- Основные веб-показатели
- Основные инструменты анализа Web Vitals
- Почему важна оптимизация Core Web Vitals
- Вывод
Что такое основные веб-жизненные показатели?
Core Web Vitals — это отдельный набор показателей, определяющих пользовательский опыт (UX) на веб-сайтах. Последний включает в себя три различных измерения скорости страницы и взаимодействия с клиентским узлом. Совокупность этих факторов будет учитываться в системе подсчета очков, которая определяет приоритет, который страница получает как листинг.
Три элемента основных веб-жизненных показателей
Самая большая содержательная краска
Наибольшая отрисовка контента (LCP) — это измерение, созданное Google для обеспечения удовлетворенности пользователей. Этот параметр больше ориентирован на производительность, чем на представление. Если страница загружается слишком долго и пользователь уходит, это считается неудовлетворительным.
Время загрузки веб-страницы и факторы взаимодействия с Google, такие как теги изображений и миниатюры видео, определяют рейтинг LCP. Фоновые изображения с элементами CSS и текстовыми элементами, такими как абзацы, заголовки и списки, также проверяются на беглость.
Причины плохого LCP
Медленное время отклика сервера
Скорость рендеринга веб-сайта зависит от времени реакции сервера. Чем медленнее сервер, тем больше времени потребуется для отображения на экране устройства.
Основным решением здесь является оптимизация вашего сервера. Кэширование ресурсов и обслуживание HTML-файлов в первую очередь ускоряет процессы обслуживания. Кроме того, рекомендуется направлять пользователей в ближайший CDN. Благодаря раннему установлению сторонних подключений задержка становится минимальной, что важно для мобильных веб-сайтов.
Блокировка рендеринга CSS и JavaScript.
Браузеры доставляют контент, анализируя разметку HTML в дереве DOM. Если синтаксический анализатор сталкивается с какими-либо внешними таблицами стилей, он приостанавливается. Скрипты и внешние таблицы стилей задерживают распространение блокирующих ресурсов, FCP и, в конечном счете, LCP.
CSS и Java надежны и могут потерять «много веса» за счет почтения, минимизации и минимизации. Программное обеспечение, доступное для сжатия Java, включает UglifyJS2, Closure Compiler и YUI Compressor. CSSnano, UNCSS и CSSO — все механизмы, способные сжимать CSS. Время оптимизации загрузки улучшится с развертыванием этих инструментов.
Плохое время загрузки ресурсов
В то время как увеличение активности CSS и JavaScript приводит к плохим результатам, другие компоненты оказываются столь же проблематичными. Элементы, негативно влияющие на LCP, — это <image>, <img> и <video>, а также компоненты уровня блока, содержащие текстовые узлы.
Здесь поможет оптимизация и сжатие графических и текстовых файлов. За счет предварительной загрузки необходимых ресурсов и кэширования ресурсов при использовании другого сервисного работника необходимое время сокращается.
Пользовательский рендеринг
Сайты, которые выполняют большую часть своего рендеринга на стороне клиента, теряют значительную долю контроля. Недостаток этого варианта становится очевидным при использовании больших пакетов JavaScript. В большинстве случаев содержимое не отображается до тех пор, пока JavaScript не завершит его рендеринг; это поставит под угрозу рейтинги LCP.
Минимизация JavaScript имеет решающее значение, и рендеринг на стороне сервера предпочтительнее, чем на стороне пользователя. Другим решением является предварительный рендеринг, который поможет оптимизировать время загрузки.
Задержка первого входа
Задержка первого ввода (FID) измеряет время от первого взаимодействия с пользователем до ответа браузера. Это решающий фактор в том, покинет ли клиент сайт или нет. Задержки обычно возникают, когда основной поток браузера занят.
Файлы JavaScript, загруженные локальными приложениями, обычно виноваты в проблемах с FID. Что происходит, так это то, что браузеры пытаются выполнить синтаксический анализ и выполнение, но возникает задержка, что приводит к невосприимчивости на конечных устройствах. Низкий рейтинг FID может свидетельствовать о том, что рассматриваемый сайт или страница непригодны для использования.
Причины плохого FID
JavaScript
Как правило, пока основной поток занят, браузер не может реагировать на взаимодействие. Интенсивное выполнение JavaScript усугубляет эту проблему, вызывая задержки в скорости загрузки.
Разбивая длинные задачи, вы можете уменьшить отставание. Кроме того, ограничение времени выполнения JavaScript должно повысить скорость отклика. Использование веб-воркеров также полезно. Это все способы оптимизации метрик сайта для взаимодействия.
Совокупный сдвиг макета
Метрика Cumulative Layout Shift (CLS) измеряет стабильность дизайна веб-страниц. Он функционирует для того, чтобы взаимодействие с клиентом протекало как можно более естественно. Веб-серферы часто сталкиваются с прерываниями или скачками при просмотре контента на сайте. Следовательно, это приводит к нарушению концентрации и создает плохой опыт.
Неудобство вызвано слабой конструкцией. Эффекты преобладают на веб-сайтах, реагирующих на мобильные устройства, и на настольных браузерах.
Отсутствие правильных элементов дизайна провоцирует визуальную нестабильность. Последнее имеет тенденцию вызывать внезапные изменения макета, часто заставляя пользователя непреднамеренно нажимать на нежелательный контент. Типичными примерами являются сайты с всплывающей рекламой.
Новый дизайн, даже если он правильно структурирован, также может замедлять работу веб-страниц. Алгоритм Google компенсирует это, допуская пропуск 500 мс, прежде чем он начнет процесс вычисления.
Распространенные причины CLS
Изображения без размеров
Исключение атрибутов размера ширины и высоты как для видео, так и для изображений приведет к низкому рейтингу. Многие люди не оставляют места для медиа, и это приводит к скачкам и сдвигам.
Решение здесь простое; всегда включают ширину и высоту. Другой вариант — поля соотношения сторон CSS. Они удобны для резервирования места на веб-сайтах. Это особенно полезно на сайтах, где размещаются объявления.
Объявления, вставки и фреймы без параметров
Реклама вносит большой вклад в проблему. Рекламные сети выбирают динамический размер, а не статический вариант, который увеличивает трафик на веб-сайты. К сожалению, это происходит за счет настольного или мобильного опыта.
Некоторые виджеты позволяют встраивать на веб-страницу такие элементы, как видео, карты и содержимое социальных сетей. Проблема здесь в том, что сайт часто не знает точного размера или состава встраивания. При отсутствии резервирования места нестабильность становится очевидной после загрузки страницы.
Предварительный расчет необходимых пространственных потребностей для встраивания или запасного участка предотвращает опасность CLS. Инструменты разработчика браузера удобны для получения высоты и ширины результата. После этого iframe будет автоматически помещаться в зарезервированное пространство каждый раз при загрузке страницы.
Динамически внедряемый контент
Недавно вставленные элементы поверх старых носителей также создают сдвиги макета. Типичными примерами являются баннеры с призывом к действию. Они не только блокируют взаимодействие, но и раздражают, а не убеждают.
Еще раз, резервируйте место. Кроме того, дизайнеры сайта могут добавить каркас пользовательского интерфейса. Последний является заполнителем, который предотвратит миграцию текста при загрузке изображения.
Веб-шрифты, вызывающие FOIT/FOUT
Загрузка и рендеринг веб-шрифтов играют важную роль в Flash of Unstyled Text (FOUT). В этом случае новый стиль заменяет запасной принт.
Дополнительным последствием является Flash of Invisible Text (FOIT), который скрывает шрифт до тех пор, пока не станет доступным новый регистр.
API загрузки шрифтов сокращает время, необходимое для получения необходимых стилей надписей, тем самым минимизируя или устраняя появление FOUT и FOIT.
Основные веб-показатели
Как уже отмечалось, три элемента Core Web Vital имеют индивидуальные измерения. Каждый из них оценивается в соответствии с различными временными стандартами.
- Хороший рейтинг LCP составляет менее 2,5 с. Google снисходительно относится ко всему, что меньше 4 секунд, но это все равно означает, что есть возможности для улучшения.
- Единицей измерения FID являются миллисекунды, и если время между вводом данных пользователем и реакцией веб-страницы падает ниже 100, это идеально. Метрика в 300 мс приемлема, но намекает на грядущие проблемы. Все, что превышает 300 мс, приводит к понижению рейтинга веб-листинга.
- Идеальное значение для CLS равно нулю. Алгоритмы Google примут значение 0,1, но, поскольку максимально допустимое значение равно 0,25, это создает слишком маленький запас для гибкости. Администрация веб-сайта также может стремиться к полному совершенству.
Основные инструменты анализа Web Vitals
- Web Vitals For Chrome похож на любое другое расширение, и некоторым может не понравиться этот вариант из соображений конфиденциальности.
- Page Speed Insight — это простой интерфейс, позволяющий переключаться между десктопными и мобильными вариантами. Результаты ПК и смарт-устройств различаются независимо от используемого программного обеспечения для анализа. Вышеупомянутое производит полевые данные реальных пользователей Google за 28 дней.
- Chrome Dev Tools и дизайн Lighthouse позволяют им отслеживать LCP и CLS. К сожалению, эта же программа не умеет измерять FID, но для этого есть TBT.
По мере распространения Core Web Vitals на сцене обязательно появится больше инструментов мониторинга.
Почему важна оптимизация Core Web Vitals
Обновление ядра Google запланировано на май 2021 года. Это означает, что с этого момента обычных сигналов SEO будет недостаточно для поддержания высокого рейтинга в Google.
Это реализация стандартного UX, выступающего за качество. Сайты, соответствующие новым критериям, не будут затронуты. Веб-страницы, которые не были изменены, обязательно почувствуют последствия, несмотря на то, насколько эффективна их SEO. Объявления со слабыми показателями Core Web Vitals упадут в рейтинге, освободив место для организаций, соответствующих требованиям.
Вывод
Устанавливая новые правила SEO-маркетинга, Google прокладывает путь к улучшениям. Стандарт Core Web Vital является первым, за ним обязательно последуют многие другие. Эти меры создают платформу для слияния новой эры Интернета с другими безупречно появляющимися технологиями. Кроме того, вы можете использовать эти советы, чтобы увеличить скорость загрузки вашего сайта.