AMP Google: Ghidul distractiv și ușor de utilizat pentru paginile mobile accelerate

Publicat: 2020-11-25

Priveste filmarea. Ignorați copia.

Acesta este sfatul meu pentru dvs. după ce ați aterizat pe site-ul Google dedicat noului proiect Accelerated Mobile Pages (AMP):

„Proiectul Accelerated Mobile Pages (AMP) este o inițiativă open source care întruchipează viziunea conform căreia editorii pot crea conținut optimizat pentru mobil o dată și îl pot încărca instantaneu peste tot.”

Dacă nu sunteți dezvoltator și citiți copia, veți fi înghițiți în viață de jargon.

Cu toate acestea, vizionați videoclipul și veți înțelege aproape imediat despre ce este vorba despre AMP (ca să nu mai vorbim de o referință amuzantă Spinal Tap , vezi mai jos).

Sau ați putea citi acest ghid, deoarece va fi cel mai distractiv pe care l-ați citit vreodată despre AMP și modul în care acesta vă afectează marketingul de conținut.

Iți promit.

Ce este proiectul AMP Google?

De la nașterea filozofiei Google Zero Moment of Truth în 2011, nu a fost un secret faptul că aceștia vor să „îmbunătățească dramatic performanțele internetului mobil”.

Și probabil că nu trebuie să vă spun că există o mică problemă cu performanța conținutului de pe web-ul mobil.

Este posibil să aveți un dispozitiv mobil. Și șansele sunt că ați făcut clic pe un link de pe dispozitivul respectiv dintr-o pagină cu rezultate de căutare, un site de socializare sau în căsuța de e-mail ... dornici să consumați conținutul.

Dar nu vine niciodată.

Ei bine, vine, dar într-un amestec convulsiv de imagini, clipuri video și anunțuri sacadate, pe măsură ce pagina se încarcă. Te uiți îngrozit, cu ochii dilatați, sărind în jurul locului din metrou, ca cineva care trebuie să meargă la baie.

„Cât va dura asta?” nu strigi la nimeni în mod special.

Cine știe, dar nu veți afla niciodată pentru că, la fel ca 40% din populație, veți face cauțiune pe pagina de încărcare în termen de 3 secunde. Atunci vei spune, ca pisica mea neagră Apollo Monkeystrap, „Le suspin”.

Sunt momente de nesuferit de pe mobil pe care Google dorește să le elimine cu AMP.

Cât de repede va face paginile dvs. AMP?

Pe o scară de la 1 la 10, una fiind „nu se încarcă deloc” și zece „se încarcă într-o secundă”, conținutul AMP se va încărca la o viteză a paginii de 11. (Aceasta este referința Spinal Tap despre care v-am avertizat).

Dar serios, cât de repede?

Jon Parise, inginer software la Pinterest, a declarat: „Paginile mobile accelerate se încarcă de patru ori mai rapid și folosesc de opt ori mai puține date decât paginile tradiționale optimizate pentru mobil”.

De patru ori mai repede este bine! Dar ce înseamnă asta pentru dvs., prietenosul nostru navetist de metrou care încearcă să descarce o pagină web pe telefonul său mobil?

Potrivit NiemanLab, un articol AMP optimizat din New York Times descărcat complet pe mobil în 2,99 secunde. Pentru o comparație, într-un test în Chrome pe un iMac rapid, versiunea desktop a acelei pagini a durat 3,82 secunde (versiunea mobilă a fost mai rapidă).

Dacă nu știați, NYTimes.com era renumit pentru că este unul dintre cele mai lente site-uri de știri mobile din această parte a Saturnului.

De atunci au remediat asta.

Ești sigur că este suficient de rapid?

Dar așteptați, ziceți, că 2,99 secunde sunt încă la capătul superior al intervalului de timp, naveta noastră de metrou este dispusă să aștepte. El, la fel ca 40% din populație, a salvat cu 3 secunde. 2.99 secunde o taie aproape! Nu este o îmbunătățire.

