Google AMP: zabawny i przyjazny dla użytkownika przewodnik po przyspieszonych stronach mobilnych

Obejrzyj wideo. Zignoruj ​​kopię.

To moja rada dla Ciebie, gdy trafisz na witrynę Google poświęconą nowemu projektowi Accelerated Mobile Pages (AMP):

„Projekt Accelerated Mobile Pages (AMP) to inicjatywa typu open source, która uosabia wizję, zgodnie z którą wydawcy mogą raz tworzyć treści zoptymalizowane pod kątem urządzeń mobilnych i ładować je natychmiastowo wszędzie”.

Jeśli nie jesteś programistą i przeczytasz kopię, zostaniesz połknięty żywcem przez żargon.

Obejrzyj jednak wideo, a prawie od razu zrozumiesz, o co chodzi w AMP (nie wspominając o zabawnym odwołaniu do Spinal Tap , patrz poniżej).

Możesz też po prostu przeczytać ten przewodnik, ponieważ będzie to najfajniejsza lektura o AMP i jego wpływie na marketing treści.

Obiecuję.

Co to jest projekt AMP firmy Google?

Od narodzin filozofii Google Zero Moment of Truth w 2011 roku nie było tajemnicą, że chcą „radykalnie poprawić wydajność internetu mobilnego”.

I prawdopodobnie nie muszę Ci mówić, że jest mały problem z wydajnością treści w sieci mobilnej.

Prawdopodobnie masz urządzenie mobilne. Istnieje prawdopodobieństwo, że kliknąłeś łącze na tym urządzeniu na stronie wyników wyszukiwania, w serwisie społecznościowym lub w skrzynce odbiorczej poczty e-mail… chcąc skonsumować zawartość.

Ale to nigdy nie nadejdzie.

Cóż, przychodzi, ale w konwulsyjnej mozaice szarpanych, szarpanych obrazów, filmów i reklam podczas ładowania strony. Patrzysz z przerażeniem z rozszerzonymi oczami, podskakując na swoim miejscu w metrze, jak ktoś, kto musi iść do łazienki.

„Jak długo to zajmie?” nie krzyczysz do nikogo w szczególności.

Kto wie, ale nigdy się nie dowiesz, ponieważ podobnie jak 40 procent populacji, w ciągu 3 sekund za kaucją znajdziesz się na stronie ładowania. Wtedy powiesz, jak mój czarny kot Apollo Monkeystrap, „Le sigh”.

To nieznośne momenty mobilne, takie jak te, które Google chce wyeliminować dzięki AMP.

Jak szybko AMP utworzy Twoje strony?

W skali od 1 do 10, gdzie jeden oznacza „w ogóle się nie ładuje”, a dziesięć „ładuje się w ciągu jednej sekundy”, zawartość AMP będzie ładowana z prędkością 11. (To jest odniesienie do Spinal Tap , przed którym cię ostrzegałem).

Ale poważnie, jak szybko?

Jon Parise, inżynier oprogramowania w Pinterest, powiedział: „Przyspieszone strony mobilne ładują się cztery razy szybciej i zużywają osiem razy mniej danych niż tradycyjne strony zoptymalizowane pod kątem urządzeń mobilnych”.

Cztery razy szybciej to dobrze! Ale co to oznacza dla Ciebie, naszego przyjaznego pasażera metra, który próbuje pobrać stronę internetową na swój telefon komórkowy?

Według NiemanLab, artykuł New York Times zoptymalizowany pod kątem AMP został w pełni pobrany na telefon komórkowy w 2,99 sekundy. Dla porównania w teście w Chrome na szybkim iMacu wersja desktopowa tej strony zajęła 3,82 sekundy (wersja mobilna była szybsza).

Jeśli nie byłeś tego świadomy, NYTimes.com był znany z tego, że był jednym z najwolniej ładujących się mobilnych witryn z wiadomościami po tej stronie Saturna.

Od tego czasu naprawili to.

Czy na pewno to wystarczająco szybko?

Ale poczekaj, mówisz, 2,99 sekundy to wciąż górna granica przedziału czasowego, na który nasz pasażer metra jest skłonny czekać. On, podobnie jak 40 procent populacji, zwolnił po 3 sekundach. 2,99 sekundy to cięcie blisko! To nie jest duża poprawa.

