Keynotes Summit/2020: Производительность и пользовательский опыт для Интернета завтрашнего дня

Во время саммита WP Engine 2020 Мария Моева, менеджер по продуктам в Google, обсуждает будущее Интернета и важную роль, которую должны играть в нем конфиденциальность, скорость и повышение качества обслуживания пользователей. Узнайте о таких инструментах, как AMP, Site Kit и Web Stories для WordPress, которые можно использовать для оценки и повышения производительности вашего сайта WordPress.

Слайды с сессии

Мария Моева, менеджер по продукту Google, рассказывает :

• Как Google очень тесно сотрудничает с WordPress, WP Engine и сообществом для продвижения и поддержки экосистемы WordPress.
• Делимся мнениями о трех ключевых способах, которыми Google помогает поддерживать процветание и здоровье Интернета и делать его полезным завтра:
  • Скорость и производительность: определяйте метрики, соответствующие пользовательскому опыту, и делитесь ими с сообществом в действенной форме.
  • Превосходное взаимодействие с пользователем: убедитесь, что владельцы сайтов и конечные пользователи получают самую актуальную информацию из продуктов Google в нужное время и в нужном контексте.
  • Конфиденциальность и безопасность : разработать новую модель поддержки экосистемы с соблюдением конфиденциальности пользователей.

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

Полный текст расшифровки

[00:00:00.03]

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

[00:00:09.08]

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

[00:00:21.03]

Но для того, чтобы смотреть вперед, давайте сначала осмотримся, где мы сейчас находимся? А как выглядит веб-ландшафт?

[00:00:27.07]

Платформы CMS становятся все более важными для успеха Интернета.

[00:00:32.03]

Мы наблюдаем устойчивый рост общего процента сайтов, созданных на платформах CMS.

[00:00:37.08]

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

[00:00:44.04]

И мы в Google тесно сотрудничаем с рядом платформ CMS, чтобы сохранить

сеть здоровая и частная.

[00:00:51.02]

И, конечно же, мы стремимся тесно сотрудничать с WordPress и сообществом для продвижения и поддержки экосистемы WordPress.

[00:00:59.04]

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

[00:01:12.03]

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

[00:01:23.01]

И мы предлагаем их всем в каталоге плагинов WordPress.

[00:01:26.09]

И последнее, но не менее важное: мы активно взаимодействуем с сообществом, выступая и спонсируя различные мероприятия, такие как различные WordCamps в Европе, Азии и США, а также локально в небольших городах и другие отраслевые мероприятия.

[00:01:41.06]

И когда дело доходит до WP Engine, у нас также есть процветающие отношения, которые охватывают все те же области, которые я только что упомянул, когда речь идет о WordPress.

[00:01:51.01]

Например, платформа WP Engine теперь предлагает оптимизированные для вычислений виртуальные машины Google Cloud Platform, что позволяет резко сократить время выполнения сервера.

[00:02:01.00]

Например, сайт boardingarea.com, перешедший на эту новую инфраструктуру, сразу же увидел снижение backend_processing_times, что привело к повышению производительности сайта на 40%.

[00:02:13.00]

Ключевые плагины, такие как плагин AMP и Site Kit, представлены в Центре решений WP Engine, а Genesis Framework совместим с AMP, помогая клиентам создавать высокопроизводительные и красивые сайты.

[00:02:25.06]

И последнее, но не менее важное: мы собираемся вместе на ключевых мероприятиях, таких как вечеринка WP Engine в WordCamp US или здесь сегодня.

[00:02:34.04]

Помимо важности платформ CMS в Интернете, мы не можем игнорировать один фактор: всего за несколько месяцев мир резко изменился во всех сферах деятельности из-за пандемии COVID-19.

[00:02:46.09]

Это коснулось и сети. Некоторые сайты испытывают перегрузку посещений и трафика, другим пришлось временно приостановить работу.

[00:02:57.07]

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

[00:03:05.01]

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

приоритет с нашей точки зрения.

[00:03:12.08]

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

[00:03:22.07]

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

[00:03:32.08]

Есть три области, которые мы считаем критическими.

