Dal 2015 si è iniziato a parlare dell’Accelerated mobile Page, una tecnica per creare dei siti web ottimizzati nella velocità di caricamento delle pagine per dispositivi mobili come smartphone e tablet, che solitamente usano delle connessioni meno performanti che provocano rallentamenti nell’apertura di una o più pagine di un sito web.

Conosciuto con l’acronimo di AMP, l’accelerated mobile page è una modalità di sviluppo delle pagine web per permettere il download di contenuti in tempi velocissimi, per ottenere questo risultato bisogna fare un lavoro che comprenda tre cose principali che sono:

• L’implementazione HTML AMP
• Utilizzo di AMP JS
• Utilizzare un servizio per il download dei contenuti ottimizzato con AMP CDN.

Cos’è l’HTML AMP

L’HTML AMP è un’estensione del linguaggio HTML ma con delle proprietà specifiche per AMP, in termini pratici, su di una pagina, sarà necessario sostituire dei tag HTML con quelli corrispondenti HTML AMP.

Cos’è l’AMP JS

Le librerie di AMP JS permettono di utilizzare codice javascript ottimizzato per il miglioramento delle prestazioni, gestire il carico dei download degli script e il supporto ai tag HTML AMP.

Come agisce AMP per rendere più veloce un sito web?

Quali sono le soluzioni utilizzate dal codice AMP per migliorare la visualizzazione di una pagina HTML? Di seguito proponiamo una panoramica su quelle principali.

Esecuzione esclusiva degli script JS asincroni

Javascript rende più interessanti e funzionali le pagine di un sito web mediante effetti ed animazioni e col rendering dinamico dei contenuti, tutto questo richiedere un lungo caricamento nonché l’esecuzione di alcune funzioni che rallentano la velocità con cui viene aperta una pagina.

Il codice JS asincrono esegue i processi che rallentano la visualizzazione dei un contenuto solo dopo che l’utente lo avrà visualizzato.

Caricamento solo delle risorse necessarie

Andando ad indicare le dimensioni degli elementi nel codice HTML, l’AMP tenendo conto della risoluzione del monitor usato per visualizzare il layout costruito secondo quelle specifiche, andrà a scaricare solo gli elementi ottimizzati per la pagina.

CSS in linea

Per evitare ulteriori rallentamenti sulla velocità di visualizzazione di una pagina, l’AMP permette l’uso di soli CSS in linea e che la somma di tutte le istruzioni CSS non abbia un peso superiore a 50 kilobite.

Ottimizzazione del prefetching

AMP analizza ed effettua il download degli elementi che verranno scaricati e gli assegna in una coda con diverse priorità, per cui le immagini e gli annunci verranno caricati solo se visualizzati dall’utente sul momento.

Il Plugin AMP per Wordpress

Sappiamo che i siti realizzati con Wordpress sono in netta crescita, si stima che sul web oltre il 30% sfruttino questo CMS, un dato destinato a crescere.

Wordpress permette di compiere alcune azioni autonomamente e senza dover lavorare sul codice grazie alla presenza dei plugin che, una volta installati, spesso sono già funzionanti e il solo compito da svolgere è  quello di dare la giusta configurazione in linea col proprio sito web.

Nel caso specifico parliamo del plugin AMP per Wordpress sviluppato dalla Automattic con alcuni programmatori esterni alla società di Wordpress.org.

Il plugin può essere scaricato direttamente dalla directory dei plugin di Wordpress, l’installazione e la configurazione è molto semplice, poiché il lavoro da fare è davvero minimo.

Dopo aver eseguito il download del plugin, l’installazione e l’attivazione, non si dovrà fare altro che rigenerare i permalink del sito, sarà possibile trovare una versione AMP dei contenuti aggiungendo al permalink della pagina da aprire questa stringa /amp/.

Non sapete come rigenerare i permalink del vostro sito in Wordpress? Non preoccupatevi, si tratta di un’operazione davvero semplice.

Come rigenerare i permalink in Wordpress

Che abbiate o meno dimestichezza con le impostazioni Wordpress, rigenerare i permalink è un’operazione alla portata di tutti: dopo aver effettuato il login nel pannello di amministrazione di Wordpress, alla vostra sinistrata trovate una serie di voci, selezionate Impostazioni > Permalink.

Nella pagina che si apre, premete su Salva le modifiche in basso, in questo modo il CMS rigenererà tutti gli url dei contenuti caricati fino a quel momento e usare le impostazioni nuove per quelli che verranno inseriti in futuro.

Quando usare AMP?

È chiaro che AMP da una spinta nella visualizzazione delle pagine aperte da dispositivi mobile, un fattore che migliora il ranking sui motori di ricerca, poiché Google, con i nuovi algoritmi, tiene in considerazione anche la velocità di caricamento di un sito da computer, smatphone e tablet.

Utilizzando l’accelerated mobile page, la fruizione dei contenuti su dispositivi mobili è decisamente ottimale, poiché vengono caricati stili CSS semplici e lineari che permettono un’impaginazione del testo migliore e pulita.

Insomma, chi hai dei siti web che si concentrano molto sulla creazione e diffusione dei contenuti può trarre grandi vantaggi dall’AMP, il problema potrebbero avercelo quei portali che lavorano sulla grafica o quelli aziendali, che potrebbero ritrovarsi con una visualizzazione del sito su device mobili completamente stravolta o con elementi mancanti.

Inoltre, su una pagina AMP non si possono visualizzare form, un altro aspetto negativo per chi ha bisogno di acquisire lead, per cui, prima di decidere se è il caso di attuare l’accelerated mobile page, è necessario valutare le esigenze del singolo portale.

Leggi anche: Come ottimizzare il layout dei contenuti del proprio sito web