Adevărat, dar diferența este că, în primul scenariu non-AMP pe un desktop, pagina se încărca încă după 3 secunde. În versiunea AMP a scenariului, a fost descărcat complet în 2.99.

Mai important, versiunea AMP a ajuns la „domContentLoaded - un punct cheie în încărcarea unei pagini web în care HTML este complet descărcat și anumite analize importante au fost finalizate” în 0,857 secunde.

O clipire durează aproximativ 0,33 secunde.

Cu alte cuvinte, clipiți din ochi de două ori și dvs., navetistul nostru de metrou, puteți începe să citiți partea utilă a conținutului aproape instantaneu, datorită AMP.

Ce face ca paginile mobile tradiționale să se încarce atât de încet?

Cred că știu, dar din moment ce nu sunt dezvoltator, proiectant sau programator (și nici măcar nu sunt sigur dacă acestea sunt discipline diferite), am adunat unul dintre dezvoltatorii noștri de aici la Rainmaker Digital, Mike Hale, pentru a mă ajuta să traduc.

Mike a spus că, atunci când un site desktop este tras într-un browser mobil, aveți câteva zeci de pachete de informații care sunt „apelate”, de multe ori de la diferite gazde, în browserul mobil.

În exemplul vechi și lent al New York Times de mai sus, un articol ar putea avea „192 de cereri, unele către gazdele Times, cele mai multe pentru o serie de alte servere care găzduiesc zeci de scripturi”.

Cea mai utilă parte se va descărca în 5 secunde după ce faceți clic, dar restul este încă în curs, motiv pentru care ecranul ricoșează pe măsură ce browserul setează și apoi se resetează.

Încă pierdut, l-am apăsat pe Mike: „Dar ce fel de lucruri se cer ?! Cum se numește ?! ”

Mike mi-a spus că telefonul dvs. mobil ar putea apela scripturile pentru pluginuri sociale, carusele de imagine, SlideShares și videoclipuri. Și apoi există probabil software de analiză, reclame și scripturi de urmărire care rulează în fundal.

Lucruri sensibile, de zi cu zi, dar se adaugă. Și rapid.

Problema este că dispozitivul dvs. mobil pur și simplu nu are mușchiul de procesare pentru a îndepărta rapid acest lucru rău.

Această ilustrație explică problema cu conținutul mobil

Imaginați-vă dacă ați merge la bancă, ați mers la casier și ați solicita 100 de dolari, dar într-o ordine aparte: cincisprezece bancnote de un dolar, trei bancnote de cinci dolari, cinci bancnote de zece dolari și o bancnotă de douăzeci de dolari.

Dacă banca funcționează așa cum o face acum web-ul mobil, atunci casierul ar face mai multe călătorii pentru a vă oferi fiecare factură separat.

Fiecare dintre aceste călătorii este un „apel”.

Cu toate acestea, dacă banca ar fi optimizată cu AMP, casierul vă va oferi toate facturile simultan. Mai mult, el ar ignora probabil cererea dvs. specifică pentru anumite facturi și ar livra doar o factură de o sută de dolari.

AMP își propune să simplifice solicitările pe care trebuie să le facă un browser.

„Singurul script pe care îl poți apela este javascriptul AMP”, a spus Mike. „Totul este înfășurat într-un singur pachet. Îți dau totul dintr-o dată. ”

Iată cum a descris Yoast conținutul mobil AMP:

„Să comparăm acest lucru cu o mașină de curse. Dacă vrei să faci o mașină de curse mai rapidă, îi dai un motor mai rapid și dezbraci toată greutatea. În acest proces de eliminare a greutății, eliminați, de asemenea, lucruri precum scaunele din spate, aerul condiționat etc. AMP nu este diferit de asta. Este versiunea redusă a unui web normal, deoarece lui Google îi pasă de viteză mai mult decât de funcțiile inteligente. ”

Simți acea înțepătură de amărăciune în ultima linie? Nu este imaginația ta. Vom ajunge la asta într-o clipă. În primul rând, să analizăm o experiență AMP pentru a vă ajuta să vedeți la ce mă refer.