[00:03:35.08]

Убедиться, что сайты работают быстро, высокоэффективно и доступны.

[00:03:39.09]

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

[00:03:46.00]

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

[00:03:53.04]

Итак, что я хотел бы сделать сейчас, так это рассказать вам, что мы в Google делаем для каждой из этих областей и как мы можем работать вместе.

[00:04:01.01]

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

[00:04:15.06]

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

[00:04:26.04]

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

[00:04:38.05]

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

[00:04:49.00]

Итак, начнем со скорости и производительности.

[00:04:51.07]

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

[00:05:02.00]

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

[00:05:12.01]

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

[00:05:18.08]

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

[00:05:33.06]

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

[00:05:45.02]

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

[00:06:00.09]

Мы стремились измерить эти три атрибута и рады представить их вам и получить ваши отзывы.

[00:06:06.03]

Итак, давайте посмотрим. Это новые показатели, основные веб-жизненные показатели.

[00:06:12.03]

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

[00:06:30.06]

Наша цель — помочь владельцам сайтов оценить и улучшить взаимодействие с пользователем в Интернете.

[00:06:35.03]

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

[00:06:49.02]

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

[00:07:01.08]

Эта метрика представляет собой сочетание большого количества исследований и разработки метрик. Его предшественниками являются такие показатели, как индекс скорости и первая значимая краска.

[00:07:11.03]

LCP стремится захватить, когда самый большой элемент контента виден в области просмотра браузера. Основные факторы, такие как время отклика сервера, время блокировки CSS и время загрузки вспомогательных ресурсов ресурсов, влияют на LCP. И он доступен как в лабораторных, так и в полевых наборах данных.

[00:07:32.02]

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

[00:07:47.00]

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

[00:07:56.04]

Решения по улучшению этого показателя включают в себя такие вещи, как предварительная загрузка JavaScript, разделение кода и так далее.

[00:08:03.06]

Все, что превышает 300 миллисекунд, воспринимается пользователями как плохой опыт. И все, что превышает 100 миллисекунд, — это хорошо.

[00:08:14.01]

И последнее, но не менее важное: Cumulative Layout Shift или CLS. Здесь на слайде вы можете увидеть пример того, что происходит, когда эта метрика не особенно хороша.

[00:08:24.03]

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

[00:08:32.09]

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

[00:08:47.08]

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

[00:08:57.04]

Оценка смещения макета является продуктом двух показателей этого движения. Фракция удара и фракция расстояния.

[00:09:04.04]

Другими словами, вы измеряете, сколько контента на самом деле переместилось и как далеко оно продвинулось.

[00:09:11.00]

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

[00:09:18.09]

CLS можно измерить как в полевых условиях, так и в лаборатории, как и в случае с Largest Contentful Paint.

[00:09:24.04]

Тогда как простая задержка, как я уже говорил, бывает только в поле.

[00:09:30.01]

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

[00:09:46.05]

И, конечно же, когда мы говорим о производительности, нужно помнить одну вещь: нам нужно упомянуть AMP Framework.

[00:09:53.06]

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

[00:10:03.05]

Чтобы привести вам всего несколько примеров, AMP автоматически позаботится о таких вещах, как ленивая загрузка некритического контента.

[00:10:10.02]

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

[00:10:17.05]

И это дает пользователю лучшее представление о важности сайта. Также он оптимизирует отслеживание вашего сайта.

[00:10:24.01]

С помощью компонента аналитики AMP вы можете один раз измерить поведение и взаимодействие с вашим сайтом, а затем эффективно передать их многим аналитическим серверам.

[00:10:35.02]

И, наконец, он также позволяет создавать адаптивный дизайн так же легко, как добавлять атрибуты в теги HTML.

[00:10:42.08]

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

[00:10:52.05]

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

[00:10:57.09]

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

[00:11:08.07]

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

[00:11:28.02]

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

[00:11:36.05]

Мы можем предложить им интуитивно понятные, простые для понимания и действенные предложения по улучшению и росту.

[00:11:44.06]

Мы использовали эти отзывы, чтобы определить руководящие принципы при создании продуктов. Например, плагины для WordPress, такие как Site Kit.

