Un’applicazione web progressiva (PWA) è un tipo di software applicativo distribuito attraverso il Web, creato utilizzando tecnologie Web comuni tra cui HTML, CSS e JavaScript.
È progettato per funzionare su qualsiasi piattaforma che utilizza un browser conforme agli standard. La funzionalità include il funzionamento offline, le notifiche push e l’accesso all’hardware del dispositivo, consentendo la creazione di esperienze utente simili alle applicazioni native su desktop e dispositivi mobili. Poiché un’app Web progressiva è un tipo di pagina Web o sito Web noto come applicazione Web, non è necessario che sviluppatori o utenti installino le app Web tramite sistemi di distribuzione digitale come Apple App Store o Google Play.
Sebbene le applicazioni Web siano state disponibili per i dispositivi mobili sin dall’inizio, in genere sono state più lente, hanno avuto meno funzioni e sono state utilizzate meno delle app native. Ma con la possibilità di lavorare offline, precedentemente disponibile solo per le app native, le PWA in esecuzione su dispositivi mobili possono funzionare molto più velocemente e fornire più funzionalità, colmando il divario con le app native, oltre a essere portatili sia su piattaforme desktop che mobili.
Le PWA non richiedono raggruppamenti o distribuzioni separate. La pubblicazione di un’app web progressiva è come sarebbe per qualsiasi altra pagina web. Le PWA funzionano in qualsiasi browser, ma le funzionalità “simili ad app” come l’indipendenza dalla connettività, l’installazione nella schermata principale e il push della messaggistica dipendono dal supporto del browser. A partire da aprile 2018, tali funzionalità sono supportate a vari livelli dai browser Microsoft Edge, Google Chrome, Mozilla Firefox e Apple Safari, ma un numero maggiore di browser potrebbe supportare le funzionalità necessarie in futuro. [1] [2] Diverse aziende evidenziano miglioramenti significativi [3] in un’ampia gamma di indicatori chiave di prestazione dopo l’implementazione di PWA, come un aumento del tempo dedicato a pagine, conversioni o entrate.
Le app Web progressive sono progettate per funzionare su qualsiasi browser conforme agli standard Web. Come con altre soluzioni multipiattaforma, l’obiettivo è aiutare gli sviluppatori a creare app multipiattaforma più facilmente di quanto farebbero con le app native. [8] Secondo Google Developers, [7] [12] [13] le caratteristiche di un PWA sono:Progressivo: funziona per ogni utente, indipendentemente dalla scelta del browser, utilizzando i principi di miglioramento progressivo.
Più veloce dopo il caricamento iniziale: al termine del caricamento iniziale, non è necessario scaricare nuovamente gli stessi contenuti e gli stessi elementi della pagina.I siti Web ordinari spesso utilizzavano già la cache del browser per evitare di scaricare di nuovo gli stessi dati in modo ridondante. [Sono necessarie ulteriori spiegazioni] Ma nelle applicazioni Web progressive non è necessario ripetere il rendering degli stessi elementi.
Indipendente dalla connettività: gli addetti all’assistenza consentono usi offline o su reti di bassa qualità.
App-like: sembra un’app per l’utente con interazioni e navigazione in stile app.
Sicuro: servito tramite HTTPS per prevenire ficcanaso e garantire che il contenuto non sia stato manomesso.
Rilevabile: identificabile come “applicazione” da manifest.json [14] e registrazione dei lavoratori dell’assistenza e rilevabile dai motori di ricerca.
Riattivabile: possibilità di utilizzare le notifiche push per mantenere l’impegno con l’utente.
Installabile: fornisce icone della schermata iniziale senza l’uso di un App Store.
Collegabile: può essere facilmente condiviso tramite un URL e non richiede un’installazione complessa.
I criteri tecnici di base per un sito che deve essere considerato un’app Web progressiva dai browser sono stati descritti da Russell in un post di follow-up: [15]Provengono da un’origine sicura. Servito su display TLS e lucchetto verde (nessun contenuto misto attivo).
Carica offline (anche se solo una pagina offline personalizzata). Di conseguenza, ciò significa che le app Web progressive richiedono personale di servizio.Fai riferimento a un manifest di un’app Web con almeno le quattro proprietà chiave: nome, short_name, start_url e display (con un valore di standalone o a schermo intero)
Un’icona di almeno 144 × 144 dimensioni in formato PNG.
Utilizzo di grafica vettoriale scalabile indefinitamente e che richiede file di dimensioni inferiori.
Alcune app web progressive utilizzano un approccio architettonico chiamato App Shell Model. [16] In questo modello, gli operatori del servizio memorizzano l’interfaccia utente di base o la “shell” dell’applicazione Web di progettazione Web reattiva nella cache offline del browser.
Questo modello consente ai PWA di mantenere un utilizzo simile a quello nativo con o senza connettività web. Ciò può migliorare i tempi di caricamento, fornendo un frame statico iniziale, un layout o un’architettura in cui il contenuto può essere caricato progressivamente e dinamicamente. [17]
Quali sono le differenze tra le PWA e le app tradizionali?
In definitiva, visti gli innumerevoli vantaggi e le caratteristiche delle PWA è forse possibile fare un confronto diretto con le applicazioni tradizionali? Chi la spunterebbe tra le due?
Prima di farlo è importante ricordare che, nonostante tutto, le app native risultano essere ancora molto scaricate attualmente. Dato come stanno evolvendo le cose, però, è inevitabile che nel tempo si assista ad un lento ma graduale declino. La motivazione non è difficile da comprendere e si ritrova in tutte le caratteristiche delle PWA che, purtroppo, non appartengono alle applicazioni tradizionali.
1- Prima grande differenza, che non può passare inosservata, sta nel fatto che le app tradizionali sono progettate solo per un determinato sistema operativo. Non è un caso se app progettate per Mac sono praticamente inutilizzabili su Windows. Le PWA, invece, sono multi-piattaforma e sono utilizzabili, in un’unica versione, con qualunque tipo di browser o sistema operativo.
2- Un altro limite delle app tradizionali rispetto alle PWA che rappresenta la seconda grande differenza tra le due tipologie sta nella necessità di download per l’utilizzo. Praticamente impossibile, infatti, utilizzare un’app tradizionale senza averla scaricata. Limite che, invece, non esiste per le Progressive Web App.
3- Volendo confrontare sul piano dell’efficienza le PWA con le app tradizionali ne viene fuori un quadro disarmante. Le prime, infatti, sembrano vittoriose su tutta la linea con almeno 4 punti di forza, ovvero il funzionamento su richiesta, l’accessibilità continua garantita, la non occupazione di spazio all’interno della memoria dei dispositivi, un consumo più ridotto di dati.
4- Le PWA sono nettamente più economiche rispetto alle applicazioni tradizionali. Questo perché il tempo impiegato per la loro costruzione e per il loro aggiornamento è molto minore rispetto a quello necessario per un’app nativa. Il discorso è ancor più degno di nota se si considera che lo sviluppo di una PWA equivale alla realizzazione di tre differenti app native (ios, windows, android) a cui deve aggiungersi quella di un sito responsive.
5- Le applicazioni tradizionali non possono contare sull’indicizzazione di Google che, invece, è possibile per le PWA che in questo modo diventano molto più semplici da promuovere e garantiscono livelli di visibilità ben oltre la media di una classica applicazione tradizionale.
Esempi pratici di Progressive Web App
Andare alla ricerca di una Progressive Web App non è attualmente cosa difficile dal momento che, venute a galla le enormi potenzialità che offrono, la loro diffusione sta aumentando giorno dopo giorno. Tra tutte si sono scelte 4 PWA dal carattere ritenuto particolarmente interessante.
1- FlipKart è la Progressive Web App di un sito di e-commerce indiano. Accedendovi si nota immediatamente come il contenuto viene caricato direttamente mentre si naviga ed il tutto avviene davvero in maniera molto veloce. Caricando solo i contenuti effettivamente richiesti, poi, si nota un buon risparmio nel consumo di dati dal momento che si evita tutto quanto non strettamente necessario. Il tutto corrisponde certamente ad una migliorata esperienza dell’utente e ad una maggiore soddisfazione finale.
2- Walmart è la WPA di un sito che si occupa di promuovere il risparmio nella delicata fase degli acquisti online. L’esperienza utente è, anche in questo caso, entusiasmante e fa venir voglia di scorrere ulteriormente le pagine senza abbandonare l’app. Ecco che si riscontra qui il riscontro positivo della maggiore conversione per il proprio portale. Si è anche potuto notare come cambiando dispositivo la PWA si presenta differentemente in base alle dimensioni del display, ad esempio con una diversa collocazione delle voci di menù.
3- Anche il Washington Post, uno dei giornali più noti in America, si è lanciato nel settore delle PWA usufruendo di articoli perfettamente indicizzati su Google.
4- Product Hunt, infine, è la PWA di un sito che aiuta gli utenti e li guida nella scoperta di nuovi prodotti. L’esperienza utente, in questo caso, risulta più attiva e vivace rispetto a quanto potrebbe avvenire sul sito stesso o su un’app tradizionale con una buona soddisfazione finale da parte di ogni utente che sicuramente tornerà ad utilizzarla.
Come abbiamo visto, le PWA sembrano avere tutte le carte in regola per affermarsi come le future protagoniste del mobile marketing. E tu, cosa ne pensi? Se stai pensando di integrare un app mobile nella tua strategia aziendale, non ti rimane che contattarci: perché non giocare d’anticipo sui competitor, introducendo per primo sul mercato la tua Progressive Web App?
