2 июля 2018

AMP Google – инструмент №1 для ускорения загрузки сайта до 1 сек!

10 минут на прочтение

Мобильная версия вашего сайта загружается более 3 секунд? Вы теряете 50% клиентов.

В курсе ли вы, что загружающийся 3 секунды сайт – это очень долго? Более половины пользователей не охотно дожидаются завершения и уходят с такой страницы. Это кажется абсурдным, но это факт. Что уже говорить про среднее время, необходимое для открытия мобильного ресурса на 3G соединении…19 секунд!

Падение с небоскреба бесконечное кол-во секунд

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

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

Что собой представляет AMP Google?

Accelerated Mobile Page – ускоритель для загрузки мобильных страниц сайтов.

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

Моб страница без всего ненужного

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

Google AMP – вовсе не Гугл

АМР – технология, предназначенная не для одноименной поисковой системы, а для Интернета в целом. Браузер поддерживает данное ПО, но не имеет над ним контроль.

лисичко браузер

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

Как выглядит АМР?

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

Как выглядит страница AMP в поиске

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

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

Кому и почему надо пользоваться Google AMP?

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

Скорость

Официальный АМР-сайт определяет три основных группы интернет-бизнесов, на которые направлена его работа:

  • Для издателей.
  • Для рекламодателей.
  • Для технологических ресурсов (платформы SSP, DSP и аналитические сервисы).

Интернет-магазины и АМР

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

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

АМР и его влияние на конверсию

По какой причине пользователь закрывает страницу еще до того, как она загрузилась? Мы вводим определенный запрос, ждем его отображения, но не получаем заявленного результата, поскольку веб-ресурс «зависает» в режиме «подождите, пожалуйста». Естественно, когда ожидания не оправдываются, мы уходим отсюда.

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

К примеру, вы ищите велосипед. Вы только присматриваетесь, зачем тогда на этапе выбора надо кнопки «корзина», «купить» или кнопка детализированной фильтрации? С Гугл АМР на данной стадии будет отображаться только список (листинг) товаров и самые ключевые фильтры: «городской велосипед», «детский», «горный» и т.п. с несколькими самыми востребованными позициями.

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

Уборка лишнего

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

Отсюда вытекает главное достоинства АМР Google: сделать первый контакт с вашим сайтом максимально эффективным и сохранить покупателя. Чем оперативнее произойдет соединение, тем выше будет и конверсия.

Почему так важно использовать Google АМР?

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

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

Данные против

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

АМР не допустит такого, поскольку платформа предполагает асинхронную прорисовку ресурсов, а также отображение при помощи кэширования информации. Элементы прорисовываются еще до загрузки и не «скачут» по дисплею.

Принцип работы Гугл АМР

Скорость отображения сайтов на мобильных устройствах увеличивается в силу сокращения объема информации:

  • HTML сжимается до допустимого минимума;
  • JavaScript строго ограничиваются в использовании;
  • CSS кастомы вообще блокируются.

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

робот доволен

Глобальный кэш – дополнительный элемент, придающий скорости. Контент будет размещаться максимально близко к месту его потребления. Алгоритм процесса выглядит следующим образом:

  • HTML Гугл АМР загружается в кэш.
  • Используемый юзером ресурс обращается к кэшу и отображает данные уже с него.
  • Платформа отображается практически моментально прямо с гугловской страницы выдачи.

Преимущества использования АМР

  • Страница прогружается в среднем за 0,7 секунд;
  • Страницы открываются в 4 раза быстрее, чем без инструмента;
  • Размер передаваемой пользователю информации сокращается в 10 раз.

Как установить AMP Google на свой сайт?

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

Сделать это можно таким образом:

  • Создается обычный файл, связанный тегом канонической ссылки с основной информацией.
  • На уже существующей странице необходимо связать АМР-страницу с канонической, указав, что одна основная, а вторая – АМР.
  • При создании ресурса «с нуля» достаточно указать АМР-ссылку на себя же, наделив ее ролью канонической.

Внимание: данная информация предназначена для разработчиков, понимающих HTML. Дилетанты и доморощенные программисты внедрить АМР не смогут или сделать это будет довольно проблематично.

Пример внедрения АМР Гуглу предоставил ресурс Lenta.ru в виде кейса для того, чтобы другие пользователи представили масштаб работ и смогли оценить свои возможности. У данной компании все манипуляции заняли 12 дней, но дали потрясающие результаты.

Для этого потребовалось:

  • Создать новые пути в БД для предварительно созданных АМР.
  • Прописать новые шаблоны под страницы для размещения контента.
  • Заново переписать CSS, чтобы уложиться в ограничения по трафику.
  • Создать систему для вставки мультимедиа.
  • Интегрировать в страницу макроразметку для новостей.
  • Разрешить доступ для Google Analytics.

В итоге:

  • Страницы стали загружаться в 2 раза быстрее.
  • Посещаемость сайта выросла в 18 раз.

И напоследок

Создаете всякие «навороченные» фишки для своего сайта? Помните о «правиле 3 секунд» для его юзеров. Политику компании Гугл взывает ко всем разработчикам, чтобы они писали страницы, бережно относящиеся к мобильным гаджетам пользователей, а именно предоставляли аудитории именно то, за чем она обратилась.

правило 3 секунд

Напоминаем о значимости АМР:

  • Ресурс открывается на устройстве за 1 секунду
  • Благодаря глобальному кэшированию сайт не прервет соединение и продолжит работу, даже при разрыве интернет-соединения
  • АМР – это первый быстрый контакт с пользователем. Далее – дело за мобильной версией вашего сайта и ее привлекательностью для целевой аудитории.
(Visited 126 times, 3 visits today)
Егор Кольнобрицкий
CEO & Founder
1 звездочка2 звездочки3 звездочки4 звездочки5 звездочек (1 голос, средний бал: 5,00 из 5)
Загрузка...
Рекомендуем вам похожие статьи
Комментарии
Подпишитесь на канал Цепкие Клешни в Telegram
 
Будьте в курсе актуальных новостей по маркетингу, продажам и полезным инструментам

 
close-link