Про переваги прискорених сторінок Google AMP

Якщо мобільна версія вашого сайту повільна як равлик, ви не перетворите користувачів на своїх клієнтів. Ми розповімо, як завоювати довіру користувачів і Google, використовуючи прискорені мобільні сторінки.

Мобільний трафік виріс на 500% за 10 років — такий висновок в дослідженні зробила платформа hostingtribunal.com. Це означає, що ми живемо в епоху, коли смартфони перемогли десктоп. Оптимізація мобільних браузерів важлива як для користувачів, так і для SEO. Google знаходить сторінки з повільною завантаженням або високим показником відмов і знижує рейтинг в пошуковій видачі.

Що таке Google AMP?

Accelerated Mobile Pages (прискорені мобільні сторінки) — це платформа з відкритим вихідним кодом. Google випустив APM в 2016 році з метою зробити революцію в споживанні контенту. Передусім для сайтів новин і онлайн-журналів.

Зайшовши на платформу, кожен може безкоштовно полегшити мобільну версію свого сайту до базових елементів і прискорити її завантаження до швидкості світла.

Головна мета Google AMP — миттєво завантажувати цільові сторінки зі смартфонів, прибавлюючи користувачів швидким і зручним доступом до мобільного контенту. AMP-сторінки не такі привабливі: без графіки, відео, гифок, віджетів, форм і блоків рекомендованого контенту. По суті це текст і зображення оптимальної якості. Зате такі сторінки швидкі, їх завантаження економить мобільний трафік. Погодьтеся, це зручно в роумінгу або в поході в гори, або у відпустці, коли наявність мережі 3G — то вже щастя.

Сторінки Google AMP завантажуються в чотири рази швидше —
за 0,7 секунди

Фактор надшвидкості завантаження контенту буде штофхати людей до пошуку сторінок з блискавкою (в числі яких може бути і ваша).

Порівняйте різні варіанти відображення однієї й тієї ж сторінки:

AMP Повна десктоп-версія — *Повна десктоп-версія*

Зверніть увагу, що в AMP-версії є кнопки для скачування програми і переходу на головний сайт. В основній версії — автор з активним посиланням і дзвоник сповіщень.

Як працює Google AMP?

Google AMP використовує полегшений HTML-код, JavaScript і CSS. А також кешування, пріоритетне завантаження контенту над згином, одночасне завантаження елементів і скриптів, попереднє завантаження окремих цільових сторінок.

Кому потрібен Google AMP?

Ми вже говорили, що AMP може поліпшити SEO, але не є рятувальним кругом для всіх сайтів без винятку. Зорієнтуватися — чи потрібен Google AMP для просування вашого бізнесу — допоможуть наші рекомендації:

AMP точно буде корисний контентним сайтам з активним блогом, де багато та часто публікуються новини та лонгріди.
Google AMP не потрібен, якщо на сайті вже є CDN (мережа доставки контенту) з оптимізацією продуктивності. Наприклад, функція відкладеного завантаження: спочатку завантажується текст, а потім зображення.
Прискорені сторінки читати легше та простіше, але деякі плагіни JavaScript можуть зіпсувати рейтинг. Після впровадження AMP-сторінки потрібно протестувати — чи працюють всі форми, бо швидкість-швидкістю, а ліди теж треба збирати.
AMP не є фактором ранжування Google. AMP не підніме ваш сайт у топ, а стане лише частиною складної стратегії завоювання любові Google і користувачів, на смартфонах яких ваш сайт завантажиться швидше, ніж у конкурентів.

Переваги Google AMP

Окрім прискореного завантаження та зручного контенту без відволікання, Google AMP пропонує ще кілька додаткових переваг.

Збільшення коефіцієнта залученості

Полегшений AMP-контент завантажується навіть на смартфонах з нестабільним інтернетом. Ви втримаєте увагу користувачів, які не люблять довго чекати.

❕ Більше 50% користувачів тікають з мобільної версії сайту, якщо вона завантажується довше трьох секунд.

Зростання рейтингу і трафіку

У AMP — пріоритет в пошукових алгоритмах Google, бо час завантаження сторінки — фактор ранжування. З двох одночасно відкритих сайтів виграє той, який швидше завантажиться.

❕ Якщо мобільна версія вашого сайту повільна як равлик, ви не перетворите користувачів в клієнтів

Високий рейтинг кліків

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

Низький показник відмов

Чим швидше завантажується контент AMP-сторінок, тим більше часу користувачі проведуть на сайті. Більше часу на сайті — більше конверсий.

Рентабельність реклами

Висока швидкість завантаження привертає більше людей, які побачать рекламу.

Недоліки Google AMP

Обмеження скриптів і стилів. Функціональність в AMP важливіша за естетику, не всі UX-елементи наявні в бібліотеці JavaScript. Це мінус для сайтів з акцентом на візуальний контент.

Доведеться завантажити шрифти та схвалені AMP-розширення для використання відеоконтенту.

На сторінках плагіна AMP не можна використовувати форми.

На AMP-сторінці можна розмістити тільки одне рекламне оголошення. Що зв’язує руки контентним сайтам, які заробляють саме на рекламі.

