Как настроить AMP на сайте

Множество сайтов построено с помощью CMS WordPress, поэтому есть смысл рассмотреть настройку AMP страниц для этого случая. Для наглядности мы рассмотрим несколько плагинов, которые используются чаще всего.

Чтобы настроить AMP страницы для WordPress, скачайте и установите плагин AMP. Для этого перейдите в панель управления, найдите раздел, отвечающий за плагины, и выберите подпункт «Добавить новый», как на скриншоте:

В поле поиска напишете AMP и установите плагин, который выделен на скриншоте:

Настроек дизайна в плагине немного, но все же они присутствуют:

Измените цвет фона, шрифт, отображение контента и общую цветовую схему: темная или светлая. Внесенные изменения опубликуются после сохранения.

Чтобы расширить функциональность плагина — отрегулировать дизайн ускоренных для мобильных устройств страниц, интегрироваться с системами аналитики — используйте плагин Glue for Yoast SEO & AMP. Он поможет интегрировать настройки установленного плагина вместе с плагином Yoast, который содействует SEO оптимизации сайта. Интеграция в свою очередь позволит расширить настройки AMP страниц.

Еще один плагин, который упрощает создание AMP-страниц, представлен на скриншоте:

Этот AMP-плагин, в отличие от предыдущего, не нуждается в дополнительных инструментах для настройки. Найдите его по запросу «AMP plugin» или скачайте из магазина. Установив, активируйте. Перейдите в меню настроек нового плагина.

В меню общих настроек вы cможете усовершенствовать свои AMP страницы. Например, добавить логотип, как на скриншоте, настроить мета теги title и description, интегрировать системы аналитики, включить
комментарии.

Настройки дизайна позволяют выбрать общую тему, чтобы страницы были более красочными, а не монотонными:

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

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

Перейдите в инструмент онлайн-проверки и укажите адрес своего сайта. Нажмите кнопку «Проверить». Так как вы указали каноническую ссылку на сайт, то анализатор попросит вас переадресовать тест на AMP страницы, как на скриншоте:

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

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

Как правило основные ошибки подразумевают:

• ошибки в тегах AMP HTML и атрибутах;
  
• ошибки в стилях и макетах;
  
• ошибки в шаблонах;
  
• устаревшие теги.

С каждым случаем потребуется разобраться по отдельности в зависимости от типа ошибки. Google поможет вам и приложит к анализу рекомендации.

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

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

О возможностях Турбо-страниц подробно пишет справочник:

Настройки Турбо-страниц несколько отличаются: тут необходимо создать RSS-канал. Если ваш сайт работает на WordPress, нужно скачать Яндекс Турбо — плагин, который автоматически создаст RSS-ленту согласно всем требованиям поисковика.

Настройте канал для WordPress через специальные плагины. Для партнеров Яндекс.Новостей формируются специальные RSS-каналы. Создайте RSS-канал и загрузите Турбо-страницы одним из способов:

Для других CMS есть специальные плагины, аналогичные Яндекс.Турбо.

После создания RSS-канала загрузите Турбо-страницы одним из способов:

Например, загрузите RSS-канал через Вебмастер, указывая сгенерированную плагином ссылку, в разделе «Источники»:

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

Проверьте, как работают Турбо-страницы Яндекса. В панели Вебмастера перейдите в меню «Турбо-страниц» и выберите «Источники».

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

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

Для сайтов, созданных на популярных CMS, существуют готовые решения — плагины. Они позволяют автоматизировать процесс создания AMP страниц.

После завершения настройки плагинов не забудьте проверить качество их работы. Google предоставляет инструмент, который выполняет проверку AMP страниц. Если Google обнаружит ошибки, изучите их и исправьте.Можно воспользоваться также аудитом сайта. Основные типы ошибок при настройке AMP страниц:

• ошибки в тегах AMP HTML и атрибутах;
  
• ошибки в стилях и макетах;
  
• ошибки в шаблонах;
  
• устаревшие теги.
  
  

Аналог для AMP страниц от Яндекса — Турбо-страницы. Установите специальный плагин, который генерирует RSS-канал, загрузите его через Яндекс Вебмастер или API Яндекс.Турбо-страниц.

Когда завершите настройку, проверьте, правильно ли отображается содержимое страниц с помощью предварительного просмотра. Если результат вас устраивает, запускайте показ Турбо-страниц.