AMP PROJECT – Il progetto AMP per ridurre il caricamento dei siti sui dispositivi mobili
Cosa è AMP PROJECT (Accelerated Mobile Pages)?
AMP PROJECT è un nuovo progetto del tutto opensource nato per sopperire alle scarse performance di navigazione da vari dispositivi di siti web.
Un progetto che molte grandi aziende come Google, Twitter, Pinterest, Adobe, WordPress ecc. stanno guidando e sostenendo e che permetta agli utenti che navigano da piattaforme mobili di leggere news ed articoli molto più velocemente senza caricamenti inutili. Pagine HTML leggere strutturate in modo da caricarsi velocemente sui dispositivi mobili!
Come si ottiene un caricamento più veloce con AMP?
Limitando molte risorse e componenti “inutili” in particolar modo i file javascript come slider ma non ad esempio i css o le immagini che visualizzeremo in maniera “smart” ma elegante ed adeguata all’aspetto grafico.
Quanto più veloce può essere il caricamento di una pagina con AMP?
L’incremento delle prestazione varia in base agli elementi da caricare tra il 15% e l’85%.
Naturalmente è possibile ad esempio caricare molte immagini e anche script come analytics per non perdersi le statistiche d’accessi alle pagine AMP.
Google AMP cache
Google afferma che tra i minori dati e la memorizzazione in Google AMP cache, i tempi di caricamento saranno di circa un quarto in media.
Che URL hanno le pagine AMP?
Se hai una pagina del tipo http://www.iltuosito.it/pagina
La rispettiva pagina AMP dovrebbe essere visibile al link: http://www.iltuosito.it/pagina/amp/
Linee guida di Google sul progetto AMP
Specifiche html progetto AMP (Accelerated Mobile Pages)
https://www.ampproject.org/docs/reference/spec.html
Le pagine AMP (Accelerated Mobile Pages) sono pagine web strutturate in base a una specifica open source e Google ha dettato le Linee guida sul progetto AMP
https://support.google.com/webmasters/answer/6340290
Come assicurarsi che le pagine AMP vengano visualizzate correttamente nella Ricerca Google?
1) Design. Crea pagine web conformi alla specifica AMP.
Le tue pagine AMP devono seguire la specifica AMP HTML https://www.ampproject.org/docs/get_started/create_page.html
Specifiche html di basic_markup https://www.ampproject.org/docs/get_started/create/basic_markup.html
2) Rilevamento. Fai in modo che le tue pagine AMP siano rilevabili.
Come Google rileva le tue pagine AMP?
In ogni pagina normale ci deve essere un riferimento alla corrispettiva pagina AMP e cioè:
<link rel=”amphtml” href=”https://www.example.com/pagina-corrispettiva-amp-version.html” />
e un link canonical sempre nell’head per non avere problemi di duplicazione dei contenuti <link rel=”canonical” href=”https://www.example.com/pagina-normale-non-amp.html” />
Nella pagina AMP invece deve essere presente il link canonical
<link rel=”canonical” href=”https://www.example.com/pagina-normale-non-amp.html” />
Eventuali pagine AMP autonome (senza una versione non AMP) dovrebbero essere contrassegnate come versioni canoniche:
3) Convalida. Verifica che le pagine siano scritte in formato HTML AMP valido.
Le pagine con formato AMP non valido non sono idonee per alcune funzioni della Ricerca https://www.ampproject.org/docs/guides/validate.html
Vi basterà recarvi su una vostra pagina amp, aggiungendo alla fine della url: “#development” ed entrare nella console developer di google chrome ad esempio e visualizzare gli errori
4) Dati strutturati. Esegui il markup dei contenuti con dati strutturati.
Solo le pagine con un markup dei dati strutturati appropriato possono essere mostrate all’interno del carosello in alto alle serp:
https://developers.google.com/structured-data/
Test: https://developers.google.com/structured-data/testing-tool
5) Stato. Monitora il rapporto AMP su Search Console per individuare eventuali errori.
All’interno del Google Search Console, è possibile visualizzare se google abbia indicizzato o meno le nostre pagine AMP e se ci sono eventualmente degli errori
Accelerated Mobile Pages (AMP) nel Search Console:
All’interno del Search Console di Google (ex. Google webmaster tool) in : Aspetto della ricerca-> Accelerated Mobile Pages
Accelerated Mobile Pages > Utilizzo di tag HTML non consentito o non valido
“Correggi gli errori in Accelerated Mobile Pages (AMP), affinché le pagine vengano mostrate agli utenti di dispositivi mobili in una posizione ben visibile”
https://www.google.com/support/webmasters/answer/6328309
PROBLEMI CON LE PAGINE AMP nel Search Console:
Se il search console di google ha rilevato problemi sulle vostre pagine AMP, sicuramente riceverete anche un’email dal tema:
“I sistemi Google hanno rilevato che alcune delle tue pagine AMP non sono conformi alle nostre linee guida, pertanto non verranno mostrate nelle funzioni relative all’iniziativa AMP della Ricerca Google. Il seguente rapporto fornisce esempi di pagine con errori: “
Tuti gli errori sono definiti in questa pagina così per comprendere meglio quello riferito a l vostro sito:
AMP Validation Errors https://www.ampproject.org/docs/reference/validation_errors.html
Il tipo di errore viene specificato nel search console di google e cliccando su uno degli errori potreste anche visualizzare i dettagli, url, data, consigli, ecc
Questa è la dicitura di un errore commesso sulle pagine AMP:
Utilizzo di tag HTML non consentito o non valido
Le pagine AMP che utilizzano tag HTML non consentiti o non validi potrebbero essere visualizzate nei risultati della Ricerca Google senza le funzioni di visualizzazione specifiche per AMP. Ulteriori informazioni
1) Rimuovi i tag HTML non consentiti oppure correggi gli attributi o i valori non supportati dallo standard AMP
Consulta la documentazione sulle pagine AMP per conoscerne l’utilizzo corretto. Tieni presente che l’errore è stato rilevato alla data indicata nella parte inferiore del modulo; le modifiche apportate al file dopo tale data non sono incluse nel rapporto. Se hai già corretto l’errore, Google rifletterà le modifiche durante la sua successiva scansione regolarmente pianificata.
Consulta i riferimenti relativi alle pagine AMP
2) Controlla le correzioni
Visita la tua pagina AMP con la modalità sviluppo attivata e apri la console del browser per controllare se sono segnalati eventuali errori di convalida della pagina AMP.
ES:
Dettagli errore search console:
URL mancante per l’attributo “href” nel tag “a”. <-> (Missing URL for attribute ‘href’ in tag ‘a’.)
Si riferisce a delle url ad esempio vuote negli <a href=””…
URL AMP:https://www.webseosem.it/blog/google/google-my-activity-sostituisce-google-history/amp
URL canonico:https://www.webseosem.it/blog/google/google-my-activity-sostituisce-google-history
Ultimo rilevamento: 10/07/16
Errori in console:
Vi basterà dunque correggere l’errore, recarvi sulla console per verificare la correzione ed infine attendere una nuova scansione delle pagina AMP da parte di Google.
Indicizzazione nel search console delle pagine AMP
AMP sarà un nuovo fattore di posizionamento?
Molto probabilmente, anche se molti sono subito corsi ai ripari per il “Google’s Mobilegeddon” https://en.wikipedia.org/wiki/Mobilegeddon, l’algoritmo di aggiornamento del 21 Aprile 2015 che da maggiore priorità di posizionamento ai siti internet veloci e compatibili con i dispositivi mobili e smatphone, in questo caso pochi utenti si stanno adeguando al progetto AMP.
Google “dichiara” un miglior posizionamento?
Ebbene sembra di si anche se non esplicitamente …
Google in merito fa tre dichiarazioni:
“Google ritiene che i contenuti del tuo sito di notizie potrebbero trarre vantaggio da una migliore esposizione nella Ricerca Google, grazie all’implementazione delle pagine AMP (Accelerated Mobile Pages).”
poi…
“I contenuti del tuo sito potrebbero trarre beneficio da una funzione di prossima introduzione nei risultati della Ricerca Google. A breve, Google mostrerà pagine AMP valide complete di funzioni speciali nei risultati di ricerca. Le pagine AMP conformi sul tuo sito saranno considerate idonee a essere mostrate nei risultati di ricerca con queste nuove funzioni.
Ti invitiamo a essere uno dei primi siti ad adottare questa interessante tecnologia. I seguenti passaggi ti guideranno nella procedura di creazione di pagine AMP per i tuoi contenuti.”
“Sembra che nella maggior parte dei casi le “pagine AMP” escano su query legate a notizie: se sei un editore ti consiglio di darci al più presto una occhiata, perché molti dei tuoi concorrenti, che hanno già implementato questa nuova tecnologia, ti stanno togliendo visibilità.”
Poi sul posizionamento fa una marcia indietro …o quasi:
“Sia che si tratti del “carosello” che del “box”, i risultati sono integrati in modo molto prominente sulla pagina di Google. Ciò NON significa che “se utilizzi AMP ti posizioni meglio”, ma il fatto che Google metta in una posizione così alta ed evidente coloro che fanno uso di AMP, spingerà inevitabilmente un sacco di editori a saltare sul carro (tutti i più grossi quotidiani online italiani sono già presenti).”
Test Google AMP
In effetti se da mobile ci rechiamo a questo indirizzo: g.co/ampdemo e ricerchiamo delle news es “torino news” oppure “La Stampa”, visualizzeremo in alto alle serp degli articoli da poter consultare in maniera estremamente veloce e “molto d’impatto”, quindi possiamo già considerarle direttamente come fattore positivo di ranking e visibilità su Google!
I Caroselli di Google AMP sono già attivi!
Dal 23 Febbraio 2016 Google ha cominciato comunque a far visualizzare in serp i primi “Caroselli” in posizione prominente.
Le immagini del carosello si possono scorrere e al click si visualizza direttamente una cache che google ha memorizzato della pagina per aumentare la velocità di caricamento ulteriormente.
Google box
Per alcune query, i siti che implementano AMP, potranno essere inseriti in un box di tre risultati circa dove compare anche l’iconcina AMP.
Si potrà ancora monetizzare con AMP?
Google conferma che se fai uso di banner tradizionali e conformi, potrai sempre monetizzare, ma naturalmente non sarà possibile utilizzare forme di banner invasive e fastidiose:
https://www.ampproject.org/docs/reference/amp-ad.html
Esempi pagina AMP
Esempio con foto in evidenza
Normale:
https://www.webseosem.it/blog/amp-project-accelerated-mobile-pages-progetto-ridurre-caricamento-dei-siti-web-sui-dispositivi-mobili
Pagina AMP:
https://www.webseosem.it/blog/amp-project-accelerated-mobile-pages-progetto-ridurre-caricamento-dei-siti-web-sui-dispositivi-mobili/amp
Esempio con video:
Normale:
https://www.webseosem.it/blog/google/novita-adwords-2016-e-depotenziamento-keyword-planner
Pagina AMP:
https://www.webseosem.it/blog/google/novita-adwords-2016-e-depotenziamento-keyword-planner/amp
Tutte le pagine sono provviste di un codice analytics, logo, menù ed elementi grafici vari…
es. Attuale pagina in AMP:
