Технологии AMP и PWA в поиске Google – Будущее уже стало настоящим

Андрей Липатцев, Search Quality Strategist компании Google, в рамках онлайн-конференции SEO Day, рассказал о Accelarated Mobile Pages и Progressive Web Apps.

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

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

Какие же возможности открывают перед нами новые веб-технологии, такие как AMP и PWA?

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

Разница говорит сама за себя:

lipatzev_1

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

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

lipatzev_2

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

lipatzev_3

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

lipatzev_4

Выбирать нужный вам товар вы можете столько, сколько вам нужно, однако это время контролируете вы сами, оно не тратится на подгрузку контента. Вдруг вы обнаруживаете, что того, что вы хотите купить, в наличии нет. Ничего страшного. Вы тут же нажимаете на кнопку «да, я хочу получать оповещения о появлении товара» и можете быть уверены, что когда товар появится, вы тут же об этом узнаете. Не нужно подписываться на рассылки, не нужно постоянно заходить на сайт и смотреть, push notification – отличное ненавязчивое решение, которое пришлет вам уведомление на телефон сразу же, как только нужная вещь появится на складе:

lipatzev_5

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

lipatzev_6

После того, как вы получаете уведомление о том, что необходимый товар есть в наличии, нажимаете «купить», добавляете товар в корзину (не логинясь и не вводя никаких дополнительных данных), одним нажатием пальца переходите на страницу оплаты и покупаете нужный вам товар.

 

lipatzev_7

Оплата товара так же производится одним нажатием. Более того, если вам понравилось работать с этим магазином, который и знает вас, и умеет работать оффлайн, и напоминает о себе только в том виде, который вы выбираете (push notification), вам обязательно захочется запомнить его. Как это сделать? Добавив по старинке в закладки в браузере? Давайте будем честными, кто по-настоящему пользуется этими закладками? Если вам захочется, чтобы этот магазин стал частью вашего опыта на вашем умном устройстве, а не какой-то там забытой закладкой, вы можете добавить его прямо на главный экран.

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

lipatzev_8

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

О каких технологиях идет речь?

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

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

lipatzev_9

Что такое АМР?

Открытый формат для простых страниц. Технология Accelarated Mobile Pages или AMP (страницы с ускоренной загрузкой), начала внедряться в прошлом году. Сразу хочу сказать, что это не чья-то проприетарная технология, это открытый формат, в работе над которым участвуют разработчики из разных компаний. Флагманом этого проекта во многом является Google, однако, он все равно является лишь одним из участников. АМР – это не какая-то фича Google, это, если хотите, фича интернета. Именно так сейчас будут строиться быстрые веб-ресурсы. Google активно поддерживает эту инициативу, но никоим образом не контролирует ее.

Доступ к AMP Cache для оптимизации скорости. Google и другие веб-платформы предоставляют создателям контента доступ к кэшированию информации, чтобы на их платформах контент предоставлялся пользователю с оптимальной скоростью. Поэтому использование АМР – это не просто использование новой технологии, но еще и доступ к распределенной сети кэширования крупных веб-платформ.

Поддержка рекламы и аналитики. АМР это довольно просто – это HTML, сжатый до минимального необходимого объема, без всяких лишних побрякушек. Проще говоря, отсекается большой процент ненужного идиотического кода, который делает современные веб-страницы громоздкими и медленными. Это не значит, что пользуясь этим форматом, нельзя использовать какие-то рекламные или аналитические решения, все это есть, разрабатывается и внедряется.

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

Среднее время загрузки страницы в формате АМР – меньше секунды. Подумайте об этом. Вы, возможно, не так часто проверяете время загрузки своих страниц на мобильных устройствах, так вот зайдите каждый на свой ресурс и проверьте. Вы увидите, что до полной загрузки страницы часто проходит 9-10 секунд. А при использовании этой технологии, пользователи получают возможность взаимодействовать с вашим контентом мгновенно. Такие крупные организации как WordPress, например, усиленно работают над тем, чтобы их решения уже содержали внутри себя возможности создания АМР.

lipatzev_10

Что такое PWA?

Если АМР позволяет нам мгновенно начать взаимодействовать с пользователем, то PWA (Progressive Web Apps) позволяет нам продолжать взаимодействовать с ним с молниеносной скоростью, при этом вовлекать и погружать пользователя в свой бизнес-процесс легко, совершенно бесшовно и быстро.

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

• PWA реализуется в рамках защищенного протокола подсоединения, поэтому по умолчанию, любое прогрессивное веб-приложение является безопасным.

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

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

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

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

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

lipatzev_11

Среди первых, кто реализовал технологию АМР для своего ресурса, было американское издание Washington Post. Они публикуют более 1000 АМР статей в день. Скорость загрузки – 0,4 секунды, что на 88% выше, чем у их старого мобильного сайта (который тоже, в принципе, был неплохой). Это позволило изданию добиться повышения возврата пользователей на 23%. Потому что люди начали понимать, что эту газету можно просто читать, в то время как другие нужно ждать, пока они загрузятся.

Среди российских ресурсов технологию АМР внедрило у себя издание Лента.ру. Вот здесь очень интересно и подробно описывается опыт внедрения.

lipatzev_12

Вместо заключения:

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

Для любого проекта (коммерческого, некоммерческого, новостного и т.д.) сочетание технологий АМР и PWA позволяет добиться быстрого первого контакта, молниеносного взаимодействия и самое главное – удобного, доступного продолжения контакта с пользователем в любой момент, даже оффлайн. То, чего в мире веба и веб-приложений до сих пор, пожалуй, не существовало.

lipatzev_13
preview SEO-транзистор – как способ самостоятельно продвинуть свой сайт

SEO-транзистор – как способ самостоятельно продвинуть свой сайт

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

Тестируем сайт перед запуском: подробный чек-лист

Предложенный чек-лист поможет провести комплексную проверку сайта и устранить распространённые ошибки
preview Самый эффективный способ повысить качество сайта в целом

Самый эффективный способ повысить качество сайта в целом

В статье речь пойдёт о том, какую роль качество сайта играет в ранжировании, и как улучшить этот показатель
preview Как избежать дублей контента: краткий чек-лист

Как избежать дублей контента: краткий чек-лист

Дублированный контент на сайте может появляться даже без ведома владельца. О том, как не допустить подобной ситуации, пойдёт речь в статье
preview Секретные техники оптимизации PNG

Секретные техники оптимизации PNG

Сегодня на повестке дня некоторые малоизвестные техники оптимизации PNG изображений
preview Как продвигать туристический сайт или Анализируй то, сегментируй это

Как продвигать туристический сайт или Анализируй то, сегментируй это

К концу 2015 г. онлайн-продажи туров в Западной Европе составили $152 млрд. Цифры по миру достигают более $533 млрд., а к 2019 г. могут превысить $762 млрд...