Pagine mobili accelerate: AMP per l’ottimizzazione mobile di WordPress

Pagine mobili accelerate per WordPress

Navigare e navigare su Internet dovrebbe essere semplice e veloce. I webmaster cercano costantemente di renderlo possibile ottimizzando le prestazioni del sito Web e migliorando la velocità del sito, e un ottimo modo per raggiungere questo obiettivo è con AMP per WordPress.


I siti Web sono stati progettati principalmente per lo schermo più grande. Ma gli schermi più piccoli stanno aumentando di numero e persino sorpassando laptop e personal computer. I cellulari ora rappresentano 65% del tempo dei media digitali. I dispositivi portatili hanno bisogno di caricare le pagine più velocemente che su schermi più grandi, se non più velocemente.

Per soddisfare questa richiesta di caricamento rapido dei contenuti, sono disponibili app progettate per piattaforme mobili specifiche su Apple (Notizie), Facebook (Instant Articles) e Snapchat (Scopri). All’inizio di quest’anno. Google ha introdotto la Pagina mobile accelerata (AMP) per accelerare la consegna dei contenuti mobili e offrire un’esperienza utente migliore.

Che cos’è AMP?

AMP per WordPress: Progetto AMP

Progetto AMP è stato annunciato da Google nell’ottobre 2015, e lanciato a febbraio 2016. È un’iniziativa open source che offre agli editori i mezzi per creare una volta contenuti ottimizzati per dispositivi mobili e caricarli immediatamente sul Web mobile.

Il 24 febbraio 2016 Google ha iniziato a distribuire contenuti conformi a AMP in un carosello nella pagina dei risultati di ricerca mobile. Gli utenti possono scorrere la giostra e toccare l’elemento che vogliono leggere. Pinterest ha riferito di essere le pagine 4 volte più veloce, utilizzando 8 volte meno dati rispetto alle normali pagine ottimizzate per dispositivi mobili. Ciò è possibile a causa del modo in cui le pagine vengono formattate e consegnate.

Ad agosto 2016, Ricerca Google ha oltre 150 milioni di documenti AMP nel suo indice e cresce al ritmo di 4 milioni a settimana. All’inizio di agosto, Google ha anche avviato a anteprima della ricerca di Google per contenuti ampliati. Prevede di attuarlo in modo più ampio entro la fine dell’anno.

AMP per WordPress: Anteprima di ricerca AMP

AMP in Anteprima di ricerca

Puoi dare un’occhiata alle pagine a caricamento rapido nella ricerca abilitata per AMP Qui. Dai un’occhiata usando il link sul tuo telefono cellulare (non funzionerà sui desktop).

Quali siti Web dovrebbero usare AMP?

A febbraio, il progetto è stato avviato per gli editori. Ma l’adozione di AMP si è diffusa ben oltre l’industria editoriale per l’intrattenimento, i viaggi, l’e-commerce e altro ancora.

Rapporti favorevoli vengono ricevuti dai primi utenti. Con un miglioramento dell’88% nei tempi di caricamento dei documenti AMP, Rapporti del Washington Post un aumento del 23% del numero di utenti di ritorno dai telefoni cellulari. eBay è una delle principali aziende di e-commerce che passa ad AMP con quasi 15 milioni di pagine di esplorazione di prodotti basate su AMP. In breve tempo, si prevede che queste pagine saranno accelerate per essere scoperte in una ricerca.

Quindi quali siti Web dovrebbero utilizzare AMP? Sicuramente quelli che fanno molto affidamento sui dispositivi mobili per il traffico. Ma considerando che sempre più utenti scelgono di utilizzare i propri dispositivi mobili per navigare in Internet AMP per WordPress (o qualsiasi sito Web) potrebbe essere una buona aggiunta.

Cosa c’è di diverso in AMP?

Questo sistema di distribuzione dei contenuti si basa sul framework AMP HTML ed è più veloce del solito HTML perché,

  • È una versione snella del normale framework HTML, meno tutto il contenuto JavaScript. Per JavaScript, il framework si basa sulla libreria AMS JS comune.
  • Il contenuto viene memorizzato nella cache e archiviato in un cloud comune, quindi viene eliminato il tempo necessario per eseguire query e recuperare dal server.

Ci sono molte altre differenze, ma le due menzionate qui dovrebbero darti una comprensione rapida e ampia.

Perché editori e blog dovrebbero abilitare AMP

Finché la lettura di pagine a caricamento lento sui cellulari rimane un’esperienza scoraggiante per gli utenti, gli editori perdono le entrate derivanti dalla pubblicità sui cellulari. AMP aiuterà a portare e trattenere un visitatore per periodi più lunghi sul sito Web e ha il potenziale per generare clic.