To prawda, ale różnica polega na tym, że w pierwszym scenariuszu innym niż AMP na komputerze strona nadal ładowała się po 3 sekundach. W wersji AMP scenariusza został on w całości pobrany w 2.99.

Co ważniejsze, wersja AMP osiągnęła „domContentLoaded - kluczowy punkt w ładowaniu strony internetowej, w którym kod HTML jest w pełni pobierany, a niektóre ważne analizy zostały zakończone” w 0,857 sekundy.

Mrugnięcie okiem trwa około 0,33 sekundy.

Innymi słowy, mrugnij dwukrotnie, a Ty, nasz dojeżdżający do stacji metra, możesz niemal natychmiast zacząć czytać użyteczną część treści dzięki AMP.

Co sprawia, że ​​tradycyjne strony mobilne ładują się tak wolno?

Myślę, że wiem, ale ponieważ nie jestem programistą, projektantem ani programistą (i nie jestem nawet pewien, czy są to różne dyscypliny), zadzwoniłem do jednego z naszych programistów w Rainmaker Digital, Mike'a Hale'a, aby pomógł mi w tłumaczeniu.

Mike powiedział, że kiedy witryna dla komputerów stacjonarnych zostaje wciągnięta do przeglądarki mobilnej, do przeglądarki mobilnej dostaje się kilkadziesiąt pakietów informacji, które są „wywoływane”, często z różnych hostów.

W starym, powolnym przykładzie z New York Times powyżej, jeden artykuł mógłby zawierać „192 żądania, niektóre do hostów Timesa, większość do wielu innych serwerów obsługujących dziesiątki skryptów”.

Najbardziej przydatna część zostanie pobrana w ciągu 5 sekund po kliknięciu, ale reszta nadal nadchodzi, dlatego ekran podskakuje, gdy przeglądarka ustawia się, a następnie resetuje.

Wciąż zagubiony, nacisnąłem Mike'a: „Ale jakie rzeczy są wymagane ?! Jak się nazywają ?! ”

Mike powiedział mi, że Twój telefon komórkowy może wywoływać skrypty wtyczek społecznościowych, karuzeli obrazów, SlideShares i filmów. W tle prawdopodobnie działa oprogramowanie analityczne, reklamy i skrypty śledzące.

Rozsądne, codzienne rzeczy, ale sumują się. I szybko.

Problem polega na tym, że twoje urządzenie mobilne po prostu nie ma siły przetwarzania, aby szybko to zrobić.

Ta ilustracja wyjaśnia problem z zawartością na telefon komórkowy

Wyobraź sobie, że poszedłbyś do banku, podszedł do kasjera i zażądał 100 dolarów, ale w szczególnej kolejności: piętnaście jednodolarowych, trzy pięciodolarowe, pięć dziesięciodolarowych i jeden dwudziestodolarowy.

Gdyby bank działał tak, jak teraz robi to sieć mobilna, kasjer odbywałby wiele podróży, aby wystawić każdy rachunek osobno.

Każda z tych podróży to „wezwanie”.

Gdyby jednak bank został zoptymalizowany pod kątem AMP, kasjer podałby wszystkie rachunki naraz. Co więcej, prawdopodobnie zignorowałby twoją konkretną prośbę o pewne rachunki i po prostu dostarczyłby banknot stu dolarowy.

AMP ma na celu uproszczenie żądań, które musi wysyłać przeglądarka.

„Jedyny skrypt, jaki możesz wywołać, to javascript AMP” - powiedział Mike. „Wszystko jest zapakowane w jeden pakiet. Oddaję ci wszystko naraz ”.

A oto jak Yoast opisał treści mobilne AMP:

„Porównajmy to z samochodem wyścigowym. Jeśli chcesz, aby samochód wyścigowy był szybszy, dajesz mu szybszy silnik i zdejmujesz z niego cały ciężar. W tym zdejmowaniu obciążenia usuwasz również takie rzeczy, jak tylne siedzenia, klimatyzacja itp. AMP nie jest inny. To skrócona wersja normalnej sieci, ponieważ Google bardziej dba o szybkość niż o dobre funkcje ”.

Czujesz tę gorycz w ostatniej linijce? To nie jest twoja wyobraźnia. Za chwilę do tego dojdziemy. Najpierw przyjrzyjmy się doświadczeniu AMP, aby pomóc Ci zrozumieć, o co mi chodzi.

