Czym jest AMP i kiedy go używać w e-Commerce?

16.06.2021 Kornel Kosoń
kostki na żółtym biurku z napisem amp skrót od accelerated mobile pages

Przewaga korzystania z internetu za pomocą urządzeń mobilnych nad desktopami rośnie. Ta różnica jest widoczna w zachowaniach graczy na rynku e-Commerce. Coraz więcej sklepów i marek priorytetyzuje aplikacje natywne, progresywne i cross-platformowe. Urządzenia mobilne przyćmiewają rolę desktopu w dokonywaniu zakupów online. Widać to po popularności i nacisku na płatności mobilne takie jak Google Pay, Apple Pay, czy polskim Bliku. Zresztą oficjalne statystyki pokazują jasno, że w ujęciu globalnym z urządzeń mobilnych korzysta 14% więcej użytkowników niż z desktopa. W Polsce ta przewaga spada do 7%. Konsekwencją tych trendów są coraz liczniejsze technologie i strategie optymalizujące aplikacje online pod urządzenia mobilne. Wśród nich są także AMP, czyli Accelerated Mobile Pages i podejście Mobile First.

Czym jest AMP?

AMP to platforma komponentów od Google’a. Została ona opracowana z myślą o lepszych doświadczeniach przy korzystaniu z mobilnych wersji stron internetowych i aplikacji. Jak głosi główna strona AMP-u, narzędzie stawia użytkownika, prędkość działania i konwersję na pierwszym miejscu. Accelerated Mobile Pages obejmuje tagi HTML, dedykowaną bibliotekę JavaScript i narzędzie do cachowania stron opartych na tej technologii.

Komponenty Accelerated Mobile Pages

Komponenty te są dostępne do wykorzystania w bardzo intuicyjny i prosty sposób.

  • działają na podstawie zasady kopiuj-wklej, 
  • oferują szeroki wybór różnych funkcjonalności i stylów UI,
  • ich funkcjonowanie, zachowania i style można konfigurować poprzez dostęp do atrybutów i CSS.

Dodatkowo AMP jest wspierane przez inżynierów od Google, którzy dbają o narzędzie i opracowują jego nowe wersje. Ponadto na głównej stronie tego projektu dostępna jest biblioteka komponentów z dedykowanymi stronami i szczegółowymi opisami każdego z komponentów.

Wsparcie innych narzędzi Google

W wyszukiwaniach na urządzenia mobilne Twoja strona AMP-owa będzie się wyświetlać jako taka – użytkownicy będą o tym wiedzieli za sprawą ikonki z piorunem koło nazwy strony w wynikach wyszukiwania. Czy Google bierze pod uwagę fakt budowania stron za pomocą komponentów Accelerated Mobile Pages przy pozycjonowaniu? Nie, ale szybkość ich działania już tak. A dobrze zbudowana aplikacja ampowa właśnie przyśpiesza działanie stron w znacznym stopniu. Pamiętaj o tym, że aktualnie ikona AMP wyświetla się tylko w wyszukiwaniach na urządzenia mobilne, nie desktopowe.

Ponadto narzędzie Google AMP Cache pomaga w jeszcze szybszym cachowaniu stron używających tę technologię, co dodatkowo optymalizuje prędkość ładowania treści. Jeśli nie jesteś pewny jak Twoja strona AMP-owa sobie radzi, możesz dodać do niej komponent amp-analytics, który jest kompatybilny z Google Analytics. Dzięki niej możesz sprawdzić wiele statystyk, m.in. tych dotyczących zaangażowania użytkowników.

Kiedy używać AMP w e-Commerce?