У форматі AMP-сторінки ваш бренд може загубитися серед контенту, бо домен Google займає адресний рядок. Лого та назва хоч і зафіксовані у верхній частині сторінки, але візуально мало помітні.

AMP не підтримує багато віджети. Якщо ви робите ставки на соціалки, майте на увазі: в полегшеній версії немає віджета Facebook та інших соціалок.

Важко відслідковувати аналітику. AMP підтримує тільки Google Analytics, до того ж за допомогою плагінів або спеціального коду для моніторингу.

Доведеться постійно тестувати прискорені сторінки на коректність відображення, тому що AMP-дизайн — це окрема сторінка, яка не створюється автоматично: її потрібно переробити з основної, а краще — зверстати заново.

У некоректно впровадженого AMP більше мінусів, ніж у правильно налаштованого — плюсів.

Як перевіряти AMP

Сервіс від Google:

Сервіс від спільноти:

Важно: при проверке смотрите в инструментах не только на главную, но и на страницы категории, товара, услуги, страницу со статьей по отдельности.

Як запровадити AMP

Отже, ви надихнулися перевагами прискорених мобільних сторінок, врахували можливі обмеження та вирішили впровадити Google AMP. Для цього вам знадобляться спеціальні плагіни.

AMP для WordPress

У WordPress існує два варіанта установки плагінів.

Варіант №1. Йдемо до сайту WordPress та обираємо офіційний плагін — перший зі списку з поміткою півмільйона завантажень.

Відкриваємо його та завантажуємо:

Переходимо до установки плагінів і завантажуємо:

Встановлюємо:

І проводимо активацію:

Варіант №2. Шукаємо AMP прямо в админці WP, встановлюємо як на скріні:

Перевірка AMP для WordPress

Перовіряємо окремі сторінки за допомогою сайтів:
https://search.google.com/test/amp
та
https://validator.ampproject.org/

Якщо на сайті кожен вид послуги — це окремо зверстана сторінка, то кожну сторінку треба перевірити окремо.

Важливо!
Іноді сервіс показує, що все круто:

Але не забувайте тиснути на «дивитись докладніше»:

Виявилося, що офіційний плагін від спільноти в нашому випадку спрацьовує некоректно через те, що тема була прописана вручну:

Перестала працювати форма, потрібна додаткове допрацювання:

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

Для сайтів з кастомним верстанням дизайну потрібен інший плагін, який можна налаштовувати, підключати форми або вставляти свій код.

Налаштування AMP для WordPress

А вот плагін AMP for WP можна налаштовувати додатково. Є два варіанти як запровадити AMP.

За допомогою кастомного коду

Можна попросити переписати код, який буде валідним для AMP. Але доведеться доплатити за верстання кожної сторінки:

За допомогою вбудованого AMP Page Builder

Можна побудувати AMP-версію з нуля. Наприклад, заново накидати блоки на сторінку:

Загальні налаштування AMP for WP

Можна заповнити рядки самостійно або подружити форми з платним плагіном.

На WordPress краще взагалі не встановлювати AMP. Якщо його залити неправильно, можна зламати сайт і завалити показники конверсії. Тому тестуйте окремо всі сторінки.

Для додаткової оптимізації зовнішнього вигляду, функціоналу й аналітики використовуйте плагін AMP для WP. Для цього перейдіть в меню налаштувань AMP-сторінок в адмінпанелі.

AMP для Magento

Створити AMP-версію головної сторінки сайту, сторінок категорій і товарів допоможе платний плагін AMP.

Зазвичай сайти на Magento обслуговують розробники, які самостійно можуть встановити AMP в найкращому форматі.

AMP для OpenCart

Для сайта на OpenCart використовують плагіни:

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

AMP для PrestaShop

Створити прискорені сторінки для сайту на PrestaShop можна за допомогою платного модуля AMP для PS. Прискорити можна головну сторінку сайту, а також сторінки категорій і карток окремих товарів.

Завантажити плагіни можна за посиланнями:

📌 Читайте в блозі: Дешево та сердито: як зменшити витрати на маркетинг

Головні тезіси

Навіщо потрібні AMP?

Миттєво завантажувати цільові сторінки зі смартфонів, приваблюючи користувачів швидким і зручним доступом до мобільного контенту.

Як працює AMP?

АMP відображає сторінки за допомогою спрощених HTML, JavaScript і CSS.

Кому потрібен AMP?

Точно контентим сайтам. Й усім, хто хоче заробляти! Блискавичний дохід (аналогічний швидкості завантаження) AMP не гарантує, але допомогти в просуванні — може.

Які переваги AMP?

Високий рейтинг. Увага користувачів. Низький відсоток відмов. Привабливі умови для реклами.

Які недоліки AMP?

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

Як зробити AMP?

AMP сторінки робляться за допомогою спеціальних плагінів (платних або безкоштовних), в залежності від платформи.

Як перевірити чи працюють AMP?

Сервісами тестування від Google і AMP Project.

ШВИДКІ НАЧЕ БЛИСКАВКА: ВСІ ПЕРЕВАГИ ПРИСКОРЕНИХ МОБІЛЬНИХ СТОРІНОК GOOGLE AMP