Siamo una società che va di fretta. Facciamo tante cose, delle volte anche più di una contemporaneamente e tutto quello che ci interessa deve essere a portata di click, o meglio, di touch. Tutta questa dinamicità non poteva che orientare le nuove tecnologie verso uno sviluppo del mobile. Da questa nuova necessità nascono, all’interno del Google I/O 2016 e 2018, le Progressive Web App, conosciute anche come PWA.

Un vero vantaggio, come afferma DNA Agency che opera nell’ambito del web, e che punta anche sull’utilizzo di questa nuova tecnologia per promuovere sul web i propri clienti. Ma vediamo di capire meglio cosa sono le Web App Progressive e in che termini possono rivoluzionare il modo di utilizzare la rete.

Web App Progressive, che cosa sono

Le PWA, termine che ha coniato Google, possono essere definite come applicazioni ibride, ovvero, una via di mezzo tra un sito web e un’app nativa. Il termine “progressive”, infatti, deriva proprio dal fatto che si tratta della progressione di un sito web che si comporta sempre più come un’app per device mobili.

Stiamo quindi parlando di un sito web che, grazie alle nuove tecnologie, è in grado di offrire un’esperienza migliore perfino delle app native stesse.

Senza dilungarci troppo, diciamo soltanto che l’esigenza di avere una tecnologia sempre più veloce e flessibile nasce dal fatto che gli utenti apprezzano la velocità delle app e navigano sempre più da mobile, il web non consente questa rapidità e fluidità, ma al contempo le app native perdono alcune delle funzioni dei siti web, che, tra le altre cose, sono anche sicuri e rispettano maggiormente la privacy.

Come coniugare tutte queste esigenze? Con le PWA. Lo scopo di questa tecnologia è infatti quello di offrire un’esperienza di navigazione fluida, efficiente, semplice. In poche parole un’esperienza perfetta.

PWA: le differenze con app e siti web

Le Progressive Web App funzionano proprio come un’app nativa, ma sono una loro evoluzione. Ma sono anche la progressione di un sito web, come abbiamo detto, sito che si comporta come un’app. Insomma, non è sbagliato dire che prendono il meglio di queste due tecnologie, ma nella sostanza ne differiscono.

Le PWA, per esempio, possono essere installate con grande facilità. Al contrario delle app native, non c’è bisogno di entrare nello store e scaricarle. Fluide come lo è la navigazione sul web, quando su un sito si riceve una notifica che invita a scaricare la PWA, si scaricano direttamente dal browser. La navigazione è diretta.

Un’altra differenza con le app tradizionali è data dal fatto che le PWA sono molto veloci, anche per i motivi che abbiamo visto e alcune possono essere utilizzate anche come web app offline. Questo è possibile perché le PWA si appoggiano su un service worker che ne consente il salvataggio (caching) dei contenuti.

La struttura di base è l’app shell al cui interno sono contenuti i dati principali dell’interfaccia utente e le principali componenti che consentono all’app di funzionare, in poche parole l’app shell è simile al pacchetto codice che viene pubblicato su un app store quando si crea un’app nativa.

Quando l’utente effettua il secondo accesso all’app, questa ricarica i contenuti in modo rapido, proprio perché tutti gli elementi sono stati salvati in locale e possono essere recuperati in modo fluido e dinamico da un API.

Perché implementare una PWA

Implementare una PWA offre numerosi vantaggi, primo fra tutti l’affidabilità, seguito dalla rapidità. Abbiamo già detto che il caricamento è rapidissimo e che le progressive web app per esempio, funzionano anche in modalità offline. Le risorse vengono memorizzate nella cache per mezzo dei service worker, evitando di dover attendere che il contenuto si carichi.

Il fatto che le PWA siano rapide e fluide non fa altro che rendere l’esperienza dell’utente decisamente positiva. Possono essere utilizzate indipendentemente dalla tipologia di browser, sono responsive, quindi possono essere utilizzate su qualsiasi dispositivo mobile e da desktop.

Sempre grazie ai service worker le PWA possono essere costantemente aggiornate, senza mai perdere la loro naturale sicurezza, mediante l’uso di HTTPS.

Mediante il file Json Manifest, che definisce appunto i parametri delle PWA, si può deciderne l’aspetto. In questo modo gli utenti hanno la possibilità di scegliere come l’app deve apparire, quindi scegliere l’icona preferita che andrà visualizzata nella home, i colori, i caratteri e la possibilità di orientare lo schermo.

In poche parole il Manifest permette di identificare le PWA come app. Ancora, le PWA possono essere condivise grazie a un link. Le PWA sono indicizzabili.

Come creare in modo semplice una PWA

Sebbene creare una PWA non richieda competenze di programmazione pura, è comunque vero che non si può nemmeno essere a digiuno di programmazione web.

La prima cosa che si deve fare è verificare che il sito web possieda i requisiti minimi, quindi che sia responsive, che abbia un protocollo SSL attivo, che vi sia no service worker e file manifest, sito cross browser, prestazioni e velocità del sito su reti lente al primo avvio, url raggiungibili e puliti.

Una volta appurati tutti questi punti si può procedere con la realizzazione. Il sito web può essere trasformato in PWA in due step: con la creazione del file manifest.json e la creazione e installazione del service worker.

Per quanto riguarda il primo step, la creazione del file manifest.json, che conterrà tutte le informazioni di base della PWA, dovremo scrivere:

  • tipologia del display e suo orientamento;
  • colori da utilizzare per personalizzare il browser;
  • formato delle icone;
  • lingua parlata;
  • prima pagina della PWA;
  • descrizione;
  • versione del manifest;
  • nome abbreviato.

Il file manifest deve essere posizionato nella root principale del sito web. Per quanto riguarda il service worker, che include delle funzioni come le PWA notifiche push, la gestione della cache, navigazione online e sincronizzazione in background, va posizionato nella root principale del sito, esattamente come il manifest, e deve essere richiamato mediante uno script.

Non è detto, comunque, che si debba partire necessariamente da zero. Per i CMS più utilizzati e conosciuti esistono plugins ed estensioni che rendono il processo di trasformazione più rapido.  Per esempio ci sono dei plugin WordPress, come Progressive app WordPress.

Conclusioni

Il futuro è il mobile marketing, del resto questo processo è già iniziato. Le PWA si stanno dimostrando come le nuove protagoniste, in grado di aumentare la competitività e di accettare nuove sfide.