[00:11:52.08]

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

[00:12:09.08]

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

[00:12:24.01]

Хорошим примером применения этих принципов на практике является Site Kit. Это официальный плагин Google для WordPress.

[00:12:30.05]

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

[00:12:40.09]

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

[00:12:50.00]

Подход к предоставлению правильной информации и контекста действительно нашел отклик у владельцев сайтов WordPress.

[00:12:55.09]

С момента запуска в ноябре 2019 года мы наблюдаем очень сильное органическое внедрение, и в настоящее время у нас более 400 000 активных установок, и мы продолжаем неуклонно расти каждый день.

[00:13:09.06]

Итак, что же такого особенного в Site Kit? Он был разработан, чтобы улучшить трение в начале путешествия по паутине.

[00:13:16.06]

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

[00:13:29.05]

С разрешения пользователя Site Kit может позаботиться об этом от его имени и устранить узкие места в первые моменты отправки сайта и подключения нужных учетных записей продуктов.

[00:13:42.04]

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

[00:13:51.08]

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

[00:14:01.03]

Это также возможность объединить информацию из нескольких продуктов в представление.

[00:14:06.06]

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

[00:14:13.01]

Итак, это три статистических данных, которые были получены из информации P speed, акцентов и аналитики, и мы объединили их, чтобы дать пользователю представление о том, что происходит.

[00:14:23.00]

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

[00:14:36.02]

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

[00:14:50.01]

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

СМИ, по крайней мере, еженедельно.

[00:15:05.04]

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

[00:15:16.08]

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

[00:15:25.03]

Истории — это веб-страницы, которые можно увидеть везде, где можно увидеть веб-страницу, но мы в Google делаем все возможное, чтобы они сияли.

[00:15:34.07]

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

[00:15:44.01]

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

[00:15:59.04]

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

[00:16:08.06]

Истории занимают довольно много места в ленте, и если вы коснетесь одной из них, вы попадете прямо в историю издателя.

[00:16:16.06]

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

[00:16:23.01]

Мы хотим помочь владельцам сайтов на WordPress получить более легкий доступ к формату Stories. Итак, мы создали обновленный плагин Stories for WordPress.

[00:16:33.01]

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

[00:16:39.02]

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

[00:16:54.04]

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

[00:17:01.08]

А если вы хотите узнать об этом еще больше, вы можете посмотреть сессию

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

[00:17:15.07]

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

[00:17:29.07]

Вы, наверное, видели заголовки о планах Chrome прекратить поддержку сторонних файлов cookie.

[00:17:35.03]

Но видение шире и детальнее, чем можно предположить из заголовков.

[00:17:40.06]

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

[00:17:55.05]

Веб-сообщество должно делать больше для поддержки конфиденциальности и выбора пользователей.

[00:18:01.03]

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

отслеживание в сети.

[00:18:15.04]

В первую очередь речь идет о сторонних файлах cookie и скрытых методах отслеживания, таких как снятие отпечатков пальцев.

[00:18:21.05]

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

[00:18:31.07]

И ни один из этих механизмов не является закрытым по умолчанию.

[00:18:36.02]

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

[00:18:45.08]

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

[00:18:55.01]

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

[00:19:08.03]

Кроме того, он обеспечивает доступ к сторонним файлам cookie через защищенные соединения. В апреле Chrome временно отменил изменения файлов cookie SameSite, чтобы обеспечить стабильность и не отвлекать веб-сайты, предоставляющие основные услуги во время кризиса COVID-19. Это развертывание возобновилось совсем недавно.

[00:19:29.07]

Во-вторых, мы выступаем за открытые и совместные усилия по разработке новых веб-стандартов конфиденциальности. Это инициатива Privacy Sandbox.

[00:19:39.09]

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

[00:19:55.00]

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

[00:20:08.06]

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

[00:20:19.01]

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

[00:20:26.06]

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

[00:20:47.03]

Вместе мы можем сделать Интернет безопаснее, быстрее и приятнее как для конечных пользователей, так и для владельцев сайтов. Спасибо.