Легкие страницы на базе AMP: как «Ситилинк» увеличил конверсию в покупку из органической выдачи Google

«Ситилинк» – одна из крупнейших сетей магазинов электроники и бытовой техники. В продуктовом портфеле порядка 800 мировых брендов и 70 000 наименований товаров.

Перед командой в 2019 году стояли важные задачи:

В рамках новой стратегии продвижения под мобильные устройства было решено отказаться от отдельной мобильной версии на базе SPA (Single Page Application) в пользу адаптивного (responsive) решения — это должно было увеличить охват страниц сайта для пользователей, которые заходят в интернет-магазин с мобильных устройств.

Отдельная мобильная версия на базе SPA поддерживала только часть страниц десктопного сайта и не давала возможность оптимизировать страницы под SEO. К тому же индексирование в поиске Google с 1 июля 2019 – с приоритетом мобильного контента.

Следующий вопрос заключался в повышении эффективности посадочных страниц веб-сайта. Как их переработать, чтобы получить максимальный эффект: снизить расходы и увеличить конверсию (и, соответственно, прибыльность)?

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

На случай, если кому-то понадобятся основания для доказательства влияния скорости на конверсии (например, для внутреннего бизнес-кейса), вот немного исследований:

https://www.thinkwithgoogle.com/marketing-resources/data-measurement/mobile-page-speed-new-industry-benchmarks/

https://unbounce.com/page-speed-report/

https://www.akamai.com/uk/en/multimedia/documents/brochure/akamai-10for10-brochure.pdf

Технология позволяет на базе специальных AMP-компонентов создавать облегчённые версии страниц сайта (некий superset HTML + JS). Из основных плюсов стоит отметить, например, то, что валидные AMP-страницы кэшируются Google в органической выдаче и в поисковой рекламе, благодаря чему скорость загрузки становится практически моментальной.

Фреймворк уже был знаком нашей IT-команде, так как «Ситилинк» стал одним из первых игроков российского рынка электронной коммерции, освоившим AMP. С технологией команда познакомилась на AMP-хакатоне Google в 2017 году (одном из первых в своём роде) и создала пробный набор лендингов буквально за 2 недели. На тот момент это был просто набор статических лендингов с динамической подгрузкой контента с помощью компонентов , который не соответствовал по функционалу десктопного или даже мобильного сайта (напомним, что его функционал не был полноценным в сравнении с десктопным), и требовал существенной доработки.

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

Соответственно, вслед за запуском адаптивного веб-сайта с новым дизайном (и, как следствие, отказа от использования отдельной мобильной версии), AMP также был перезапущен и существенно доработан – как в плане дизайна, так и в плане функционала:

Все задачи, которые мы поставили себе в 2019 году были выполнены:

Да, AMP стал для нас отличным решением, обеспечившим великолепные результаты, но были и некоторые подводные камни (о которых, к слову, нас предупреждали Google, но были и такие, о которых мы узнали в процессе реализации). Те, кто уже когда-либо внедрял AMP, наверное, уже понимают, к чему подвожу... да-да, аналитика.

В конце 2018 в WebKit появился ITP 2.0, привнесший новые правила обработки файлов cookie 3P-доменами, а за WebKit’ом вскоре последовали все ключевые игроки браузерного рынка, ужесточив уже свои правила обработки cookie - фактически, для AMP это означало, что сессии между кэшом Google, из которого загружались открытые в поисковой выдаче Google AMP-страницы, и веб-сайтом, переставали “склеиваться” в аналитике - для того, чтобы обеспечить непрерывность сессий, в AMP появился так называемый AMP Linker, но из-за сложности нашей конфигурации аналитики (не обошлось и без некоторого количества legacy-кода скриптов Measurement Protocol’а, мешавших отправке корректных Client ID) нам понадобилось около двух дополнительных месяцев на полноценную настройку и внедрение.

Здесь могу добавить спасибо специалистам Google, которые оперативно переработали опыт работы с AMP Linker’ом в подробную инструкцию по объединению сессий из AMP в GA и GTM -- теперь достаточно просто пошагово ей следовать, и у вас все получится :)

Вот и все, если вы используете GA в качестве основного аналитического инструмента, то сегменты AMP нужно строить по Data Source: AMP, но это уже совсем другая история… :)