Jak wygląda zawartość mobilna zoptymalizowana pod kątem AMP?

Na szczęście możesz przetestować wersję demonstracyjną wiadomości AMP.

1. Wyciągnij ten swój smartfon.
2. Otwórz przeglądarkę (dowolną).
3. Wpisz g.co/ampdemo.
4. Wpisz popularne wyrażenia kluczowe, takie jak „Justin Bieber Birthday”, „Jennifer Lawrence” lub „Yoko Ono”, w polu wyszukiwania Google.
5. Kliknij „Wyślij”.

Oto przykład tego, jak będą wyglądać wyniki:

Jak widać, treści AMP są rozliczane najlepiej. Znajduje się w karuzeli, która znajduje się nad fałdą. Standardowe wpisy znajdują się poniżej.

Możesz przewijać tę karuzelę, a gdy znajdziesz artykuł oparty na technologii AMP, który Ci się podoba, kliknij go. Tak to będzie wyglądać:

Zabawna lektura!

Dlaczego Google to robi i czy powinno Cię to obchodzić? (Raczej)

Tutaj robi się dziwnie.

Jak wspomniałem powyżej, od pięciu lat Google ma obsesję na punkcie optymalizacji wydajności sieci mobilnej, dlatego pisaliśmy o tym, jak ważna jest naprawdę duża szybkość witryny (w tym artykule jest sześć narzędzi do testowania szybkości witryny, nawiasem mówiąc) tak długo.

Dlatego w zeszłym roku ostrzegaliśmy Cię przed aktualizacją Google Mobile Update „Mobilegeddon”.

Tak więc w tym momencie AMP jest swego rodzaju kulminacją skupienia się Google na optymalizacji sieci mobilnej, ale w jaki sposób pomaga wydawcom?

Brzmi to uproszczenie, ale Google myśli: użytkownicy uwielbiają treści. Uwielbiają szybkie treści. Im szybciej możesz rozdawać szybkie treści, tym więcej treści można skonsumować.

Jest jednak coś innego w tym posunięciu: Google próbuje wygrać wojnę konsumpcyjną.

Czym różni się AMP od artykułów błyskawicznych i Apple News?

W zeszłym roku zarówno Apple, jak i Facebook uruchomiły aplikacje, które umożliwiają użytkownikom przeglądanie artykułów informacyjnych: Apple News i Instant Articles.

Obie te aplikacje są samodzielnymi produktami.

Christian Cantrell, starszy inżynier ds. Rozwoju doświadczeń w zespole Adobe XD, napisał w Smashing Magazine: „Są to w zasadzie wymyślne agregatory wiadomości z niestandardowymi mechanizmami renderującymi zbudowanymi na podstawie zastrzeżonych formatów syndykacji”.

Innymi słowy, artykuły błyskawiczne i Apple News to odrodzenie RSS.

Z drugiej strony Google stara się dotrzeć bezpośrednio do wydawców i nakłonić ich do optymalizacji treści mobilnych do konsumpcji w otwartej sieci, co pozwala na łatwe wprowadzanie i łatwą dystrybucję, czego nie można uzyskać w aplikacji.

Do tej pory udział wzięło kilku znanych wydawców wiadomości:

• Time Inc.
• Atlantycki
• Vox
• BBC
• Poczta Haffington

Przyłączyło się również wiele firm technologicznych, takich jak WordPress, Twitter, Adobe Analytics, Chartbeat, LinkedIn i Pinterest.

Dwie częste skargi dotyczące AMP

Reklamacje występują w co najmniej dwóch odmianach:

1. Krytycy nienawidzą ograniczeń dotyczących treści mobilnych.
2. Krytycy lamentują, że mały wydawca zostanie ukarany.

Yoast należy do pierwszej kategorii. Joost de Valk napisał: „AMP ogranicza to, co można robić na stronach HTML. Fantazyjny design został usunięty na korzyść szybkości. AMP jest w dużej mierze funkcją nad projektem formularza. ”

Pamiętaj, że dotyczy to nie tylko wyglądu - po wyjęciu z pudełka AMP nie obsługuje formularzy, co oznacza, że ​​strony AMP nie pomogą Ci rozwinąć listy e-mailowej. Dostępne są rozwiązania techniczne, ale sytuacja jest wciąż zbyt nowa, aby zobaczyć, jak będą one ewoluować.