Cum arată conținutul mobil optimizat pentru AMP?

Din fericire, puteți testa o demonstrație de conținut de știri AMP.

  1. Scoateți smartphone-ul vostru.
  2. Deschideți un browser (orice browser).
  3. Tastați g.co/ampdemo.
  4. Introduceți în caseta de căutare Google expresii populare de cuvinte cheie precum „Justin Bieber Birthday”, „Jennifer Lawrence” sau „Yoko Ono”.
  5. Apăsați „Trimiteți”.

Acesta este un exemplu al modului în care vor arăta rezultatele:

După cum puteți vedea, conținutul AMP primește o facturare de top. Se află în caruselul care stă deasupra pliului. Intrările standard se află sub acesta.

Puteți parcurge caruselul respectiv și, când găsiți un articol alimentat de AMP care vă place, faceți clic pe el. Așa va arăta:

Lectură distractivă, eh!

De ce face Google acest lucru și ar trebui să vă pese? (Un fel de)

Aici devine ciudat.

După cum am menționat mai sus, Google a fost obsedat de optimizarea performanței web mobile în ultimii cinci ani, motiv pentru care am scris despre importanța vitezei de site-uri web foarte rapide (există șase instrumente pentru a testa viteza site-ului dvs. în acel articol, apropo) la fel de mult timp.

Acesta este motivul pentru care v-am avertizat anul trecut despre Google Mobile Update, „Mobilegeddon”.

Deci, în acest moment, AMP este un punct culminant al concentrării Google asupra optimizării web mobile, dar cum ajută editorii?

Pare simplist, dar Google crede: Utilizatorilor le place conținutul. Le place conținutul rapid. Cu cât puteți transmite mai repede conținut rapid, cu atât mai mult conținut poate fi consumat.

Totuși, mai există ceva în această mișcare: Google încearcă să câștige războiul pentru consumul de știri.

În ce diferență AMP de articolele instantanee și Apple News?

Anul trecut, atât Apple, cât și Facebook au lansat aplicații care permit utilizatorilor să consume articole de știri: Apple News și Instant Articles.

Ambele aplicații sunt produse de sine stătătoare.

Christian Cantrell, inginer senior de dezvoltare a experienței în echipa Adobe XD, a scris pe revista Smashing Magazine: „Sunt, în esență, agregatori de știri fanteziste, cu randere personalizate, construite pe baza formatelor de sindicare proprietare”.

Cu alte cuvinte, articolele Instant și Știrile Apple au renăscut RSS.

Google, pe de altă parte, caută să meargă direct la editori și să-i determine să optimizeze conținutul mobil pentru consum pe web deschis, ceea ce permite o intrare fără efort și o distribuție ușoară, lucru pe care nu îl puteți obține într-o aplicație.

Până în prezent, au participat unii mari editori de știri:

  • Time Inc.
  • Atlanticul
  • Vox
  • BBC
  • Huffington Post

De asemenea, s-au alăturat o serie de companii de tehnologie precum WordPress, Twitter, Adobe Analytics, Chartbeat, LinkedIn și Pinterest.

Două plângeri frecvente despre AMP

Plângerile apar în cel puțin două varietăți:

  1. Detractorii urăsc restricțiile privind ceea ce poate face conținutul mobil.
  2. Detractorii plâng că micul editor va fi pedepsit.

Yoast se încadrează în prima categorie. Joost de Valk a scris: „AMP restricționează ceea ce poți face în paginile HTML. Designul elegant este eliminat în favoarea vitezei. AMP este mult mai mult o funcție decât proiectul formular. ”

Rețineți că nu doar aspectele sunt afectate - din cutie, AMP nu acceptă formulare, ceea ce înseamnă că paginile AMP nu vă vor ajuta să vă dezvoltați lista de e-mailuri. Există soluții tehnice disponibile, dar situația este încă prea nouă pentru a vedea cum vor evolua acestea.