Ze względu na swoją budowę AMP sprawdza się lepiej w rozwiązaniach blogowo-artykułowych. Jest on dobrą technologią do wykorzystania przy budowie strony blogowej twojego e-Commercu. Jednak przez braki dot. danych zmiennych nie spisuje się on dobrze z treściami produktowymi. Jego siła opiera się na szybkim wczytywaniu i obsłudze danych statycznych, gdyż nie ulegają one tak częstym aktualizacjom jak dane produktowe. Pomimo ograniczenia do danych statycznych, AMP nadal zauważalnie poprawia jakość witryn. Krzysztof Baraniecki, web developer z Global4Net zaznacza:

AMP jest stworzony dla szybkości. Dzięki szybkiemu ładowaniu stron Google lepiej pozycjonuje naszą stronę. Tym sposobem usprawnianie stron z AMP zwiększa szansę na pozyskanie klientów, redukcję współczynnika odrzuceń i zwiększenie konwersji.

Accelerated Mobile Pages i Mobile First

Jak sama nazwa wskazuje technologia Accelerated Mobile Pages są skierowane do stron internetowych przygotowanych na urządzenia mobilne. Dlatego także warto zacząć development tych stron z podejściem Mobile First – na czym ono polega?

mężczyzna z telefonem w ręku podnoszący rękę - metafora mobile first

Krótko mówiąc na priorytetyzacji użytkowników mobilnych i zaczynania prac nad stroną od wersji na smartfony i podobne urządzenia. Podejście to łączy zasady Responsive Web Designu i skalowania UX dla systemów mobilnych. Czemu warto tak projektować stronę? Powodów jest kilka:

  • Google pozycjonuje lepiej strony budowane zgodnie z zasadami RWD,
  • Zaczynając development od wersji mobilnych i potem przechodzenia do developmentu dla desktopu, oszczędza czasu i ułatwia skalowanie  rozwiązań,
  • Jak już powiedzieliśmy coraz więcej ludzi łączy się z internetem częściej za pomocą smartfonów. konwersja,
  • Łatwiejsza optymalizacja UX obu wersji.

RWD jest już obowiązującym standardem, użycie mobilnych urządzeń do aktywności internetowej rośnie, a Accelerated Mobile Pages tylko tę aktywność przyśpiesza i optymalizuje. Nic dziwnego, że 

wiele biznesów zyskuje na połączeniu tych technologii. Washington Post przyśpieszył ładowanie swych treści o 88% w porównaniu do tradycyjnych mobilnych wersji strony. Amerykański e-commerce Carved zwiększył współczynnik konwersji o 75% i zmniejszył bounce rate o 33% po wprowadzeniu wersji strony opartej na AMP i PWA.

Co powinieneś wiedzieć o developmencie pod AMP?

Po tym jak zbudujesz już swoją stronę AMP-ową czas sprawdzić, czy wszystkie tagi są obecne i na swoim miejscu. W innym razie, Google nie zcachuje strony jako AMP. Narzędziem dzięki któremu możesz sprawdzić, czy Twoja strona spełnia warunki, jest AMP Validator. Wystarczy, że wkleisz tam swój kod i program sprawdzi go.

Musisz się upewnić, że w każdym wierszu kodu HTML jest dopisany przedrostek “amp”. Dzięki temu crawlery Google’a będą sprawdzały Twoją stronę według wskazanych wymaganiach dla AMP-ów.

Jeśli nie jesteś pewny, czy masz możliwość lub zaplecze pozwalające na budowanie strony z Accelerated Mobile Pages, albo po prostu chcesz gwarancji wysokiej jakości – skontaktuj się ze specjalistami IT takimi jak my. 

Masz pytanie?

Napisz do nas

    PDF, DOC, DOCX, JPG lub PNG (max 5MB)

    *Wymagane







    Andrzej-kurs-programowania

    Andrzej Szylar

    Chief Executive Officer

    E-mail:

    andrzej.szylar@univio.com
    Aleksandra

    Aleksandra Bielawska-Clegg

    HR Business Partner

    E-mail:

    Michal

    Michał Duława

    New Business Developer

    E-mail:

    Katarzyna

    Katarzyna Zajchowska

    Marketing Partner

    E-mail: