Questa guida vi sarà utile se avete intenzione di attivare le pagine AMP sul vostro sito WordPress e state già utilizzando i plugin SEO Yoast e/o W3 Total Cache.

Il vantaggio di avere delle pagine AMP è ormai noto a tutti i webmaster e seo specialist, google sta premiando tutti i siti che hanno adottato questa tecnologia, tanto da creare un’apposita sezione di controllo all’interno del search console.

Per chi ancora non sapesse bene in che consiste la tecnologia AMP e volesse approfondire il discorso ecco il sito ufficiale del progetto https://www.ampproject.org/it/ e la guida ufficiale del search console https://support.google.com/webmasters/answer/6340290?hl=it

Con WordPress è veramente molto semplice attivare le pagine AMP ed esistono svariati plugin utili allo scopo, bisogna però fare molta attenzione alla configurazione già esistente del proprio sito, in certe situazioni si possono infatti generare delle incompatibilità o degli errori all’interno del codice delle pagine AMP che ne impedirebbero la validazione.

Alcuni di questi casi si verificano proprio sui siti che utilizzano due dei plugin più diffusi in assoluto: SEO Yoast e W3 Total Cache.

Ecco allora come attivare le pagine AMP nel caso in cui abbiate un sito WordPress con uno (o entrambi) di questi plugin installati evitando conflitti e problemi di validazione.

Avete un sito WordPress con SEO Yoast già installato?

Dovete sapere che sono richiesti degli accorgimenti per garantire la corretta implementazione delle pagine AMP e la piena compatibilità con il plugin SEO Yoast. In questo caso la risorsa ufficiale da seguire è la seguente: https://yoast.com/setting-up-wordpress-for-amp-accelerated-mobile-pages/

La soluzione proposta è molto semplice e garantisce la piena compatibilità con SEO Yoast, consiste nell’installazione dei 2 seguenti plugin:

• AMP
• Glue for Yoast SEO & AMP

SEO Yoast consiglia l’installazione del plugin AMP https://wordpress.org/plugins/amp/ che si occupa a tutti gli effetti della generazione della versione AMP dei vostri contenuti congiuntamente all’installazione di Glue for Yoast SEO https://wordpress.org/plugins/glue-for-yoast-seo-amp/ che fa in pratica da ‘collante’ tra il plugin AMP e SEO Yoast. Grazie a questo plugin i meta-dati gestiti da SEO Yoast vengono correttamente impostati nelle versioni AMP delle pagine e l’integrazione tra i diversi sistemi è completa.

Al termine di questa procedura avrete un sito che genera, per le tipologie di contenuti che avrete scelto (normalmente i soli post), una versione AMP raggiungibile aggiungendo il suffisso /amp/ dopo lo slug finale della url del contenuto principale, es.: www.miosito.it/slug-del-mio-articolo/amp/

Notare che il fatto di far rispondere la versione AMP della pagina aggiungendo il suffisso /amp/ non è uno standard ma una semplice scelta fatta dagli sviluppatori del plugin AMP.

Da questo punto di vista Google non impone alcuna regola particolare e le soluzioni potrebbero quindi essere anche altre.

Sul vostro sito WordPress state usando anche W3 Total Cache?

W3 Total Cache è probabilmente il plugin più utilizzato per migliorare le performance dei siti WordPress, consentendo di attivare un sistema evoluto di cache, di minimizzare Javascript e CSS e molto altro ancora. Ma attenzione, in caso voleste attivare le pagine AMP su un sito WordPress con W3 Total Cache attivo dovrete evitare che queste pagine vengano processate da W3 Total Cache. L’impostazione standard del plugin prevede infatti che vengano inserite in cache anche le pagine AMP e che su queste venga attivata l’ottimizzazione di .JS e .CSS, il cosiddetto minify. Questa impostazione causa degli errori di validazione nelle pagine AMP, con conseguente mancata indicizzazione delle stesse in google.

I topic sul sito del supporto WordPress che espongono il problema sono i seguenti:

• https://wordpress.org/support/topic/disable-on-amp-pages/
• https://wordpress.org/support/topic/disable-on-amp-pages-1/

La soluzione è quella di escludere dalla cache e dall’opzione minify di W3 Total Cache tutte le pagine che terminano con lo slug /amp/ (impostazione di base proposta dal plugin AMP), di seguito vi spiego come fare.

Nel campo ‘Never cache the following pages:’ della sezione Page Cache e nel campo ‘Never minify the following pages:’ della sezione Minify aggiungere la seguente regola:

.*/amp/

Così facendo avrete escluso tutte le pagine che terminano con lo slug /amp/ del sito dal processo di ottimizzazione di W3 Total Cache, evitando quindi la generazione dei problemi sopra riportati.

Validazione e indicizzazione delle pagine AMP

Bene, ora che avete impostato WordPress con i nuovi plugin e con le nuove configurazioni non resta che testare le versioni AMP delle pagine e validarle con l’apposito strumento messo a disposizione da Google. I Metodi di validazione delle pagine AMP sono diversi e sono illustrati nel seguente documento https://www.ampproject.org/docs/guides/validate.

Il metodo più immediato risulta sicuramente essere quello del tool online che risponde al seguente indirizzo: https://validator.ampproject.org/

