Если ваш мобильный сайт загружается дольше пяти секунд, ваша компания теряет 50% потенциальных покупателей. В этой статье мы рассмотрим сценарий, позволяющий оптимизировать процесс загрузки мобильной версии web-проекта при условии подключения даже к самой плохой сети (речь идет о сокращении периода загрузки до 1 секунды).

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

Принцип функционирования AMP

Технология способствует «урезанию» кода на 90%, благодаря чему страницы становятся более компактными (результат – повышение скорости функционирования).

Преимущество подключения к AMP: технология полностью воспроизводит структуру и содержание основного web-раздела в рамках минимальной отдачи кода браузеру. Определить мобильную страницу в выдаче поисковиков можно по значку с молнией.

Для чего и кому нужна AMP

До недавнего времени технологией могли воспользоваться только представители сферы медиа (всё логично: для новостных ресурсов скорость – это базовое конкурентное преимущество). Сегодня AMP охватывает основные 4 бизнес-направления:

  • интернет-магазины
  • издательское дело
  • реклама
  • применение аналитических программных комплексов

Ускоренные страницы для виртуальных магазинов

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

Как ускоренные страницы влияют на конверсию

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

Особенности мобильного листинга

  • фильтры представлены в виде обычных заголовков
  • под фильтрами показывается ряд позиций в формате «небольшое изображение + название товара»
  • после того, как покупатель нажал на иконку с конкретным товаром, сайт перенаправляет его на мобильную версию web-раздела

То есть AMP в случае с интернет-магазином является фактором-посредником, который обеспечивает формирование первого (максимально быстрого) контакта клиента с брендом.

Результаты

  • уменьшение показателя отказов
  • повышение конверсии

Для чего ещё нужны ускоренные страницы

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

Принципы функционирования AMP

AMP способствует оптимизации скорости загрузки посредством уменьшения исходного потока данных.

В результате использования технологии:

  • HTML сокращается до оптимального объема
  • существенно ограничивается применение JavaScript
  • кастомные css-свойства не функционируют

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

Итоговые результаты использования AMP

  • страница загружается в течение 1 секунды
  • содержимое страницы открывается в 4 раза быстрее
  • поток данных, передаваемых посетителю, уменьшается примерно в 10 раз

Подключаем технологию к основной web-площадке

Ключевые ориентиры (отметим, что для правильного внедрения AMP вам понадобится грамотный web-специалист):

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

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

Вместо вывода

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