Francesco Giammanco Exit Reader Mode

AMP: cosa sono e come installarle

AMP o pagina mobile accelerata (Accelerated Mobile Page) è una versione di pagina che utilizza un suo codice HTML, se così si può dire, ossia implementa dei tags specifici.

Come dice il nome stesso è una tecnologia volta a migliorare la velocità e l’esperienza sul mobile, motivo per cui se proverete ad aprire una pagina del genere da desktop non sarà per nulla appetibile (ma pur sempre veloce).

AMP è un framework di componenti web (web component framework) open source creato da Google per ridurre la complessità dei siti e aumentare le prestazioni.

Per quanto riguarda la validazione della pagina dopo l’implementazione del codice, basta inserire l’URL sul tool dei test https://search.google.com/test/amp

Applicazioni AMP

Molti addetti ai lavori conoscono l’applicazione per web delle pagine AMP, ma pochi sanno che l’applicazione dei componenti web dedicati vengono utilizzati anche per generare:

Installare le AMP

Il procedimento di installazione delle AMP cambia a seconda della piattaforma in cui si installa, motivo per cui è più corretto discutere di due approcci differenti, ossia quello che riguarda l’installazione del software per la conversione delle pagine tradizionali, e la generazione da zero del codice AMPHTML.

Soluzioni pronte per CMS

Si tratta della strada più semplice, meno costosa in termini di tempo e sicuramente in linea con il creatore tipo di contenuti su CMS.

A riguardo il sistema di management dei contenuti più servito è WordPress, ma in realtà le soluzioni dedicate a questo specifico bisogno sono tante, motivo per cui vi lascerò un elenco esaustivo:

Sebbene il metodo di applicazione degli strumenti sia molto diverso tra loro, in realtà la dinamica di utilizzo di strumenti per le AMP comporta sempre un setup relativo all’header e al footer, solitamente abbastanza guidati, e l’utilizzo opzionali di strumenti (solitamente a pagamento) per l’implementazione di form, ads, e quanto possa servire ad un utente smaliziato.

A meno che non si parli di siti o strumenti pensati per la realizzazione di landing pages o storytelling, difficilmente le pagine accelerated verranno generate senza una controparte HTML.

Generazione di codice AMPHTML

A prescindere dalle difficoltà di adattamento alle modifiche al codice HTML, la versione AMPHTML delle pagine è pressoché identico, sopratutto nella logica, gli unici cambi da dover ricordare riguardano i tags di apertura della pagina e quelli utilizzati per inserire i vari elementi.

Si tratta insomma di una versione “ricreata” della pagina, in cui è possibile inserire anche gli script ma a partire dalla registrazione di un Web Worker che deve caricare in un thread separato il codice.

A riguardo vi lascio una guida e un repository su Github, per iniziare a prendere confidenza col codice.

AMP e SEO

I vantaggi offerti alla performance del sito sono davvero notevoli (sebbene riguardino solo il mobile va bene comunque, si tratta della parte più importante), ma non è questo l’aspetto più importante riguardante l’implementazione delle AMP.

Come ogni buon SEO sa il budget (o crawl budget) dedicato ad un sito è limitato, motivo per cui la generazione di pagine di bassa qualità o semplicemente l’applicazione di una politica SEO semanticamente sconveniente (pagine con argomenti considerati coincidenti da Google), comporta un depauperamento delle risorse a disposizione.

Nel caso della AMP, il loro crawl budget è separato da quello delle pagine tradizionali, e di fatto è come se avessimo una seconda chance per posizionarci nelle ricerche, oltretutto con valori di caricamento delle pagine superiori.

Tag Manager e Google Analytics per AMP

Le implementazioni per le pagine mobile accelerate richiedono uno sforzo in più, visto che i normali codici dei tools più usati non funzionano.

Per quanto riguarda Google Tag Manager e Google Analytics la soluzione è abbastanza semplice, ma si tratta di un metodo che va implementato a parte, ed è additivo, non sostitutivo, rispetto il metodo più conosciuto.

Per iniziare basta creare un nuovo contenitore su Tag Manager, e al momento della scelta si dovrà proprio selezionare AMP come tipologia.

Una volta creato il contenitore, sarà possibile in maniera identica al metodo classico implementare lo script sul sito e poi creare un tag specifico per Analytics.

Notifica per la pagina AMP. Il sistema serve per memorizzare la tua decisione sulla registrazione dei cookie.