Зачем вам нужен AMP Google И нужен ли

Айти блог

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

В этом есть смысл — Если многие посетители вашего сайта просматривают ваш сайт с помощью смартфонов или планшетов, подготовка вашего сайта к работе с мобильными устройствами (читай «оптимизированная для мобильных устройств»)  — хороший способ показать посетителей и, следовательно, поведенческие показатели вашего сайта. Только Google подтолкнул процесс «мобилизации» сайтов.

В октябре 2015 года, продолжая работу над оптимизацией для мобильных устройств, Google запустил новый проект, призванный сделать жизнь «мобильных» еще приятнее. пользователей)). Речь идет о технологии Accelerated Mobile Pages — Ускоренные страницы для мобильных устройств. Мы не будем вдаваться в технические подробности, а постараемся ответить на основные вопросы простым языком: как это выглядит, кому это нужно и для чего, как реализовать на своем сайте.

Примечание. Все скриншоты в этой статье были сделаны с планшета (мобильного устройства)..

Как выглядит AMP от Google.

В целом веб-сайт, использующий технологию AMP, очень похож на обычный веб-сайт. Вот пример AMP-страницы:

Ничего особенного. Более интересно то, как Google выбрал отображение страниц AMP в своей поисковой системе для мобильных устройств. Посмотрите, ищем ли мы какие-нибудь новости в Google, например, «Новости дня», тогда под строкой поиска мы увидим блок «Лучшие новости» с карточками:

Зачем вам нужен AMP Google И нужен ли

Щелкните любую вкладку, и страница выбранного сайта откроется в новой вкладке. Часто, особенно если скорость интернет-соединения не слишком высока, в течение 4-7 секунд мы видим следующую картину:

Зачем вам нужен AMP Google И нужен ли

Что придумал Google — изменится на «Главные новости» блок (обратите внимание на значок AMP):

Зачем вам нужен AMP Google И нужен ли

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

Зачем вам нужен AMP Google И нужен ли

Обратите внимание на 4 пункта (отмечены на скриншоте):

1. Мы физически не переходим на другую страницу, мы остаемся в Google, который снабжает нас содержанием выбранной страницы.

2. Получается слайдер. Мы можем проводить пальцем влево и вправо, чтобы быстро переключаться между содержимым других страниц AMP в блоке «Лучшие новости».

3. Мы можем использовать эту кнопку, чтобы вернуться на страницу поиска.

4. И самое главное — содержание AMP-страницы отображается здесь буквально за доли секунды.

Выглядит отлично. Теперь ложка дегтя:

Классно смотрится.

Пока этот AMP-слайдер отображается только на google.com, русская версия — нет. Мы ждем.

Для тех, кто хочет заполучить русскоязычный дисплей со страницами AMP, вот инструкции:

Для начала мы готовы для вас. На планшете или смартфоне перейдите в. Это откроет поиск Google, но с уже включенной поддержкой AMP. Введите «новости дня» (или просто «новости») — выгода! В блоке «Главные новости» вы увидите «AMP». карты, жми и наслаждайся)).

Еще одна деталь:Если Google не нашел достаточного количества AMP-страниц, соответствующих вашему поисковому запросу, эти карточки отображаться не будут. Например, для запроса «новости спорта» пока ничего подобного нет.

Кому нужны страницы AMP

Полезность AMP-страниц можно оценить двояко:

1. Если посмотреть с точки зрения пользователя, такие «быстрые» Отображение контента непосредственно в результатах поиска (без необходимости ждать и перемещаться по страницам) — отличное решение для людей, которые привыкли получать информацию в основном на мобильных устройствах. И это число растет с каждым днем.

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

Итак, если ваша компания занимается продажей автомобильных шин, поэтому перевод описания продуктов в AMP не имеет абсолютно никакого смысла. Однако, если вы ведете блог с уникальными статьями на различные темы, связанные с автомобильной промышленностью, стоит добавить в него версию AMP. Как видно на снимках экрана выше, вкладки с соответствующими страницами AMP отображаются вверху результатов поиска — Разве это не сбывшаяся мечта каждого владельца сайта?