Le pagine AMP vengono visualizzate accanto a un’icona a forma di fulmine per contrassegnarle dalle normali pagine Web. I visualizzatori che fanno clic su questa opzione, verranno indirizzati direttamente alle pagine AMP all’interno del visualizzatore AMP. Non solo, i contenuti saranno immediatamente disponibili su una ricerca di Google e accessibili tramite piattaforme social come Twitter, LinkedIn, WordPress, Parse.ly, Adobe Analytics, Nuzzel e Pinterest.

Inoltre, gli editori avranno accesso a Google Analytics per osservare il rendimento delle loro pagine. Possono individuare i loro migliori contenuti e utilizzarli per ottimizzare le prestazioni del sito Web e l’esperienza dell’utente.

AMP offre un altro vantaggio in quanto si occupa dell’alta prestazione e dell’esperienza dell’utente, quindi le risorse dei publisher possono concentrarsi sulla fornitura di contenuti di qualità.

Quali ottimizzazioni sono necessarie per AMP

AMP è in realtà molte ottimizzazioni al sito web fatto in modo uniforme come richiesto da Google. Le varie ottimizzazioni che è necessario eseguire per rendere conforme una pagina Web AMP,

  • Consenti solo JavaScript asincrono – per impedire che ritardi il rendering della pagina. Ciò significa che non è possibile utilizzare alcun JavaScript creato e fare affidamento sugli elementi AMP per gestire il contenuto interattivo delle pagine. JS in iframe è consentito, ma solo se non impedisce il rendering.
  • Dimensione statica di tutte le risorse – AMP carica la pagina senza attendere il download di risorse come immagini e iframe. La dimensione di queste risorse deve essere dichiarata in HTTP, quindi la dimensione e la posizione di queste risorse sono note prima dell’inizio del download.
  • Non lasciare che i meccanismi di estensione blocchino il rendering – se un’estensione deve essere inclusa nella pagina, lo script personalizzato deve informarne il sistema. Quindi viene creato uno spazio per l’estensione, anche prima che AMP sappia cosa includerà. Le estensioni per lightbox, embed e tweet di Instagram vanno bene in quanto non bloccano il rendering della pagina, anche se richiede ulteriori richieste HTTP.
  • Tieni tutti i JavaScript di terze parti fuori dal percorso critico – JavaScript personalizzato è consentito solo negli iframe in modalità sandbox. In questo modo non impedisce il caricamento della pagina principale.
  • Tutti i CSS devono essere in linea e limitati dalle dimensioni – questo aiuta a ridurre il numero di richieste HTTP nel percorso critico.
  • L’attivazione dei caratteri deve essere efficiente– il sistema AMP non consente richieste HTTP fino all’avvio del download dei caratteri.
  • Ridurre al minimo i ricalcoli delle dimensioni – i ricalcoli ritardano il rendering, quindi deve essere ridotto al minimo.
  • Esegui solo animazioni abilitate per GPU – tutte le animazioni devono poter essere eseguite su GPU (unità di elaborazione grafica).
  • Dai la priorità al caricamento delle risorse – Viene caricato solo il contenuto necessario per primo, con annunci e immagini recuperati il ​​più presto possibile, ma caricati solo quando richiesto. In questo modo la richiesta sulla CPU è ridotta al minimo.
  • Carica le pagine in un istante – il pre-rendering consuma molta larghezza di banda e CPU. Il pre-rendering di AMP carica prima solo il contenuto richiesto e scarica iframe di terze parti e altre risorse solo se necessario.

Sarà disponibile una gamma standard di formati di annunci, reti pubblicitarie e tecnologie. Allo stesso tempo, gli editori possono anche scegliere i propri formati, purché non si trascinino sulla velocità.

Come aggiungere AMP per WordPress

Google ha un lezione a cui puoi fare riferimento per creare pagine HTML AMP di base, metterle in scena, convalidarle come conformi AMP, pubblicarle e distribuirle. Convalida delle pagine AMP è importante, perché in questo modo terze parti come Twitter e Instagram sono fiduciose che le pagine verranno visualizzate bene sulle loro piattaforme.

Per quanto riguarda i siti Web ospitati su WordPress.com, sono automaticamente supportati per WordPress senza dover fare altro. I siti Web WordPress con hosting autonomo possono abilitare AMP per WordPress installando un plug-in.

Plugin AMP WordPress di Automattic

Plugin AMP WordPress di Automattic

Una volta scaricato, installa e attiva il Plugin AMP sul sito Web WordPress, i tuoi post avranno automaticamente una versione AMP generata dinamicamente. È possibile accedere a queste pagine aggiungendo amp alla fine del tuo URL (example.com/my-post/amp). Se non hai abilitato i permalink, aggiungi ?amp = 1 ai link (che potrebbero apparire come example.com/?p=100&amp=1). L’unico altro passo è testare e validare le tue pagine come menzionato sopra.

