вид amp страницы

Появление ускоренных мобильных страниц (amp), по мнению Google, должно помочь пользователю получить актуальную информацию при любой скорости интернета, так как такие страницы имеют минимум надстроек и кэшируются на стороне Гугла. По сути, amp-страница это голый HTML лишь слегка приправленный тегами и стилями, что позволяет получить информацию при минимуме украшательств. Скорость взамен массива стилей и скриптов – вот революционный лозунг AMP.

Плюсы и минусы AMP

Коротко о плюсах и минусах ускоренных мобильных страниц. Плюсы читаются в самом названии:

  1. Максимально быстрая загрузка,
  2. Снижение нагрузки на сервер,
  3. Возможность попасть в специальный блок новостей при небольшом рейтинге статей.

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

Замечу, что AMP (Accelerated Mobile Pages) открываются прямо в выдаче, реального перехода на сайт нет, но пользователь получает всю информацию и видит рекламу сайта. Если тема отвечает его интересам, то пользователь может перейти на обычную версию сайта. Это удобно для контентных проектов, где конкуренция не пускает в органический топ и трафик приходит далеко не на все материалы.

Минусы AMP –

  1. Ограничения по рекламе, банально модулем AdSense не поставишь,
  2. Надо доводить ручками стили, чтобы страница не выбивалась из дизайна сайта,
  3. Классический код Метрики не станет,
  4. Работают лишь асинхронные скрипты,
  5. Максимальный размер стилей 50 Кб,
  6. Требуется программист или платный плагин.

Сразу скажу, что минусы решаются, как задачи по математике в 3 классе, а плюсы остаются. Ниже я расскажу, как сделать amp для сайта Joomla с помощью плагина wbAMP. Понадобится:

  1. Плагин wbAMP,
  2. Шаблон (тема) плагина Taylor.

Можно обойтись одним wbAMP, но возможности создания оптимальных для сайта страниц AMP сузятся. wbAMP имеет две версии – ограниченную бесплатную и расширенную платную – 44 евро. Первый вариант не подойдёт – по факту amp создастся, но вы не сможете вставить туда рекламу и поиграть доступными стилями. Внизу страницы я поделюсь своими возможностями для помощи веб-мастерам Joomla.

настройка wbAMP

Настройка wbAMP

Установка компонента стандартная – бегать по всей Одессе с вопросом, на какую кнопку нажать, не надо. Внутри wbAMP находятся вкладки:

  1. Плагин,
  2. Выбрать страницы,
  3. Мета данные,
  4. Аналитикс,
  5. Произвольные элементы,
  6. Рекламные сети,
  7. Очистка,
  8. Расширенные настройки.

Вкладка плагин

Настройку я и разберу на примере полной (платной версии) плагина. Во вкладке «плагин» устанавливаете:

  • Режим работы – обычный,
  • Force on mobile,
  • Суффик AMP,
  • Стиль страницы.

Пункты 2-4 раскрою подробнее. Вкладка Force on mobile позволяет указать, каким посетителям показывать amp страницы. Варианта три:

  1. Не показывать amp для мобильных устройств,
  2. Показывать для мобильных,
  3. Показывать для мобильных и планшетов.

Выбор показа amp

В первом случае страницы будут созданы с адресом

сайт/страница.amp.html

Морда:

Сайт.ру/amp

Например, http://сайт.рф/amp

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

С пунктами 2-3 всё понятно.

Суффикс оставляете amp, а стиль страницы (при установленной теме Тайлор) указываем AMP Taylor.

Во вкладке «Выбрать страницы» нас интересует только Категории com_content, где надо указать, для каких категорий будет создаваться amp.

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

Вставляем рекламу

Не пройдите мимо вкладки «Рекламные сети», так как реклама с сайта автоматом на amp страницах показываться не будет. Необходимо указать:

  1. Расположение рекламы (перед или после содержимого),
  2. Рекламную сеть,
  3. Ширину и высоту блока,
  4. Содержимое тега <amp-ad>.

Ширину советую 320, с высотой разберитесь сами. Классический адаптив не работает, ставить вверху или внизу – дело барина.

код Google AdSense для amp

Обычный код Google AdSense не пройдёт. Вот пример amp кода:

<amp-ad

layout="fixed-height"

height=100

type="adsense"

data-ad-client="ca-pub-XXXXXXXXXXX"

data-ad-slot="XXXXXXXXXX">

</amp-ad>

В data-ad-client и data-ad-slot укажите цифры из рекламного блока вашего аккаунта.

Вкладки «Очистка» и «Расширенные настройки» оставьте по умолчанию – никто не умрёт.

На посошок

В следующей теме я расскажу про настройку темы Тайлор и установку на Joomla с amp страницами кода Метрики.

Желающие получить полную версию плагина «за пиво» пишите в скайп Zegeberg. Для справки пиво стоит в 10 раз меньше, чем 44 евро. Если желание иметь amp велико, но знаний мало, то за много пива я сам поставлю вам плагин wbAMP и тему Taylor + настрою их. 

Добавить комментарий


Защитный код
Обновить