Utilizarea Google AMP pentru a face ca paginile mobile ale site-ului dvs. WordPress să se încarce mai rapid

De ce contează viteza paginii

Dacă, la fel ca miliarde dintre noi, ați consumat recent conținut web pe un dispozitiv mobil, ați observat că experiența ar putea fi îmbunătățită. Citirea articolelor de știri este adesea dureros de lentă , încărcarea paginilor durează mult. Chiar și după ce textul se încarcă pe pagină, paginile continuă să se încarce timp de mai multe secunde, pe măsură ce reclamele, javascriptul de urmărire și imaginile sunt descărcate.
Aplicațiile mobile ne-au obișnuit cu încărcarea rapidă a conținutului , vizualizarea offline și interfețele rapide. Dar site-urile mobile rămân adesea în urmă, la propriu. Acest lucru este valabil mai ales pentru site-urile de știri și bloguri, care folosesc multe widget-uri pentru reclame, analize, partajare și comentarii. Puteți testa acest lucru cu ușurință instalând un blocator de conținut pe un dispozitiv iOS și observând creșterea vitezei.
Sigur, puteți folosi o temă receptivă pentru a atenua unele dintre probleme, dar designul receptiv nu se ocupă de performanța de încărcare a paginii. De cele mai multe ori, responsive este la baza problemei : proiectăm site-uri web capabile să se potrivească pe display-uri de multe rezoluții diferite și nu reușim să creăm o experiență optimizată pentru cele mai mici afișaje, performanță mai scăzută a procesorului și cele mai lente conexiuni. Cu un design receptiv, toate elementele desktop și funcționalitățile se vor încărca în continuare atunci când pagina este redată pe mobil, ceea ce duce adesea la performanțe slabe. Potrivit Facebook, timpul mediu de încărcare a unui articol de știri pe mobil este de 8 secunde.
În timp ce unii dintre noi sunt destul de norocoși să aibă conexiuni de rețea 3G sau 4G pe smartphone-urile noastre, trebuie doar să ieși din centrele urbane pentru ca viteza rețelei să scadă dramatic. Și, desigur, există „următorul miliard” de oameni și dispozitive care se conectează din țările în curs de dezvoltare, unde conexiunile rapide la rețea pur și simplu nu sunt încă disponibile.
Din fericire, lucrurile se mișcă în direcția corectă, toți jucătorii mari lucrând la modalități de a accelera încărcarea conținutului pe dispozitivele mobile. Facebook a lansat Instant Articles, o soluție pentru încărcarea rapidă a conținutului web, deși una limitată la grădina lor cu pereți. Apple și-a lansat propria aplicație Știri. Google a lansat AMP (Accelerated Mobile Pages), o inițiativă cu un scop similar cu cel al Facebook, dar o abordare standard deschisă.
WordPress a anunțat recent că a adăugat suport pentru paginile mobile accelerate (AMP) de la Google pe WordPress.com și pe site-urile WordPress.org sub forma unui plugin gratuit.
Așa că haideți să vedem cum puteți adăuga AMP pe blogul dvs. WordPress.org sau pe site-ul de știri și să beneficiați de cea mai recentă tehnologie pentru a vă accelera site-ul pe dispozitivele mobile.

Ce este Google AMP?

Promisiunea AMP a Google este de a vă face paginile să se încarce instantaneu pe dispozitivele mobile. Rezolvă una dintre ultimele probleme rămase cu internetul mobil. În ciuda faptului că toată lumea îl folosește, internetul mobil este surprinzător de lent. AMP rezolvă acest lucru prin restricționarea numărului de funcții de pe o pagină, eliminând caracteristicile de design pentru viteză. Google a susținut că viteza de încărcare a AMP este cu 85% mai rapidă decât paginile web obișnuite.
AMP creează o vizualizare mobilă specială pentru site-ul dvs. web. Acest nou site mobil vă îmbunătățește conținutul pentru clienții acceptați, cum ar fi căutarea pe mobil Google și Chrome. Această nouă vizualizare se adaugă site-urilor web obișnuite și mobile pe care le aveți deja. În această vizualizare, paginile dvs. arată ca pagini web normale, dar cu tot, cu excepția conținutului, eliminat. Din acest motiv, trebuie să vă asigurați că site-ul dvs. WordPress este pregătit pentru el

Cum funcționează AMP?

HTML AMP este, în esență, un subset de HTML, cu numai anumite elemente JavaScript sunt permise. Accentul se pune pe accelerarea încărcării pentru site-uri cu conținut ridicat, cum ar fi site-uri de știri și bloguri. Deși limitează foarte mult Javascript, permite anumite elemente de analiză și publicitate pe paginile dvs., ceea ce îl face o opțiune bună pentru editorii de știri.
Pentru a-și crea noua vizualizare mobilă, AMP folosește trei elemente principale:

• HTML AMP – Acest subset de HTML adaugă câteva etichete și proprietăți personalizate cu multe restricții care le permit clienților AMP să redeze conținutul dvs. așa cum doriți, fără a vă face griji cu privire la performanță. Pluginul adaugă aceste noi etichete în paginile dvs. în mod automat, dar le puteți utiliza în propriile șabloane specifice AMP, dacă aveți nevoie de ele.
• AMP JS – Acest cadru JavaScript a fost creat pentru paginile mobile care gestionează gestionarea resurselor și încărcarea asincronă care fac ca procesul AMP să funcționeze. Rețineți că nu puteți utiliza JavaScript terță parte în paginile dvs. AMP.
• AMP CDN – AMP oferă o rețea opțională de livrare a conținutului care poate stoca în cache și poate optimiza paginile AMP în continuare.

Instalarea AMP

va trebui să instalați pluginul înainte de a putea utiliza AMP pe site-ul dvs. WordPress. Dacă utilizați WordPress.com, acesta este deja disponibil pentru dvs.

Pluginul oficial

Deși puteți găsi pluginul oficial AMP în magazinul de pluginuri WordPress, veți găsi cea mai recentă versiune doar pe site- ul Github al proiectului . Astfel, aveți o alegere de făcut.
Instalarea pluginului prin WordPress este cea mai rapidă. Trebuie doar să căutați amp-wp în secțiunea „Adăugați nou” din panoul de administrare al pluginurilor WordPress. Apoi faceți clic pe instalare și apoi activați pentru a începe să utilizați AMP pe site-ul dvs. web.
Dacă aveți nevoie de cea mai recentă versiune din orice motiv, va trebui să instalați pluginul manual. După descărcarea pachetului Github, trebuie doar să faceți clic pe „Încărcați pluginul” în panoul „Adăugați pluginuri noi”. Găsiți doar fișierul zip care conține pachetul și lăsați WordPress să preia lucrurile de acolo. Odată ce încărcarea se termină, puteți doar să activați pluginul pentru a începe să îl utilizați.

PageFrog și alte plugin-uri AMP

Pluginul oficial vine direct de la echipa de proiect AMP a Google, ceea ce îl face cea mai actualizată versiune a AMP. Acesta creează o versiune /amp/ a fiecărei pagini și postări pe care le aveți. Trebuie doar să adăugați /amp/ la sfârșitul URL-urilor pentru a le vedea singur.
Cu toate acestea, nu puteți edita aceste pagini AMP. Dacă aveți nevoie de ceva mai mult decât ceea ce vă oferă pluginul de bază, veți avea nevoie de unul dintre celelalte plugin-uri AMP existente, cum ar fi PageFrog.
PageFrog se bazează pe pluginul de bază AMP, permițându-vă să editați unele dintre modificările pe care le face. Vă va permite chiar să adăugați unele caracteristici de stil și tematică, precum și alte protocoale, cum ar fi articolele instantanee ale Facebook. Puteți găsi PageFrog și alte câteva plugin-uri AMP în magazinul de pluginuri WordPress.

Configurarea site-ului dvs. WordPress pentru AMP

Odată ce ați activat pluginul, ați terminat. Pentru majoritatea instalărilor, trebuie doar să creați conținutul așa cum ați proceda în mod normal, iar pluginul se va ocupa de restul. Rețineți, totuși, lucruri precum codul dvs. Google Analytics nu vor funcționa imediat pe paginile dvs. AMP. Citiți pentru a vedea cum să adăugați funcții Analytics și SEO în noile pagini AMP. .

