Reading Time: 4 minutes

Екипът на Serpact ™ участва на тазгодишната AMP Roadshow конференция в Мюнхен, организирана от екипа на AMP (Accelerated Mobile Pages)

Екипът на Serpact взе участие в AMP Roadshow в Мюнхен
Екипът на Serpact ™ взе участие на AMP Roadshow в Мюнхен

Екипът на Serpact ™ участва на тазгодишната AMP Roadshow конференция в Мюнхен, организирана от екипа на AMP (Accelerated Mobile Pages), която се проведе на 7 ноември. На събитието присъстваха разработчиците Ben Morse, Paul Bacau и Rudy Gulfi – продуктов мениджър. Конференцията засегна много аспекти на AMP като интерактивност, на какво ниво на развитие е AMP в момента, също и финансиране. Някои от темите бяха: „Удобна за AMP библиотека с уеб страници“, „Подобрена интерактивност на AMP“, „Създаване на AMP“, „Забавни и печеливши AMP“, „Прогресивни AMP страници“.

Nikola Minkov with Paul Bakaus - AMP Developer Advocate
Никола Минков, заедно с Paul Bakaus – AMP Developer Advocate

Ето и една от презентациите, демонстрирана на AMP коференцията:

Основни Принципи

AMP (ускорени мобилни страници) е сравнително нова концепция на Google, която има за цел да създаде нов формат на уебсайтовете, който е по-бърз, по-продуктивен и изглежда добре.

На какъв етап в разститието си е AMP сега?

История

  • AMP е разработен за първи път през 2015 г. Топ сайтове, разработени за AMP, стартират присъствието си в Google Търсене през февруари 2016 г.
  • AMP достига до всички резултати от търсенето с Google през септември 2016 г.
  • Първата конференция на AMP се проведе през март 2017 г
  • През май 2017 г. най-значимите Carousel Stories виждат бял свят.
  • Съществуват общо 2 милярда страници
  • 1.2 милиона домейна са на AMP
  • 90 AMP страници се създават всяка секунда

Според Forbes половината от приходите от електронна търговия в САЩ ще идват от мобилни устройства. Благодарение на 36% намаление на таксите, има 10,5% увеличение на поръчките и 27% увеличение на реализациите.

AMP води до растеж на онлайн резервациите и покупките на самолетни билети….

Ali Express, например, постигна 4% увеличение на реализациите с AMP.
Wego постигна растеж с 49% в реализациите при търсене и 95% в …. (партьорските конверсии)

Промяна във възприятието

Ето някои от по-важните въпроси и техните отговори, които чухме на конференцията:

„Хей, някой спомена дали AMP ми трябва?“
„Разбира се, това е единственият начин да се класирате за carousel на Google, по-добре не пропускайте този допълнителен трафик.“

„Е, тогава трябва ли да променя целия си сайт?“
„Не, това е точно като RSS, просто ги генерирайте върху нормалния си сайт и щракнете върху тях.“

Мрежата – неограничени възможности

Една от основните причини за създаването на AMP е да възстанови предишната слава и да увеличи скоростта на уеб страниците и да направи по-лесна тяхната употреба.

Отнема 19 секунди зареждане на една страница на 3G мрежа и с 1% забавяне се губят общо 7 реализации.
1 MB данни може да струва 5% от месечния оборот. 0,8 MB е средното количество реклама на мобилно устройство.

За индексиране на AMP, тя трябва да бъде маркирана с canonical

<link rel=“amphtml“ href=“https://www….com/page.amp.html„>

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

Google казва, „Фокусирайте се върху потребителя и всичко останало ще дойде от само себе си.“

2. „AMP-библиотека за красиви и респонсив сайтове“

„AMP библиотека за красиви и респонсив уеб страници (също бързи и лесни за използване)“

AMP подобрява дизайна на мобилната версия и води до по-добро красивото десктоп рендиране. В допълнение, той подобрява пагинацията и адаптивния дизайн.

Някои основни факти за AMP:

Не се нуждае от JavaScript и HTML, а само от CSS

Всъщност AMP изобщо не позволява JS, освен собствените си скриптове. HTML се обработва безпроблемно, като се преобразува в необходимия формат при изпращане на страницата. Що се отнася до CSS, трябва да се има предвид, че в допълнение към стандартния, даден ни от проекта, всички CSS стилове, създадени лично от нас, трябва да бъдат описани в персонализиран css таг в хедъра на страницата. Local style елементи не се допускат.

  • AMP HTML Library

Конференцията представи някои нови допълнения и ревизии на синтаксиса и функционалността на AMP елементите. По-интересни са:

srcset: Responsive Images using AMP – възможността за създаване на респонсив изображения за десктоп с различна разделителна способност

Media: Media searches за всеки елемент

  • Embedding

Начини за ембедване на елементи от някои от социалните мрежи в AMP страници, като YouTube и Twitter, чрез тагове като

<amp-youtube>
<amp-twitter>

  • Повече building parts

Други градивни елементи, които вече са стандартизирани и внедрени за обща употреба в AMP библиотеки, като въртележки, видеоклипове, лайтбоксове, странични ленти и други. Ето някои от етикетите, които ги описват:

<amp-carousel>
<amp-accordion>
<amp-timeago>
<amp-lightbox>
<amp-video> (with autoplay)
<amp-sidebar>
<amp-fit-text>

  • Use for advanced

<amp-image-lightbox>
<amp-fx-flying-carp>
<amp-fx-flying-carpet>

<amp-animation>

Особено впечатляващо беше представянето на анимации на AMP страници, ето някои ключови точки:

Тънък фон около уеб анимации;
Отлични пикселни анимации, които не могат да се направят с CSS

<amp-animation>

Scroll-bound Animations (в процес на експериментация);
Parallax scrolling

<amp-position-observer>

Parallax 3D Cube Animation

Как да започна да използвам AMP?

Ето някои източници, които ни бяха представени и биха били полезни, ако решите да започнете с AMP:

Нуждаете се от вдъхновение?

Ако имате нужда от малко вдъхновение, за да направите своите страхотни AMP страници, вижте някои примери по-долу.

Вашият коментар

Вашият имейл адрес няма да бъде публикуван.