Veți observa că majoritatea editorilor mari folosesc AMP, dar asta înseamnă că AMP este afectat editorilor mai mici?

Paul Shapiro de la Search Engine Land a spus acest lucru:

„Deși dezvoltatorii experimentați pot obține adesea rezultate similare prin optimizări intensive de performanță, editorii neglijează adesea acest lucru din cauza constrângerilor de resurse. AMP permite realizarea cu ușurință a acestor optimizări fără a modifica experiența web primară pe mobil. ”

AMP se poate dovedi a fi un instrument solid pentru optimizarea experienței mobile. Deci ar trebui să AMP?

Cine ar trebui să-și facă griji cu privire la AMP?

Depinde.

  • Ești un editor gigant de știri? Apoi intrați în panică, cu excepția cazului în care aveți deja o strategie solidă pentru experiența utilizatorului mobil. Pe care ar fi trebuit să-l aveți deja în vigoare acum câteva luni, dar hei.
  • Obțineți o sursă semnificativă de trafic de pe mobil? Din nou, trebuie să vă asigurați că strategia dvs. pentru experiența mobilă este solidă. Probabil că doriți să urmăriți și să vedeți cum se dezvoltă AMP, dar s-ar putea să merite câteva experimente.
  • Sunteți pe o piață nouă, fără prea multă concurență? Faceți un lucru ideal pentru optimizarea conținutului dvs. mobil în următoarele 30 de zile, dar nu intrați în panică.
  • Nu vă încadrați în niciuna dintre categoriile de mai sus? Apoi stați pe mâini și monitorizați ce se întâmplă.

„Cu siguranță ceva de păstrat pe radarul unui editor”, mi-a spus Brian Gardner, directorul nostru de produse și fondatorul StudioPress. „Dar presupun că este o afacere fluidă de ceva timp.”

Cine știe? S-ar putea să existe o modalitate mai ușoară de a face toate acestea pe drum - ceva ce Jake Goldman, președinte și fondator al 10up, o agenție de consultanță pentru managementul conținutului WordPress, a sugerat, de asemenea:

„Având în vedere timpul, bănuim că AMP va deveni în cele din urmă la fel de complex ca HTML„ nerestricționat ”sau va fi transformat în discuție prin progresele în hardware-ul mobil, viteza de bandă largă și caracteristicile standardizate de confidențialitate - o soluție pentru o problemă pe care nu o mai avem.

Dar să presupunem că vrei să te joci cu AMP.

Cum să creați prima pagină AMP

Aici trebuie să vă ridicați pantalonii de dezvoltator pentru băieți / fete mari, deoarece este nevoie de o marjă de bază pentru a începe cu AMP.

Vă recomand să vă faceți drum prin acest tutorial de bază. Vă va învăța cum să:

  • Creați-vă prima pagină AMP folosind codul boilerplate.
  • Puneți-o în scenă.
  • Validați dacă este compatibil AMP ( acesta este un pas foarte important ) folosind validatorul Google.
  • Pregătiți-vă pentru publicare și distribuție.

În marcajul dvs., veți vedea că unele elemente au o etichetă AMP. Astfel, eticheta <img> devine <amp-img>. Eticheta <anim> devine <amp-anim>. Eticheta <video> devine <amp-video>.

Si asa mai departe.

Ce ar trebui să facă utilizatorii WordPress?

Dacă doriți să încercați AMP, aveți noroc.

Pe 24 februarie 2016, Automattic a lansat un plugin oficial AMP. Prin urmare, utilizatorii WordPress sunt doar un plugin descărcabil departe de conținutul optimizat AMP.

Rețineți totuși acest lucru: în conformitate cu pagina oficială a pluginului AMP, pluginul nu acceptă pagini sau arhive. Doar postări.

Dar după ce activați pluginul - bam - toate postările dvs. sunt automat AMPlified!

Cu pluginul activ, toate postările de pe site-ul dvs. vor avea versiuni compatibile AMP generate dinamic.

Puteți vedea versiunea AMP a postărilor dvs. web plasând „/ amp” la sfârșitul adresei URL. De exemplu, versiunea AMP a yourwebsite.com/amp-wicked-fast devine yourwebsite.com/amp-wicked-fast/amp.

Și dacă sunteți client Rainmaker Platform: avem AMP pe ecranele noastre radar. Nu ne vom grăbi în nimic, având în vedere istoria Google de schimbări dramatice de 180 de grade. Dar dacă AMP se va dovedi important în viitor, vom oferi utilizatorilor noștri o soluție AMP ușoară.

AMP este un factor de clasare a căutării?

Nu.

John Mueller de la Google a declarat că AMP nu este un factor de clasare. El a spus că „Conversia paginilor în format AMP va satisface semnalul de clasare pentru dispozitive mobile, dar nu există un semnal de clasare asociat exclusiv cu AMP”.

Scriitorul personalului Search Engine Journal, Matt Southern, subliniază:

„Întrebarea mea este: ce contează dacă AMP este un semnal de clasare sau nu, dacă conținutul AMP are deja un bilet într-o singură direcție către partea de sus a primei pagini? În cea mai mare parte, conținutul AMP se situează deja deasupra rezultatelor organice, care este unul dintre cele mai mari impulsuri de clasare pe care le poți cere. ”

Deci, există un avantaj în a ieși acolo și a fi în fața concurenților dvs. în jocul de conținut mobil - un morcov pe un stick pe care oamenii Distila îl flutură în față în acest videoclip de pe Whiteboard Friday.

Un alt motiv pentru care vă recomand să urmăriți videoclipul Whiteboard Friday este că oamenii de la Distilled au susținut o altă distincție importantă pe care AMP o oferă: livrare super rapidă printr-un server de cache.

Tom Anthony, șeful cercetării și dezvoltării la Distilled, spune:

„Și apoi toate acestea sunt concepute pentru a fi cu adevărat stocate în cache, astfel încât Google să poată găzdui aceste pagini, să găzduiască conținutul dvs. real chiar acolo și astfel încât nici măcar să nu mai fie nevoie să-l aducă de la dvs.

Doar pentru rânjet, iată ce a spus Blogul Google despre noua lor abordare a memoriei cache:

„Așadar, ca parte a acestui efort, am conceput o nouă abordare a memoriei cache care permite editorului să găzduiască în continuare conținutul lor, permițând în același timp o distribuție eficientă prin memoria globală Google de înaltă performanță. Ne propunem să deschidem serverele noastre cache pentru a fi utilizate de către oricine în mod gratuit. ”

Îmi place gratuit.

AMP vă va afecta publicitatea?

Nu ar trebui.

Potrivit Google, „Vrem să acceptăm o gamă cuprinzătoare de formate de anunțuri, rețele publicitare și tehnologii. Orice site-uri care utilizează HTML AMP își vor păstra alegerea rețelelor publicitare, precum și orice format care nu afectează experiența utilizatorului. ”

Și în cazul în care vă întrebați, iată o listă a rețelelor publicitare acceptate de pe site-ul oficial Google AMP Project:

  • A9
  • Adform
  • AdReactor
  • AdSense
  • AdTech
  • Dot și Media
  • Dublu click
  • Flite
  • plista
  • Smart AdServer
  • Yieldmo
  • Revcontent

Apropo, cred că AMP este menit, de asemenea, să calmeze temerile editorilor cu privire la adoptarea tot mai mare de blocanți publicitari. Dar asta este o altă poveste pentru altă dată. Probabil că este timpul să încheiem asta.

Este randul tau …

Wow. Am acoperit mult teren aici.

Vă mulțumesc că ați rămas cu mine. Sperăm că ați găsit acest lucru util și am răspuns la toate întrebările dvs. despre Google AMP Project.

Dacă nu, nu ezitați să-mi trimiteți un rând în comentariile de mai jos. În plus, lasă un comentariu dacă ai ceva de adăugat la ceea ce am scris sau dacă mi-a fost dor de ceva.

Oricum ar fi, aștept cu nerăbdare să aud de la tine.