Zauważysz, że głównie duzi wydawcy używają AMP, ale czy to oznacza, że ​​AMP szkodzi mniejszym wydawcom?

Paul Shapiro z Search Engine Land tak powiedział:

„Chociaż doświadczeni programiści często mogą osiągnąć podobne wyniki dzięki intensywnym optymalizacjom wydajności, wydawcy często zaniedbują to ze względu na ograniczone zasoby. AMP umożliwia łatwe osiągnięcie tych optymalizacji bez zmiany podstawowego środowiska mobilnego ”.

AMP może okazać się solidnym narzędziem do optymalizacji doświadczeń mobilnych. Więc powinieneś AMP?

Kto powinien się martwić AMP?

To zależy.

• Czy jesteś gigantycznym wydawcą wiadomości? Następnie panikuj, chyba że masz już solidną strategię dotyczącą wrażeń użytkowników mobilnych. Które powinieneś już mieć kilka miesięcy temu, ale hej.
• Czy uzyskujesz znaczące źródło ruchu z komórek? Ponownie musisz upewnić się, że Twoja strategia korzystania z urządzeń mobilnych jest solidna. Prawdopodobnie chcesz zobaczyć i zobaczyć, jak rozwija się AMP, ale warto trochę eksperymentować.
• Czy jesteś na nowym rynku bez dużej konkurencji? Postaw na optymalizację treści na telefon komórkowy w ciągu najbliższych 30 dni, ale nie panikuj.
• Nie pasuje do żadnej z powyższych kategorii? Następnie usiądź na rękach i obserwuj, co się dzieje.

„Zdecydowanie coś, co warto mieć na radarze wydawcy” - powiedział mi nasz dyrektor ds. Produktów i założyciel StudioPress Brian Gardner. „Ale przypuszczam, że przez jakiś czas będzie to płynna umowa”.

Kto wie? Może być łatwiejszy sposób na zrobienie tego wszystkiego w przyszłości - coś, co zasugerował Jake Goldman, prezes i założyciel 10up, agencji doradztwa w zakresie zarządzania treścią WordPress:

„Z upływem czasu podejrzewamy, że AMP w końcu stanie się tak skomplikowany jak„ nieograniczony ”HTML lub zostanie poddany dyskusji w wyniku postępu w sprzęcie mobilnym, szybkości łączy szerokopasmowych i standardowych funkcji prywatności - rozwiązanie problemu, którego już nie mamy.

Ale powiedzmy, że chcesz bawić się AMP.

Jak stworzyć swoją pierwszą stronę AMP

W tym miejscu możesz podciągnąć spodnie programisty dla dużego chłopca / dziewczynki, ponieważ do rozpoczęcia korzystania z AMP potrzeba kilku podstawowych znaczników.

Zalecam zapoznanie się z tym podstawowym samouczkiem. Nauczy Cię, jak:

• Utwórz swoją pierwszą stronę AMP za pomocą standardowego kodu.
• Ustaw to.
• Sprawdź, czy jest zgodny z AMP ( to bardzo ważny krok ) za pomocą walidatora Google.
• Przygotuj się do publikacji i dystrybucji.

W swoim znaczniku zobaczysz, że niektóre elementy mają tag AMP. W ten sposób tag <img> staje się <amp-img>. Znacznik <anim> staje się <amp-anim>. Znacznik <video> zmieni się na <amp-video>.

I tak dalej.

Co powinni zrobić użytkownicy WordPressa?

Jeśli chcesz wypróbować AMP, masz szczęście.

24 lutego 2016 r. Automattic wydał oficjalną wtyczkę AMP. Dlatego użytkownicy WordPress są tylko wtyczką do pobrania z dala od treści zoptymalizowanych pod kątem AMP.

Pamiętaj jednak: zgodnie z oficjalną stroną wtyczki AMP, wtyczka nie obsługuje stron ani archiwów. Tylko posty.

Ale kiedy aktywujesz wtyczkę - bam - wszystkie twoje posty są automatycznie AMPlified!

Gdy wtyczka jest aktywna, wszystkie posty w Twojej witrynie będą miały dynamicznie generowane wersje zgodne z AMP.

