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

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

Коли зʼявилися AMP та для якої мети

AMP (Accelerated Mobile Pages) або прискорені мобільні сторінки — це HTML-фреймворк з відкритим вихідним кодом, створений для прискорення завантаження сторінок для користувачів мобільного Інтернету.

Google створив AMP, щоб протиставити їх таким конкурентам як Facebook Instant Articles і Apple News. Компанія вперше оголосила про запуск прискорених сторінок 7 жовтня 2015 року. Наступні місяці припали на технічну перевірку нового сервісу. І вже у лютому наступного року AMP почали з’являтися в результатах пошуку Google для смартфонів.

Наразі середній час завантаження сторінок, позначених символом AMP, становить усього 1 секунду.

Чому мобільний трафік став таким важливим

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

Кількість користувачів смартфонів

Кількість власників смартфонів у світі буде постійно зростати між 2022 і 2028 роками. Statista прогнозує збільшення загалом на 1156,2 мільйона нових юзерів (+23,1%) за цей період. Згідно з їх оцінками, у 2028 році база зросте до 6,2 мільярда осіб.

‍

Джерело: Statista

Мобільний трафік

Глобальний ринок трафіку мобільних даних оцінюється в 84,1 мільйона терабайт на місяць у 2022 році. Research and Markets прогнозує, що цей ринок досягне 603,5 мільйона терабайт на місяць до 2030 року, зростаючи із сукупним середньорічним темпом росту на 27,9%.

Відео, один із сегментів, проаналізованих у звіті Research and Markets, за прогнозами досягне 462,9 мільйонів терабайт на місяць до кінця 2030 року. Команда Membrana Media пишається, що робить свій внесок у популяризації відеореклами для паблішерів. Дослідження Research and Markets лише підтверджує, наскільки збереже свою актуальність цей напрямок для користувачів в усьому світі.

Витрати на мобільну рекламу та середньодобовий час за смартфоном

Платформа data.ai підготувала два звіти "Стан мобільних пристроїв" за останні два роки. Глобальні витрати на мобільну рекламу у 2021 році становили $295 мільярдів. У цей же період один користувач у середеньому витрачав по 4,8 годин на день на мобільні пристрої. Якщо брати до уваги, що людина може спати десь 8 годин на добу, то виходить, що на смартфон припадало майже третина активної частини дня.

Однак у 2022 році дані показники збільшились. Наприклад, витрати на мобільну рекламу збільшились до $336 мільярдів, і це майже 14% приріст порівняно з 2021 роком. Люди почали проводити ще більше часу у смартфонах: по 5 годин на день у середньому, що є більшим на 4% відносно минулого року.

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

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

Чому AMP швидкі

AMP складаються з таких трьох основних компонентів як AMP HTML, AMP JavaScript та AMP Cache. Вони працюють в унісон, щоб забезпечити швидке завантаження сторінок на смартфонах. Розберемо кожен з цих елементів AMP.

AMP HTML

Більшість тегів у AMP HTML є звичайними тегами HTML, однак деякі теги HTML замінено тегами, специфічними для AMP. Ці користувацькі теги називаються компонентами AMP HTML, і вони спрощують впровадження звичайних шаблонів тегів у ефективний спосіб. Сторінки AMP виявляються пошуковими системами та іншими платформами за тегом HTML. Ви можете вибрати версію сторінки без AMP і версію AMP або лише версію AMP.

AMP JavaScript

Бібліотека AMP JS забезпечує швидке відтворення сторінок AMP HTML. Вона реалізує всі найкращі методи продуктивності AMP, такі як вбудований CSS і активація шрифтів. AMP JS керує завантаженням ресурсів і надає вам спеціальні теги HTML для забезпечення швидкого рендерингу сторінки.

AMP JS робить усі зовнішні ресурси асинхронними, тому ніщо на сторінці не може заблокувати рендеринг. Ця бібліотека використовує також інші методи продуктивності як ізольоване програмне середовище для всіх iframes, попередній розрахунок макета кожного елемента сторінки перед завантаженням ресурсів і відключення повільних селекторів CSS

AMP Cache

Цей третій компонент AMP використовується для обслуговування кешованих AMP HTML-сторінок. AMP Cache представляє з себе мережу доставки контенту на основі проксі, яка використовується для доставки всіх дійсних документів AMP. Кеш витягує HTML-сторінки AMP, кешує їх і автоматично покращує продуктивність сторінки.

Для підтримки максимальної ефективності AMP Cache завантажує документ, файли JS і всі зображення з того самого джерела, яке використовує HTTP 2.0. AMP Cache оснащено вбудованою системою перевірки, яка підтверджує, що сторінка гарантовано працює та не залежить від зовнішніх факторів, які можуть уповільнити сторінку.

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

Вплив AMP на відеоконтент

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

AMP дозволяє показувати відеорекламу як In-Stream, так і Out-Stream. Відеорекламу In-stream можна відображати за допомогою розширення <amp-ima-video>. Воно має всі основні функції, включаючи автоматичне відтворення, стикування при прокручуванні та аналітику.

А для відеореклами Out-Stream має працювати базове розширення <amp-ad>. Однак вам все одно знадобляться рекламодавці, які шукають ресурс AMP для показу відеореклами.

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

Джерело: vimeo

Хто зацікавлений у налаштуванні AMP

AMP приносить користь усім сторонам: рекламодавцям, видавцям і користувачам.

Рекламодавці можуть використовувати AMP із різноманітними рекламними форматами. Рекламний вміст завантажується асинхронно, що означає, що реклама, яка перешкоджає завантаженню сторінки, не заважає взаємодії з користувачем.

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

Сайти, які використовують AMP, ідеально підходять для користувачів. Їм не потрібно довго чекати, поки сторінки завантажуються. Відвідувачі навіть можуть розраховувати на високу продуктивність при перегляді сторінки з повільним підключенням до Інтернету.

Що далі

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