Рассчитайте стоимость добавления и настройки облегченных мобильных страниц для Яндекс и / или Google.

Как работает AMP.

Теперь, когда мы показали вам, как это выглядит, мы можем кратко поговорить о том, как это работает.

По сути, AMP — это просто еще один набор скриптов и правил для отображения веб-страниц. Например, в веб-разработке давно используется набор скриптов под названием jQuery — это означает, что кодировщику не нужно каждый раз заново программировать ползунки или, скажем, модальные окна. Кодировщик просто берет код из библиотеки и настраивает его настройки для конкретного сайта.

Но проект AMP имеет несколько отличий от существующих библиотек:

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

2. Код написан максимально быстро (используются только асинхронные сценарии, если это вам что-то говорит).

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

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

Однако этого достаточно для отображения содержимого. Вот еще один пример страницы AMP:

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

Еще одна важная функция, которую мы рекомендуем вам использовать для расширения нашего предложения.

И еще одна важная особенность проекта AMP:
При индексировании страниц AMP Google сохраняет (кеширует) их контент на своих серверах. Поэтому, когда вы нажимаете вкладку AMP-страницы в поиске Google:

Зачем вам нужен AMP Google И нужен ли

Google не будет извлекать его с сервера Lenta.ru (что может занять много времени, если вы, например, в настоящее время находитесь в Австралии), но он будет извлекать контент с ближайшего к вам сервера.
Вот что Tefal Google думает о нас и пытаетсякак можно скорее доставить контент пользователю.

AMP — третье место в списке

Обратите внимание, что AMP — это не замена обычных html-страниц или мобильной версии сайта, это надстройка. Возьмем пример.

Давайте посмотрим на новостной портал lenta.ru и следующую статью:

Зачем вам нужен AMP Google И нужен ли

Это стандартная страница сайта с контентом, раскрывающимся меню, дополнительными статьями по теме, поиском, «Топ», рекламными кнопками, кнопками социальных сетей, различными системами статистики и т. д.

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

Поэтому у lenta.ru есть мобильная версия сайта для мобильных устройств с меньшим количеством дополнительного контента (и чуть меньше рекламы):

Зачем вам нужен AMP Google И нужен ли

Теперь у lenta.ru есть 3-я версия этой же страницы в формате AMP:

 

Зачем вам нужен AMP Google И нужен ли

Еще меньше дополнительных скриптов (без рекламы, хотя вы можете вставить их в AMP), только контент.

Как сосуществуют эти три версии одной и той же страницы?
Как могут сосуществовать эти три версии одной страницы?

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

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

Версия AMP обозначается тегом "link rel = "amphtml"" в коде домашней страницы:
"link href = "http://m.lenta.ru/news/2016/01/16/falcon/ amp / "rel =" amphtml "/ ".

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

Таким образом, lenta.ru предоставляет 3 разные версии одной и той же страницы для разных типов аудитории (версии различаются по функциональности, но остается неизменным только основной контент).

Это важно: просто показать ту же страницу в слайдере AMP в том же месте.

Важно! Все три страницы содержат тег "link rel = "canonical"" с адресом домашней страницы, чтобы избежать дублирования контента:
" link href = "http://lenta.ru/news/2016/01/16/ сокол / "rel =" canonical "/ "

Внедрение AMP на сайт.

Создать AMP-версию вашего сайта несложно (с помощью обученного специалиста). Достаточно создать отдельный шаблон для сайта, используя необходимые z-теги. Затем либо вручную сделайте AMP-версию каждой новой страницы по готовому шаблону. Вы также можете настроить автоматическое создание AMP-страницы с помощью вашей CMS.

Тем, чьи веб-сайты основаны на WordPress, ждет настоящее удовольствие, последняя версия этой системы уже включает поддержку шаблонов AMP.

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

ИТОГ

— amp — Это новинка, которая направлена ​​на ускорение зарядки контента на мобильных устройствах.Дело вполне специализировано, для тех, кто зарабатывает на содержании.

— активно поддерживается только Google. В российской версии поиска Google страница AMP еще не включена (хотя это только вопрос времени).Но соотношение Яндекса к страницам AMP неизвестно.

Оцените статью