Прискорені мобільні сторінки: AMP для мобільної оптимізації WordPress

Прискорені мобільні сторінки для WordPress

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


Веб-сайти в першу чергу були розроблені для більшого екрану. Але менші екрани збільшуються в кількості і навіть обганяють ноутбуки та персональні комп’ютери. Зараз мобільні телефони представляють 65% цифрового медіа-часу. Ручні пристрої потребують завантаження сторінок так само швидко, як і на великих екранах, якщо не швидше.

Для задоволення цього попиту на швидкий завантаження вмісту програми, призначені для конкретних мобільних платформ, доступні в Apple (Новини), Facebook (Миттєві статті) та Snapchat (Відкрийте для себе). На початку цього року. Компанія Google представила прискорену мобільну сторінку (AMP), щоб пришвидшити доставку мобільного вмісту та забезпечити кращу роботу користувачів.

Що таке AMP?

AMP для WordPress: проект AMP

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

24 лютого 2016 року Google почав розгортати вміст, сумісний з AMP, у каруселі на своїй сторінці результатів мобільного пошуку. Користувачі можуть провести карусель і натиснути на предмет, який вони хочуть прочитати. Pinterest повідомив про сторінки, які мають бути У 4 рази швидше, використовуючи в 8 разів менше даних, ніж звичайні сторінки, оптимізовані для мобільних пристроїв. Це можливо через спосіб форматування та доставки сторінок.

Станом на серпень 2016 року в пошуку Google є понад 150 мільйонів документів AMP у своєму індексі та зростає зі швидкістю 4 мільйони на тиждень. На початку серпня компанія Google також почала розробляти попередній перегляд пошукового вмісту, який підтримує Google. Він розраховує реалізувати його більш широко в кінці цього року.

AMP для WordPress: попередній перегляд пошуку AMP

AMP у пошуку попереднього перегляду

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

На яких веб-сайтах слід використовувати AMP?

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

Сприятливі звіти надходять від ранніх усиновителів. З 88-кратним покращенням часу завантаження документів AMP, Про це повідомляє Washington Post збільшення кількості повернених користувачів з мобільних телефонів на 23%. eBay є однією з найбільших компаній з електронної комерції, яка переходить на AMP із близько 15 мільйонами сторінок перегляду продуктів на основі AMP. За короткий час очікується, що ці сторінки будуть розгорнуті, щоб їх виявити в ході пошуку.

То на яких веб-сайтах слід використовувати AMP? Однозначно ті, які сильно покладаються на мобільний рух. Але враховуючи, що все більше користувачів обирають використовувати свої мобільні пристрої для перегляду в Інтернеті AMP для WordPress (або будь-якого веб-сайту), може стати хорошим доповненням.

Що відрізняється в AMP?

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

  • Це постійна версія звичайної HTML-системи, за вирахуванням всього вмісту JavaScript. Для JavaScript рамки покладаються на загальну бібліотеку AMS JS.
  • Вміст кешується та зберігається в загальній хмарі, тому час, необхідний для запиту та отримання даних із сервера, виключається.

Існує ще багато відмінностей, але згадані тут два повинні дати вам швидке, широке розуміння.

Чому видавці та блоги повинні вмикати AMP

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

Сторінки AMP з’являються поряд із піктограмою блискавки для позначення їх на звичайних веб-сторінках. Глядачі, які натиснули цю опцію, будуть перенесені безпосередньо на сторінки AMP у програмі перегляду AMP. Мало того, що вміст буде миттєво доступним у пошуку Google та доступним через соціальні платформи, такі як Twitter, LinkedIn, WordPress, Parse.ly, Adobe Analytics, Nuzzel та Pinterest.

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

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

Які оптимізації потрібні для AMP

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

  • Дозволити лише асинхронний JavaScript – щоб не затримувати візуалізацію сторінки. Це означає, що ви не можете використовувати будь-який створений вами JavaScript, і вам потрібно покладатися на елементи AMP для обробки інтерактивного вмісту ваших сторінок. JS у iframe дозволено, але лише якщо це не перешкоджає візуалізації.
  • Розміряйте всі ресурси статично – AMP завантажує сторінку, не чекаючи завантаження таких ресурсів, як зображення та рамки кадрів. Розмір цих ресурсів повинен бути зазначений у HTTP, тому розмір та положення цих ресурсів відомі перед початком завантаження.
  • Не дозволяйте механізмам розширення блокувати візуалізацію – якщо будь-яке розширення має бути включене на сторінку, користувацький сценарій повинен повідомити про це систему. Таким чином, створюється простір для розширення, ще до того, як AMP дізнається, що воно буде включати. Розширення для лайтбоксів, вкладок та твітів в Instagram чудово, оскільки вони не блокують візуалізацію сторінки, хоча це вимагає додаткових HTTP-запитів.
  • Не дозволяйте всім стороннім JavaScript виходити з критичного шляху – користувацький JavaScript дозволений лише у пісочних рамках. Це не блокує завантаження головної сторінки.
  • Усі CSS повинні бути вбудованими та обмеженими розмірами – це допомагає зменшити кількість HTTP-запитів на критичному шляху.
  • Запуск шрифту повинен бути ефективним– система AMP не дозволяє запити HTTP, поки шрифти не почнуть завантажувати.
  • Мінімізуйте перерахунок розмірів – перерахунок затримує візуалізацію, тому його потрібно звести до мінімуму.
  • Запускайте лише анімації з підтримкою GPU – всі анімації повинні мати можливість працювати на графічному процесорі (блок графічної обробки).
  • Визначте пріоритетність завантаження ресурсів – Спочатку завантажується лише необхідний вміст, а оголошення та зображення завантажуються якнайшвидше, але завантажуються лише за потреби. Таким чином попит на процесор зводиться до мінімуму.
  • Завантажте сторінки за мить – попереднє візуалізація використовує багато пропускної здатності та процесора. Попередня візуалізація AMP завантажує спочатку лише необхідний вміст, а завантажує сторонні iframe та інші ресурси лише за потреби.

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

