La premessa alle AMP: l’importanza dell’utenza da mobile
Su scala mondiale il numero di utenti dei dispositivi mobili nel 2018 superava i 5 miliardi di persone. 49 milioni delle quali italiane, connesse sugli smartphone più di 6 ore al giorno a caccia di news o prodotti da acquistare. Questi dati, forniti dall’indagine Global Digital di We Are Social, dicono molto su quanto sia imprescindibile per le aziende raggiungere gli utenti su mobile.
La nascita delle AMP (Accelerated Mobile Pages)
Ma non basta essere presenti online, bisogna esserlo anche con un sito responsive, che si carichi velocemente anche da mobile. L’ideale è che un sito si carichi da mobile in 3 secondi al massimo, oltre quel limite si ha già un 40% di potenziali lettori persi. E senza lettori un sito riduce drasticamente conversioni e vendite. Google escogitò una soluzione a questo problema nel 2015 lanciando le AMP (Accelerated Mobile Pages). Pagine web che si sarebbero caricate quattro volte più velocemente e consumando un numero di dati dieci volte inferiore.
Come sono strutturate le AMP
Dopo questa premessa ti chiederai cosa si nasconde dietro pagine web così “snelle”, veloci a caricarsi da smartphone. Il segreto è tutto nella struttura delle AMP, che prevede una parte denominata AMP HTML. Essa è fatta di tag HTML ma anche di tag AMP per le parti più corpose di codice javascript che riguardano i video, le animazioni e le foto ad alta risoluzione.
Queste stringhe di codice AMP sono fornite da una seconda parte delle AMP: AMP Javascript. AMP JS si occupa anche di testare in sandboxing, ossia con risorse di memoria limitate, le iframes delle pagine web. Essa carica inoltre tutti gli elementi della pagina in modo asincrono (ossia quelli più pesanti vengono caricati successivamente). Infine disabilita molti dei CSS quando rallentano il caricamento di un sito.
Una terza parte delle AMP è la Cache AMP di Google, che consiste nella memorizzazione di pagine AMP nella memoria cache di Google. Questo processo migliora le prestazioni delle AMP secondo il protocollo HTTPS.2. La Cache AMP di Google verifica anche che tutte le AMP siano fatte di tag AMP HTML e non dipendano da risorse esterne al sito.
Dal suo lancio nel 2015 le AMP sono state un formato in continua evoluzione, sul cui codice AMP HTML disponibile su GitHub possono mettere mano anche gli sviluppatori per apportare eventuali migliorie.
Come sfruttare le AMP negli e-commerce
Inizialmente pensate per i contenuti statici (blog e news), le AMP possono essere utilizzate anche migliorare la user experience dei visitatori quando navigano nelle schede prodotto degli e-commerce. Diversamente da come si temeva agli inizi, le AMP sono compatibili infatti anche con rich contents come le pagine di un sito e-commerce.
Basta usarla nei punti giusti, come ad esempio la homepage dell’ecommerce, su cui campeggiano le foto dei prodotti più popolari e il contenuto è prevalentemente statico. Così come nelle pagine di categorie prodotto, o di prodotti singoli. Ora facciamo una carrellata di formati AMP per gli e-commerce.
- AMP carousel per gli slideshow che mostrano foto del prodotto nella scheda o dei prodotti correlati nel footer della pagina web
- AMP video, per alleggerire eventuali video che illustrano funzionalità del prodotto
- AMP accordion, usata per le descrizioni dettagliate di tutte le features di un prodotto in vendita. Su questo tipo di AMP si possono anche applicare i selettori CSS per conferire una particolare veste grafica a questa sezione della pagina web
- AMP social share per i bottoni di condivisione della pagina prodotto sui social media
- AMP sidebar per rendere più snello a caricarsi un elemento dinamico come la sidebar, sulla quale basta un clic dell’utente per aprire menù a tendina laterali, ottimi per facilitare la navigazione in un sito e-commerce
- AMP list per il rendering delle liste di prodotti correlati
- AMP moustache per le stringhe di codice HTML senza logica
- AMP access per mostrare contenuti sponsorizzati agli utenti di quel target nel momento in cui sono collegati al sito e-commerce
Conclusioni
Le AMP per un ecommerce non sono proibitive, ma addirittura consigliate se vuole iniziare, o addirittura portare a termine, una transazione di vendita
