У вас есть сайт на WordPress? Вам определенно стоит подумать о внедрении AMP. Мы все знаем, что количество людей, пытающихся зайти на ваш сайт с мобильных устройств, стремительно растет. Но большинство сайтов еще НЕ дружелюбны к мобильным устройствам. Именно по этой причине Google начал проект под названием AMP, чтобы убедиться, что сайты соответствуют ожиданиям пользователей. Google AMP обеспечивает более быструю загрузку страниц для мобильных посетителей. Знаете ли вы, что 1-секундная задержка в скорости загрузки веб-страницы может снизить конверсию на целых 7 процентов?
Когда кто-то заходит на ваш сайт с мобильного, чего он ожидает в первую очередь? Скорость! Да, скорость является решающим фактором. Поэтому, если вы хотите обеспечить более быструю загрузку страниц, обязательно внедрите Google AMP. В этом руководстве мы поговорим о
- Как настроить Google AMP для блогов WordPress
- Преимущества и недостатки использования AMP
- Удостоверение проблем AMP
- Лучшие плагины AMP для WordPress
Как внедрить Google AMP на блогах WordPress
Что такое Google AMP?
Google AMP, также известный как Accelerated Mobile Pages, – это мобильная инициатива с открытым исходным кодом от Google, которая была запущена для ускорения мобильного веба. Она использует специальный тип HTML под названием AMP HTML, который служит “урезанной версией” любой страницы на вашем сайте, если у вас включена функция AMP. Если кто-то заходит на ваш сайт из Google Search, Google будет кэшировать ваш AMP-контент, чтобы загрузить его еще быстрее, поскольку AMP использует AMP HTML, JavaScript, CDN и т.д. для доставки “урезанной версии” вашего сайта поисковикам с мобильных устройств. Возможно, вы уже знакомы с AMP-страницами. Видели ли вы значок молнии в левой части некоторых результатов поиска Google на мобильных устройствах? Вот как это выглядит;
Как вы можете видеть выше, страницы с поддержкой AMP четко обозначены значком молнии и надписью AMP. Когда страница обслуживается через AMP в Google, рядом с ней будет символ AMP (значок молнии). Они содержат основную часть страниц, и именно по этой причине они быстрее загружаются на мобильных устройствах.
Преимущества Google AMP. Существует масса преимуществ внедрения Google AMP на сайтах WordPress.
- Более быстрое время загрузки (AMP-страницы загружаются в среднем на 88% быстрее, чем их мобильный сайт без AMP)
- Более быстрое время загрузки всегда ведет к лучшему вовлечению пользователей (кому не нравятся быстро загружающиеся страницы?).
- Значительно снижает показатель отказов (благодаря более быстрой загрузке страниц)
- В конечном итоге улучшает ваше мобильное ранжирование
- Повышение конверсии для сайтов электронной коммерции
- AMP – это бесплатный проект с открытым исходным кодом
- Автоматическая оптимизация изображений
Кроме того, AMP наиболее полезен для неинтерактивного контента. Если ваш сайт требует слишком много взаимодействий, урезанные стандарты кода AMP, скорее всего, повлияют на него. Но если ваш сайт в основном “читают” ваши пользователи, то беспокоиться не о чем, потому что AMP – это хороший способ увеличить скорость ваших веб-страниц без потери функциональности. Так что да, есть масса преимуществ внедрения Google AMP в WordPress-блоги.
Как настроить Google AMP на WordPress
Давайте теперь поговорим о том, как вы можете внедрить Google AMP в WordPress-блоги.
Используйте плагины AMP для WordPress
WordPress – это система управления контентом (CMS) №1 в мире не просто так: она предлагает вам тонну невероятных плагинов. Существует несколько AMP-плагинов для WordPress, которые помогут вам легко настроить Google AMP в блогах WordPress. Вот список некоторых из них.
- AMP
- AMP для WP
Давайте поговорим о каждом из этих плагинов AMP, чтобы вы могли выбрать тот, который соответствует вашим потребностям.
AMP для WP
Это тот же плагин AMP, который мы сейчас используем на нашем сайте, посвященном хостингу, Hosting Monks. Это один из широко распространенных и простых в использовании плагинов AMP, который автоматически добавляет функциональность Accelerated Mobile Pages на ваш сайт WordPress. Вот как это выглядит (со страницы настроек).
Самое лучшее в использовании этого плагина – вы можете создать свою собственную тему, используя фреймворк темы AMP.
Вы также можете перейти на учетную запись Pro, если вам нужно больше макетов AMP и дополнительные настройки.
AMP
Это официальный плагин AMP для WordPress, который поддерживает полностью интегрированную версию AMP для всех видов сайтов WordPress. Когда вы установите и активируете этот плагин, все URL-адреса постов на вашем сайте WordPress будут иметь версию “/amp/”. Это означает, что вы можете выбрать любой пост, добавить /amp/ в конец URL-адреса, чтобы увидеть AMP-версию. Он также предлагает поддержку всех основных тем WordPress, начиная с Twenty Ten и заканчивая Twenty-Twenty. Вот как выглядит страница настроек;
Он также предлагает вам стандартный режим, поэтому вам не нужно поддерживать отдельные версии AMP и не AMP. Плюс этого плагина в том, что он поставляется с инструментом валидации (встроенным), который может помочь вам с ошибками валидации. Они отображаются вместе с соответствующими блоками в редакторе, и вы можете исправить их, чтобы показать AMP-страницы для мобильных пользователей. Взгляните на страницу ошибок валидации.
Проверка кода Google AMP
После того как вы установите AMP на своих сайтах WordPress (с помощью любого из вышеперечисленных плагинов), вам необходимо проверить код AMP. Почему? Потому что если ваш AMP-код не будет подтвержден, Google не покажет AMP-версию в результатах поиска. Существует несколько способов проверки AMP-кода Google. Давайте поговорим о двух простых способах проверки кода.
Используйте расширение AMP Validator: Существует полезное расширение для браузера Chrome, которое вы можете использовать для проверки кода AMP. Оно автоматически проверяет каждую страницу на валидность AMP. Если есть какие-либо предупреждения или ошибки, оно покажет номер под значком расширения, и, нажав на него, вы сможете найти предупреждения или ошибки.
Используйте инструмент Google AMP Validator: Это еще один полезный веб-интерфейс, который покажет вам внизу, прошел или не прошел ваш AMP-код. Вот как это выглядит;
Более подробную информацию вы можете найти на официальном сайте AMP, где вы можете узнать все, начиная от проверки вашего кода AMP и заканчивая решением проблем с ошибками проверки.
Отличаются ли страницы Google AMP от страниц, дружественных к мобильным устройствам?
Да. AMP предлагает сокращенную версию вашего мобильного сайта. Он создан в первую очередь для скорости. Поскольку страницы AMP связаны с базовым кодированием, дизайн страниц AMP может показаться менее привлекательным. Страницы, дружественные к мобильным устройствам, обеспечивают оптимальный просмотр на всех устройствах, включая смартфоны, настольные компьютеры, планшеты и так далее. Удобные для мобильных устройств страницы оптимизированы для мобильных посетителей без ущерба для элементов вашего сайта. В двух словах, AMP-страницы полезны для ускорения загрузки, в то время как дружественные к мобильным устройствам страницы лучше для удобства пользователей. Знаете ли вы, что страницы Google AMP загружаются быстрее? Да, это правда. А знаете ли вы, почему? Страницы AMP – это облегченные версии, и они содержат три наиболее важных компонента Google AMP, которые помогают им загружаться быстрее.
- AMP HTML: подмножество HTML с пользовательскими тегами и свойствами, такими как amp-ad, amp-IMG и amp-video.
- AMP JS: JavaScript-фреймворк для мобильных страниц, который управляет обработкой ресурсов и приводит к асинхронной загрузке всех внешних ресурсов
- Google AMP Cache: CDN на основе прокси-сервера для доставки всех действительных страниц AMP
Почему важно использовать Google AMP на вашем WordPress? Google любит богатое и качественное содержание, а такое содержание обычно содержит много текста, графическое представление в виде высококачественных изображений и, возможно, видео (видео). Такие комбинации контента часто приводят к тому, что ваши страницы открываются медленно, особенно для мобильных пользователей. Отсюда вытекает причина создания AMP-ориентированного HTML, который будет эффективно справляться с этой проблемой. При этом важно создать такую возможность ускорения страниц сайта на мобильных устройствах, поскольку это помогает удерживать клиентов и увеличивает шансы на снежный ком доходов в результате ведения бизнеса в Интернете через свои сайты.
Как лучше всего использовать AMP на вашем сайте. Для начинающих рекомендуется поддерживать как минимум две версии ваших статей. Оригинальная версия ваших статей, которую увидят посетители вашего сайта, и AMP-версия той же страницы. Важно обратить ваше внимание на то, что AMP не поддерживает такие вещи, как сторонние JavaScripts и элементы форм, поэтому вы, скорее всего, не сможете иметь комментарии на странице, лид-формы и все другие полезные функции, к которым вы уже привыкли в стандартной реализации. К счастью, в настоящее время существует хак, который, похоже, решает эту проблему. Также возможно, что вам придется переписать шаблон своего сайта, чтобы учесть ограничения. Например, все CSS в AMP должны иметь размер менее 50 КБ, а также быть встроенными. Они должны иметь возможность загрузки с использованием уникального расширения amp-font, чтобы контролировать эту загрузку из-за интенсивности загрузки пользовательских шрифтов.
Кроме того, мультимедийные файлы должны обрабатываться особым образом. Например, все изображения на вашем сайте должны использовать пользовательский элемент amp image и иметь явную высоту и ширину. Также, если ваши изображения в формате GIF, вам необходимо использовать отдельный компонент amp animated extended. Аналогично, если вы хотите вставить локально размещенное видео через HTML5, необходимо использовать специальный тег amp-video. Существует также отдельный расширенный элемент amp-youtube для встраивания видео с Youtube, что является основной частью веб-видео. Слайд-шоу также имеют свою собственную поддержку через amp-carousel, а лайтбоксы изображений – через amp-image-lightbox. Есть также расширенные компоненты для вставки в социальные сети, включая Facebook, Twitter, Instagram, Pinterest и Vine. Хорошо то, что все эти теги и компоненты совсем не сложно использовать, вам просто нужно поиграть с ними в дизайне вашего сайта. Чтобы Google и другие технологии, поддерживающие AMP, обнаружили AMP-версию вашего сайта, вам придется отредактировать исходную версию страницы статьи. Оригинальная страница статьи должна иметь следующий тег:
<link rel=”amphtml” href=”http://www.examplesite.com/blog-post/amp/”>
На странице AMP Discovery Page также упоминается, что некоторым платформам, поддерживающим AMP, потребуются метаданные Schema.org для точного указания типа содержимого страницы. Наконец, если вы планируете в будущем получить выгоду от Google, внедрив AMP, вы должны правильно составить схему, поскольку, согласно им, метаданные schema.org необходимы для того, чтобы ваш контент мог появиться в демонстрационной карусели новостей поиска Google.
Как монетизировать рекламу на страницах AMP
С постоянным ростом числа блокировщиков рекламы издателям стало трудно легко монетизировать свои сайты. Для некоторых людей увеличение времени загрузки сайта стало реальным стимулом для использования блокировщиков рекламы, которые помогают улучшить время просмотра. Согласно Search Engine Land, AMP кажется хорошим решением этой проблемы с их текущим заявлением, как показано ниже:
Благодаря этому, некоторые из самых популярных рекламных сетей в интернете теперь используют расширенный компонент amp-ad, некоторые из сайтов включают:
- Google AdSense
- Taboola
- Yieldmo
- Плиста
- Smart AdServer
- DotAndAds
- Adform
- Flite
- AOL AdTech
- AdReactor
- Amazon A9
- Google Doubleclick
Хотя некоторые издатели недовольны AMP для WordPress, и самая большая проблема, с которой они сталкиваются, по-прежнему связана с монетизацией. Это просто потому, что AMP является урезанным и имеет ограниченные рекламные возможности. AMP позволяет размещать рекламу, но реализовать ее сложнее. Хорошо то, что Google расширяет количество типов рекламы, поддерживаемых AMP, хотя некоторые издатели сообщают, что они по-прежнему получают меньший доход от AMP по сравнению с традиционными мобильными страницами. Пока трудно сказать, как AMP повлияет на доходы вашего сайта; мы полагаем, что вам придется увидеть это самим в будущем. Судя по всем признакам и результатам, которые люди продолжают получать от своих тестов, Google AMP отлично подходят для SEO, и они улучшают наши результаты в Google SERPs. Откуда мы это знаем? Запустите поиск по некоторым известным именам, и вы сами увидите, как страницы с поддержкой AMP теперь появляются на первой странице Google. Волшебно, да?! Это во многом благодаря удивительному внедрению Google Accelerated Mobile Pages. Но прежде чем мы закончим, мы хотели бы поделиться с вами основными причинами, по которым вашему бизнесу будет полезно использовать Google AMP.
- Он загружается в 4 раза быстрее, чем стандартные мобильные страницы.
- Это помогает ранжировать ваш бизнес на первой странице Google
- Это поможет вам добиться высоких показателей кликов.
- Он поможет вам заработать больше денег на рекламе, поскольку ориентирован на издателей новостей и создателей контента.
Часто задаваемые вопросы о Google AMP на блогах WordPress
Вот несколько важных вопросов, связанных с внедрением Google AMP на блогах WordPress в 2022 году.
Нужно ли перенаправлять пользователей на AMP-контент? Это один из самых распространенных вопросов. Нет, вам не нужно перенаправлять пользователей на AMP-контент. Причина проста: Google автоматически направляет посетителей, пришедших из Google Search, на AMP-версии ваших страниц по мере необходимости. Но имейте в виду, что, если кто-то со смартфона зайдет на ваш сайт напрямую, он не будет перенаправлен на AMP-версию вашего контента. Это означает, что они НЕ увидят более быстро загружающиеся AMP-страницы.
Устанавливать AMP на свой сайт или нет? Это хороший вопрос. Во-первых, убедитесь, как выглядят ваши посты с использованием Accelerated Mobile Pages (AMP). Вы можете просто установить плагин AMP или AMP for WP. После активации плагина перейдите к любому посту и добавьте /amp/ в конец URL. Вот и все. Посмотрите, нравится ли вам “голый” дизайн вашего контента (страниц). Установите AMP, если вы считаете его полезным (или если вы действительно хотите обеспечить более быстрый пользовательский опыт для мобильных пользователей).
Быстрое примечание: Очистите кэш или откройте окно Incognito, чтобы проверить новый формат AMP.
Есть ли недостатки у Google AMP? Есть несколько причин, по которым мало кто не использует AMP, и они включают в себя;
- Вы не можете отображать виджеты и всплывающие окна, поскольку страницы AMP используют ограниченное количество CSS и JS
- Кроме Google Analytics, никакая другая аналитика не поддерживается на страницах с поддержкой AMP
Как избавиться от Google AMP? Если по какой-то причине вы хотите удалить Google AMP, вы можете просто деинсталлировать соответствующий плагин AMP, установленный на вашем сайте WordPress. Простая деактивация плагина отключит поддержку AMP на вашем сайте WordPress. Вы можете ознакомиться с этим подробным руководством от WP Beginner, чтобы правильно отключить AMP от WordPress (в нем также говорится об исправлении любых ошибок перенаправления).
Заключительные мысли об использовании Google AMP для WordPress
Добавление AMP на ваш сайт WordPress – это, безусловно, отличный способ улучшить общий пользовательский опыт для мобильных посетителей. Но у него есть свои ограничения, например, более высокий процент отказов, меньшая вовлеченность пользователей, как замечают многие. Поэтому обязательно установите и опробуйте версию AMP для своего сайта в течение некоторого времени. Следите за Google Analytics, чтобы понять, хорошо ли она работает для вас или нет. Затем вы сможете решить, стоит ли ее оставить.