Як додати AMP для WordPress

У Google є навчальний посібник на яку можна посилатися для створення основних HTML-сторінок AMP, постановки на них, підтвердження їх сумісності з AMP, публікації та розповсюдження їх. Перевірка сторінок AMP Це важливо, тому що такі треті сторони, як Twitter та Instagram, впевнені, що сторінки добре відображатимуться на їх платформах.

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

Плагін AMP WordPress від Automattic

Плагін AMP WordPress від Automattic

Після завантаження встановіть та активуйте Плагін AMP На веб-сайті WordPress ваші повідомлення автоматично матимуть динамічно генеровану версію AMP. Ви можете отримати доступ до цих сторінок, додавши їх підсилювач наприкінці вашої URL-адреси (example.com/my-post/amp). Якщо у вас немає ввімкнених постійних посилань, тоді додайте ?підсилювач = 1 до посилань (це могло б виглядати як example.com/?p=100&amp=1). Єдиний інший крок – перевірити та перевірити ваші сторінки, як згадувалося вище.

Ви не помітите жодних налаштувань або функцій для цього плагіна. Є один доданий варіант панелі інструментів для AMP Analytics, куди можна вставити власний код конфігурації JSON, але це все.

Цей плагін є офіційним плагіном з автоматичної конюшні, і на даний момент він не підтримує сторінки та архіви, а також не можна налаштовувати сторінки. Але це дуже простий і простий у використанні варіант, і ви можете знайти деякі вказівки через документація на Github для налаштування.

AMP для WP – прискорені мобільні сторінки

AMP для WP Free WordPress плагін

Ще один чудовий безкоштовний варіант AMP для WP. Цей безкоштовний плагін WordPress пропонує швидке та просте налаштування – просто встановіть, включіть налаштування та почніть автоматично генерувати ваш AMP для вашого веб-сайту. Бонус – цей плагін також сумісний з декількома сайтами.

Є вбудовані налаштування для включення AMP (повідомлення, сторінки, архіви), додавання областей мобільної реклами, структурованих даних (важлива частина SEO), інтеграція метатегів Yoast SEO, розширені варіанти індексів / без індексу, натискання сповіщень, нативної мови Коментування AMP, користувацькі переклади AMP (якщо ви використовуєте іншу мову, ніж англійська, ви хочете оновити цю програму) та багато іншого. Налаштування дуже вичерпні для безкоштовного плагіна, який є приголомшливим.

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

AMP для WP також пропонує розширення преміум-класу додати функції (наприклад, заклик до дії або кешування AMP) та підтримку популярних плагінів, включаючи WooCommerce, розширені спеціальні поля та контактну форму 7.

Більше способів додати AMP для WordPress

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

  • WP AMP – для створення індивідуального дизайну AMP без кодування та збільшення SEO. Більше про це можна прочитати тут.
  • Прискорені мобільні сторінки (AMP) для WordPress – для створення теми AMP для вашого веб-сайту.
  • Спеціальний AMP – щоб допомогти налаштувати вміст AMP.
  • Статті миттєвих статей у Facebook та сторінки AMP Google – публікувати та керувати своїм вмістом безпосередньо з WordPress на сторінках Google AMP із підтримкою реклами та аналітики.
  • Клей для Yoast SEO & AMP – гарантувати, що плагін для WordPress AMP за замовчуванням використовує належні метадані Yoast SEO та дозволяє модифікувати дизайн сторінки AMP.

Якщо слід додати AMP для WordPress?

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

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

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

Однак якщо ви хочете створити швидкий та привабливий досвід для своїх користувачів і змусити їх довше триматися, вам слід серйозно розглянути AMP для WordPress (або будь-який інший веб-сайт, який ви можете запустити). Якщо це місце на каруселі AMP на сторінках пошуку Google, які ви хочете розігнати, перейдіть на смугу AMP.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map