SEO - АМР Ускоренные мобильные страницы

AMP (Accelerated Mobile Pages, ускоренные мобильные страницы) - проект Google, запущенный в октябре 2015 года. Это просто веб-страницы, но в их основе находится AMP HTML, формат для максимального ускорения загрузки на телефонах и любых мобильных устройствах с медленным интернет-соединением.

Ускоренные мобильные страницы (АМР) - это технология с открытым исходным кодом. Она появилась, поскольку издатели сайтов и производители технологий часто возвращались к идее о том, что экосистема мобильного контента требует обновления. Это необходимо издателям, создателям платформ, авторам и пользователям.

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

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

https://www.ampproject.org/ru/support/fags/overview

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

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

То есть Google выступает в качестве огромной CDN-сети для страниц сайта. Элементы АМР-страницы подгружаются последовательно, по мере прокрутки страницы, что также повышает скорость загрузки. Рекламные баннеры от AdSense, Doubleclick и нескольких других рекламных сетей закэшируются вместе со страницей и будут показаны посетителю.

Таким образом, скорость открытия таких страниц - максимальная. Среднее время загрузки АМР-страницы - 0,7 секунды.

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

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

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

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

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

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

Следовательно, первое и самое главное отличие от стандартных сайтов - это невозможность вставки “обычных” скриптов. То есть большая часть функционала, завязанная на динамическом изменении (действия по клику, анимация, фильтрация, модальные окна), становится недоступной. Приходится полагаться на библиотеку доступных компонентов и оперировать только ими. Также есть возможность внедрять iframe.

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

Полный перечень доступных компонентов имеется здесь:

https://ambyexample.com/

Следующей особенностью АМР страниц является отсутствие обычных < img > тегов в документе. Все изображения на странице должны быть описаны в особом теге < ampimg >, что затрудняет вставку изображений пользователем через текстовый редактор. Для других элементов, где вывод изображений прописан “руками”, достаточно поправить верстку. Также, если используются карусель или lightbox, нужно вставить аналоги из компонентов. Для включения статей в подборку “Top stories google” к страницам должны быть добавлены схемы данных с краткой информацией о статьях, авторе, издательстве, логотип компании, а также даты публикации и изменения статьи.

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

Однако, даже если ваша АМР страница была правильно проиндексирована Google и помещена в кэш, она может содержать ошибки в структуре данных JSON-LD. На это валидатор АМР от Google не обратит внимания, и ваша страница, несмотря на правильное позиционирование в результатах поиска, не попадет в карусель в верхней части страницы.

https://search.google.com/test/amp?hl=ru

Структурные данные АМР-страницы валидируются отдельно - это нужно учитывать при их разработке и обслуживании. Пример схемы данных для страницы типа “статья”:

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

Есть ряд требований к логотипу:

http://developers.google.com/search/docs/data-types/article#AMPlogo

Хочу обратить внимание, что размер должен быть не больше и не меньше 60х600px хотя бы по одной из сторон. Желательно соблюдать высоту 60px (например, 450х60px). Изображения меньших размеров, но в тех же пропорциях, что и 60х600px (например, 450х45px), проверку не пройдут.

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

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

Чтобы поисковик понял, что есть АМР-версия страницы, то обычная версия страницы должна содержать ссылку:

<link rel=”amphtml” href=”https://www.example.com/url/to/amp/document.html”>

А на АМР-странице - присутствовать обратная ссылка:

<link rel=”canonical” href=”https://www.example.com/url/to/full/document.html”>

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

Так как АМР-страницы загружаются из кэша CDN Google, поэтому обновления основного сайта отображаются не сразу. Для быстрых изменений требуется принудительная переиндексация. Чтобы обновить уже находящиеся в кэше страницы, используется специальный API от Google, который позволяет переиндексировать АМР по запросу владельца сайта.

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

Суммируем все интересные особенности ускоренных мобильных страниц:

  • Формат ускоренных мобильных страниц поддерживают крупнейшие поисковики.
  • Среднее время загрузки АМР-страницы - 0,7 секунды.
  • АМР-страницы могут показываться в верхней карусели картинок.
  • Первыми АМР опробовали медиа, но сейчас активно осваивают и интернетмагазины.
  • Скоро с АМР-страниц можно будет совершать покупки.
  • Быстро обновить АМР-страницу поможет API от Google.
  • Рекламу на АМР-страницах поддерживают популярные платформы.
  • За ошибками АМР-страниц можно следить в Google Search Console.
  • Для аналитики АМР-страниц лучше использовать отдельный ресурс в Google Analytics.
  • В фреймворке АМР предусмотрен инструментарий для А/В тестирования - можно выбрать лучший дизайн.
  • Идеально подходит для статического контента, например, новостных сайтов.
  • Страницы, которые используют актуальную версию АМР, будут показаны в виде предварительного просмотра в “Топ историй”, помимо других результатов мобильной выдачи. Данная технология - это огромное преимущество перед конкурентами, которые ее еще не внедрили.

Недостатки АМР:

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

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

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

Базовых настроек, впрочем, достаточно много, можно включать/отключать отдельные блоки контента, прописывать свой CSS, настраивать меню.

На картинке показаны 2 новые области меню, доступные в АМР страницах.

Немного “кастомизировать” стандартный вывод позволяют несколько виджетов, позволяющие добавлять контент как на главную АМР-страницу, так и в отдельные новости. Вот пример виджетов:

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

Имеет ли смысл использовать АМР?
Выбор, конечно, за вами, конечно, но я думаю, что вряд ли буду применять на небольших сайтах. И вот почему:

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

2. Все эти АМР страницы крутятся вокруг 3G мобильной сети с ее низкой скоростью загрузки. Следовательно это технология временная, поскольку с развитием покрытия экономия в скорости станет несущественной (https://4gfaq.ru/karty-pokrytia/). И технология либо переродится, либо вымрет как WAPсайты.

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

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

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



Copyright 2018 SEO-MOB.ru