Możesz zobaczyć wersję AMP swoich postów internetowych, wstawiając „/ amp” na końcu adresu URL. Na przykład, wersja AMP twojej strony internetowej.com/amp-wicked-fast staje się twojawebsite.com/amp-wicked-fast/amp.

A jeśli jesteś klientem platformy Rainmaker: mamy AMP na naszych ekranach radarowych. Nie będziemy się w nic spieszyć, biorąc pod uwagę historię dramatycznych zmian w Google o 180 stopni. Ale jeśli w przyszłości okaże się, że AMP będzie ważny, zaoferujemy naszym użytkownikom łatwe rozwiązanie AMP.

Czy AMP jest czynnikiem rankingowym wyszukiwania?

Nie.

John Mueller z Google stwierdził, że AMP nie jest czynnikiem rankingowym. Powiedział, że „Konwersja stron do formatu AMP spełni sygnał rankingowy przyjazny dla urządzeń mobilnych, ale nie ma sygnału rankingowego związanego wyłącznie z AMP”.

Pisarz zespołu Search Engine Journal Matt Southern zauważa:

„Moje pytanie brzmi: jakie to ma znaczenie, czy AMP jest sygnałem rankingowym, czy nie, jeśli zawartość AMP ma już bilet w jedną stronę na górę pierwszej strony? W większości treści AMP plasują się już wyżej niż wyniki organiczne, co jest jednym z największych ulepszeń w rankingu, o jakie można prosić ”.

Tak więc wyjście z gry i bycie przed konkurencją w grze na urządzenia mobilne ma przewagę - marchewka na patyku, którą Distilled ludzie machają ci w twarz w tym filmie Whiteboard Friday.

Kolejny powód, dla którego polecam obejrzenie nagrania Whiteboard Friday, to ludzie z Distilled, którzy zauważyli kolejną ważną różnicę, jaką oferuje AMP: super szybka dostawa przez serwer buforujący.

Tom Anthony, szef działu badań i rozwoju w Distilled, mówi:

„A potem wszystko to zostało zaprojektowane tak, aby było naprawdę mocno buforowane , aby Google mógł hostować te strony, hostować tam Twoje rzeczywiste treści, dzięki czemu nie muszą już nawet pobierać ich od Ciebie”.

Aż do uśmiechu, oto co blog Google miał do powiedzenia na temat ich nowego podejścia do buforowania:

„Dlatego w ramach tych starań opracowaliśmy nowe podejście do buforowania, które umożliwia wydawcy dalsze udostępnianie ich treści, jednocześnie umożliwiając wydajną dystrybucję za pośrednictwem wysokowydajnej globalnej pamięci podręcznej Google. Zamierzamy otworzyć nasze serwery pamięci podręcznej, aby każdy mógł z nich korzystać bezpłatnie ”.

Lubię za darmo.

Czy AMP wpłynie na Twoje reklamy?

Nie powinno.

Według Google „Chcemy wspierać szeroką gamę formatów reklam, sieci reklamowych i technologii. Każda witryna korzystająca z AMP HTML zachowa wybrany przez siebie sieci reklamowe, a także wszelkie formaty, które nie szkodzą komfortowi użytkownika ”.

A jeśli się zastanawiasz, oto lista obsługiwanych sieci reklamowych z oficjalnej witryny projektu Google AMP:

• A9
• Adform
• AdReactor
• AdSense
• AdTech
• Dot and Media
• Podwójne kliknięcie
• Flite
• plista
• Smart AdServer
• Yieldmo
• Revcontent

Nawiasem mówiąc, myślę, że AMP ma również złagodzić obawy wydawców związane z rosnącą popularnością blokerów reklam. Ale to już inna historia na inny raz. Prawdopodobnie czas to zakończyć.

Do Ciebie …

Łał. Omówiliśmy tutaj wiele spraw.

Dziękuję, że jesteście ze mną. Mamy nadzieję, że znalazłeś to przydatne i odpowiedziałem na wszystkie Twoje pytania dotyczące projektu Google AMP.

Jeśli nie, napisz do mnie w komentarzach poniżej. Dodatkowo zostaw komentarz, jeśli masz coś do dodania do tego, co napisałem lub jeśli coś przeoczyłem.

Tak czy inaczej, czekam na wiadomość od Ciebie.