Non noterai alcuna impostazione o funzionalità per questo plug-in. C’è un’opzione di dashboard aggiunta per AMP Analytics in cui puoi incollare il tuo codice di configurazione JSON, ma è tutto gente.

Questo plugin è il plugin ufficiale della stalla di Automattic e attualmente non supporta pagine e archivi, né è possibile personalizzare le pagine. Ma è un’opzione molto semplice e facile da usare, e puoi trovare una guida tramite documentazione su Github per la personalizzazione.

AMP per WP – Pagine mobili accelerate

AMP per WP Plugin WordPress gratuito

Un’altra grande opzione gratuita è AMP per WP. Questo plug-in gratuito per WordPress offre una configurazione semplice e veloce: basta installare, abilitare le impostazioni e iniziare a generare automaticamente il tuo AMP per il tuo sito web. Bonus: questo plugin è anche compatibile con più siti.

Esistono impostazioni integrate per l’abilitazione di AMP (post, pagine, archivi), l’aggiunta di aree pubblicitarie mobili, dati strutturati (una parte importante del SEO), l’integrazione di Yoast SEO meta tag, opzioni avanzate di indice / no-index, notifica push, nativo Commenti su AMP, traduzioni AMP personalizzate (se stai usando una lingua diversa dall’inglese, ti consigliamo di aggiornarla) e altro ancora. Le impostazioni sono molto complete per un plugin gratuito che è fantastico.

Soprattutto, questo plugin offre opzioni di progettazione in modo da poter personalizzare l’aspetto dell’output AMP. Usa i temi AMP predefiniti inclusi o usa i loro Quadro tematico AMP per creare il tuo design unico nel suo genere.

Offre anche AMP per WP estensioni premium per aggiungere funzionalità (come un invito all’azione o la memorizzazione nella cache AMP) e il supporto per plugin popolari tra cui WooCommerce, Advanced Custom Fields e Contact Form 7.

Altri modi per aggiungere AMP per WordPress

Naturalmente questo non è l’unico modo per aggiungere AMP al tuo sito Web basato su WordPress. Altri plugin che possono aiutarti con i siti Web AMP per WordPress includono:

  • WP AMP – per creare un design AMP personalizzato senza codifica e aumentare la SEO. Puoi leggere di più qui.
  • Pagine mobili accelerate (AMP) per WordPress – per creare un tema AMP per il tuo sito Web.
  • AMP personalizzato – per personalizzare il contenuto AMP.
  • Articoli istantanei di Facebook e pagine AMP di Google – pubblicare e gestire i tuoi contenuti direttamente da WordPress su Google AMP Pages con supporto per annunci e analisi.
  • Colla per Yoast SEO e AMP – per garantire che il plug-in AMP di WordPress predefinito utilizzi i metadati Yoast SEO appropriati e consenta la modifica del design della pagina AMP.

Dovresti aggiungere AMP per WordPress?

Sebbene AMP non sia obbligatorio per le pagine Web da scoprire da parte di Google, è abbastanza ovvio che Google mirerà a implementare il progetto AMP in un modo più ampio alla fine. Allo stato attuale, la conformità AMP non è un fattore separato per classifica di ricerca di Google. Anche se è ragionevole supporre che sarà importante ad un certo punto,

Se tieni presente che la velocità di caricamento della pagina è un fattore nella classifica dei motori di ricerca, non hai davvero molta scelta se vuoi far parte di Internet mobile. Se le classifiche dei motori di ricerca sono importanti per te, tutti i ripensamenti su come procedere AMP potrebbero svanire.

Ma far parte del progetto richiede una stretta aderenza alla formattazione richiesta da Google e potrebbe non essere la tazza di tè di tutti. Limita ciò che puoi mettere sul tuo sito Web e può rendere tutti i blog un po ‘uniformi e privi di individualità. Alcune animazioni non sono consentite e i moduli non sono supportati. E per quanto riguarda le landing page, AMP potrebbe non essere affatto una buona idea. Inoltre, potrebbero esserci siti Web che sottolineano l’estetica e il marchio sulla velocità, per i quali AMP potrebbe rivelarsi un smorzatore.

Tuttavia, se vuoi creare un’esperienza veloce e coinvolgente per i tuoi utenti e farli rimanere più a lungo, devi considerare seriamente AMP per WordPress (o qualsiasi altro tipo di sito web che potresti eseguire). Se è un punto sulla giostra AMP nelle pagine di ricerca di Google che vuoi angolare, sali sul carrozzone AMP.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me