Eseguite il test e verificate l’esito finale, eventuali errori vi verranno immediatamente segnalati.

Seguendo queste indicazioni dovreste riuscire ad ottenere delle pagine AMP che superino il test di validazione e che siano quindi pronte per essere indicizzate su Google.

Ma non finisce qui!

Ora dovrete attendere che Google si accorga della novità, come sempre in questi casi vi viene incontro il Search Console con la sua sezione appositamente dedicata alle pagine AMP, ecco un’utilissima risorsa a riguardo: https://productforums.google.com/forum/#!topic/webmaster-it/UM51Tei68BE

Un consiglio finale

Un aspetto fondamentale che alcuni seo specialist o sviluppatori perdono spesso di vista in questi casi è quello di verificare che nel post standard di WordPress venga correttamente inserito il riferimento alla relativa versione AMP della pagina. Google infatti non ha altri modi per rilevare l’esistenza della versione AMP di una pagina se non tramite l’inserimento, nella pagina principale, del tag <link> con attributo rel=”amphtml” e puntamento alla url della versione AMP di quella pagina.

Per eventuali approfondimenti su questo e altri aspetti correlati vi rimando al seguente link: https://codelabs.developers.google.com/codelabs/accelerated-mobile-pages-foundations/#5

Abbiamo visto come creare le pagine AMP su WordPress senza avere problemi con SEO Yoast e W3 Total Cache, configurazioni usate sulla maggior parte dei siti, spero che questa guida vi sia utile e vi invito a lasciare commenti con le vostre esperienze, eventuali correzioni e/o richieste.

Buon lavoro!

 

IMPORTANTE AGGIORNAMENTO DEL 20/12/2016

A pochi giorni di distanza dall’attivazione del sistema illustrato nella prima parte di questo articolo mi sono accorto che qualcosa non stava funzionando a dovere, avevo infatti un numero di visite più basso del solito in Google Analytics.

Ho fatto delle verifiche e mi sono accorto che il plugin Glue for Yoast SEO & AMP non riporta automaticamente lo script di tracciamento di Analytics all’interno delle pagine AMP e approfondendo ho scoperto ancora di più, cioè che le pagina AMP necessitano di uno script Analytics ad-hoc, diverso dall’implementazione standard che viene fatta per le normali pagine del sito web.

Di fatto non stavo tracciando alcun accesso alle versioni AMP dei miei post!

Lo standard di implementazione del codice Google Analytics per le pagine AMP è illustrato dettagliatamente in questa guida:
https://developers.google.com/analytics/devguides/collection/amp-analytics/

Sono andato nelle opzioni del plugin Glue for Yoast SEO & AMP (disponibili all’interno di SEO Yoast) e ho visto la possibilità (opzionale, forse questo mi aveva ingannato) di inserire il tracking code di analytics per le pagine AMP, ho pensato quindi di aver trovato la soluzione ma, ahimè, così non è stato… al momento del salvataggio il campo del tracking code veniva svuotato e nelle pagine AMP non veniva implementato alcun codice!

Cercando in rete una possibile causa e soluzione ho trovato questo thread nel supporto ufficiale del plugin che non fa ben sperare:

https://wordpress.org/support/topic/google-tracking-code-will-not-save/

Sono infatti molti gli utenti che lamentano lo stesso problema, senza un’apparente facile soluzione, ho quindi deciso di attivarmi per una soluzione alternativa che ha funzionato alla perfezione e che vi illustro di seguito.

AMP for WP – Accelerated Mobile Pages

Grazie a questo plugin https://it.wordpress.org/plugins/accelerated-mobile-pages/ ho risolto definitivamente il problema, va installato sempre congiuntamente al plugin AMP descritto a inizio articolo, in questo caso avrete accesso alle opzioni non più all’interno dell’interfaccia di SEO Yoast ma direttamente dalla sidebar sinistra del backend di WordPress.

AMP for WP vi chiederà di inserire il solo ID di monitoraggio del vostro Analytics e si occuperà lui di inserire il tracking code richiesto per le pagine AMP.

COMODISSIMO!

Inoltre ho scoperto che, rispetto a Glue for Yoast SEO & AMP, mette a disposizione maggiori opzioni di controllo sul layout finale delle vostre pagine AMP, consentendo, tra le altre cose, di inserire il vostro logo con link verso la home del sito (amp o non amp lo potete scegliere voi), di scegliere un menu di navigazione (responsive) da attivare, di inserire automaticamente anche i link al precedente post e ai post correlati (per categoria o per tag), invogliando quindi gli utenti a continuare la navigazione sul vostro sito, cosa non da poco… il precedente plugin non inseriva alcuno di questi link e neanche gli sharing button, altra opzione gestita invece da AMP for WP.

In definitiva l’utilizzo di AMP for WP mi sembra (decisamente) una soluzione più avanzata e completa per implementare le vostre pagine AMP rispetto alla soluzione illustrata nella prima parte dell’articolo… è proprio vero che non si finisce mai di imparare.

Ricordatevi, anche in questo caso, delle regole di esclusione in W3 Total Cache per evitare il minify delle pagina AMP che altrimenti non saranno validate e indicizzate.

Aspetto i vostri commenti, a presto!