Adăugarea Google Analytics în paginile dvs. AMP

Dacă aveți nevoie de aceste funcții și pe paginile dvs. mobile, trebuie să le adăugați manual la șablonul de pagină single.php al pluginului.
Pentru a face acest lucru, va trebui să faceți clic pe opțiunea de editare de lângă numele pluginului AMP din lista dvs. de pluginuri. De acolo, faceți clic pe linkul single.php pentru a începe editarea acestuia. Vă rugăm să rețineți că este posibil să trebuiască să refaceți acest lucru de fiecare dată când actualizați pluginul.

Pluginuri SEO și AMP

Deoarece paginile dvs. AMP nu vor include nicio caracteristică SEO, veți avea nevoie de un nou plugin SEO compatibil cu AMP.
Din fericire, majoritatea dezvoltatorilor de pluginuri SEO au sau vor avea extensii AMP pe care le puteți folosi . Va trebui să le instalați separat, dar aveți nevoie de ele pentru a vă asigura că toate paginile dvs. funcționează pentru îmbunătățirea SEO a site-ului dvs.
Începând cu acest articol, doar trei pluginuri SEO WordPress au lansat extensii sau actualizări AMP.

• Glue for Yoast SEO – Adaugă suport AMP la pluginul Yoast SEO WordPress
• Schema App Structured Data – plugin pentru schema SEO cu AMP de la schema.org
• WP SEO Structured Data Schema – plugin pentru schema SEO cu AMP de la Kansas City SEO

Remedierea oricăror erori

Ca și în cazul oricărei adăugări la site-ul dvs., doriți să testați paginile AMP pentru erori și inconsecvențe și să le corectați.
AMP încă evoluează și multe dintre funcții pot avea încă erori. Va trebui să remediați manual aceste erori în fișierele șablon înainte de a face publice paginile AMP. Nu uitați că este posibil să trebuiască să vă refaceți modificările de fiecare dată când actualizați pluginul în cazul în care se schimbă ceva.

Publicitate pe paginile dvs. AMP

HTML AMP nu permite JavaScript, așa că anunțurile nu pot fi încorporate direct – în schimb, ele trăiesc în iframe în sandbox, fără acces la conținutul articolului principal.
Google a conceput AMP pentru a permite anumite tipuri de publicitate. Aveți nevoie doar de versiunea compatibilă cu AMP a pluginurilor dvs. publicitare. Puteți găsi o listă completă a acestor plugin-uri compatibile pe pagina AMP Github .
Furnizorii de anunțuri acceptați în prezent includ următorii:

• A9
• AdReactor
• AdSense
• AdTech
• Dublu click

AMP sau aplicație mobilă?

Deși AMP poate ajuta la accelerarea paginilor de articole ale site-ului dvs. în anumite condiții, nu va funcționa în orice situație și pe toate dispozitivele. Nu numai că, vine și cu limitări mari asupra tipului de analize (fără js!) și de publicitate pe care le puteți rula pe paginile dvs.
AMP poate fi o soluție eficientă pentru traficul provenit din căutare, dar ce zici de cei mai fideli cititori ai tăi?
Pentru aceștia, cred că o aplicație are încă mult sens, în funcție de tipul și dimensiunea publicului dvs. O aplicație poate oferi în continuare multe beneficii, chiar și AMP sau Instant Articles nu le oferă : livrarea și reactivarea conținutului cu notificări push, stocarea în cache a conținutului și utilizarea offline, prezența în magazinele de aplicații și, chiar mai important, ecranul de pornire al utilizatorului.
Așadar, dacă sunteți în căutarea unei platforme care să vă ajute să stimulați creșterea în timp, păstrând în același timp controlul asupra conținutului și asupra opțiunilor specifice pentru reclame și analize mobile, atunci luați în considerare publicarea propriei aplicații. Dacă utilizați WordPress pe site-ul dvs. de știri sau blog, atunci s-ar putea să avem soluția potrivită pentru dvs. la MobiLoud .