Articles

Che cosa è un progressive web app (PWA)? Perche ‘ ne vuoi uno?

Sono passati anni dall’inizio dell’era dello smartphone. Con esso è arrivata l’era delle app native. Apps continuano a svolgere un ruolo enorme nella nostra vita quotidiana, e molti imprenditori si sono chiesti più volte: dovremmo avere un app? Naturalmente, l’unica risposta a questo è — dipende. Costruire e mantenere un’app nativa è ingombrante e spesso piuttosto costoso. Fortunatamente, c’è un’altra opzione. Questa opzione combina le gioie di un’app nativa con la tecnologia che usiamo sul web: la progressive web app, aka PWA.

Che cos’è un PWA?

Twitter.com è un PWA

PWA sta per progressive web app. Questa è un’app costruita dalle tecnologie web che tutti conosciamo e amiamo, come HTML, CSS e JavaScript, ma con una sensazione e una funzionalità che rivaleggia con un’app nativa reale. Grazie a un paio di aggiunte intelligenti, puoi trasformare quasi tutti i siti Web in un’app web progressiva. Ciò significa che è possibile creare un PWA piuttosto rapidamente, per quanto riguarda un’app nativa che è piuttosto difficile da sviluppare. Inoltre, puoi offrire tutte le funzionalità delle app native, come le notifiche push, il supporto offline e molto altro.

Molti siti che trovi online sono in realtà un’app web progressiva. Prendi twitter.com, per esempio. Se si visita quel sito sul vostro smartphone, è possibile installarlo alla schermata iniziale. Ora, aprendo il sito Twitter salvato, noterai che sembra e si comporta proprio come un’app nativa. Non c’è nessuna finestra del browser o niente. Non c’è differenza nell’eseguirlo da un iPhone o da uno smartphone Android. Basta accedere e sei a posto. Questo è uno dei principali vantaggi di costruire la tua app web con un PWA in mente.

I PWA stanno guadagnando popolarità. Molti grandi siti sono PWA, come Starbucks.com, Pinterest.com, Washingtonpost.com e Uber.com sono in realtà installabili sulla schermata iniziale e offrono un’esperienza paragonabile alle loro applicazioni native.

Qual è la differenza tra un’app nativa e un PWA?

Un’app nativa, come quelle scaricate dall’App Store di Apple o dal Play Store di Google, è spesso costruita in un linguaggio di programmazione specifico per quella piattaforma. Quindi, per le app iOS, sarebbe Swift e per le app Android, Java. Se si vuole costruire un app per quelle piattaforme, è necessario conoscere la tecnologia. Sì, ci sono scorciatoie, ma queste hanno i loro limiti. Se si desidera avere un app su tutte le piattaforme mobili, è necessario conoscere tutte le diverse tecnologie. Non c’è un modo semplice per costruirne uno e pubblicarlo in tutti i negozi là fuori.

Naturalmente, ci sono modi per ottenere il meglio di entrambi i mondi. Una web app progressiva, per esempio. Questo viene eseguito nel browser e — una volta salvato nella schermata iniziale-funziona come un’app nativa. Ottiene anche l’accesso all’hardware e al software sottostanti che il browser non può accedere per motivi di sicurezza. Se il PWA funziona alla grande, gli utenti non sapranno mai che stanno usando un’app basata sul Web invece di una nativa.

Ci sono alcuni avvertimenti, ovviamente. Mentre i browser sono stati veloci ad adottare la tecnologia per questo, ci sono ancora alcune limitazioni. Su iOS, la tecnologia necessaria funziona spotty in Safari. Apple non (vuole) supportare ancora tutto, rendendolo un po ‘ un lavoro di routine per ottenere la stessa esperienza esatta ovunque.

Quali sono i vantaggi di un PWA?

Il motivo principale per cui tutti stanno inseguendo le app è perché offrono un maggiore coinvolgimento. Gli utenti che installano la tua app sono i tuoi più grandi fan e hanno maggiori probabilità di trasformare il loro utilizzo in vendite o iscrizioni. Grazie alle notifiche push è molto più facile interagire nuovamente con gli utenti. Le app possono offrire un’esperienza eccellente che può fare bene per un marchio.

Abbiamo parlato di alcuni dei vantaggi di PWA in questo articolo, ma ecco una breve panoramica:

  • non È necessario passare attraverso il processo di ottenere in diversi app store
  • Si può costruire PWAs con i comuni tecnologie web
  • sono spesso più conveniente per costruire
  • Dal momento che si sta trasformando il sito in un app, avrai un minor numero di codice-basi di mantenere
  • PWAs reattivi e lavorare con diverse dimensioni dello schermo
  • PWAs sono liscia, veloce e leggero
  • Non c’è bisogno di mano a grandi blocchi di soldi a Google e Apple
  • in modalità non in linea, a differenza del tuo sito regolare
  • PWAs sono individuabili tramite i motori di ricerca (che sono molto più grandi pubblico di app store. Inoltre, se vuoi puoi ancora ottenere i tuoi PWA distribuiti tramite app store)
  • Puoi usare le notifiche push per coinvolgere nuovamente gli utenti
  • L’installazione di un PWA può portare a un maggiore coinvolgimento

Ancora, le app native vincono a volte. I PWA ottengono un accesso sempre più profondo al sistema operativo di uno smartphone, ma un’app nativa può andare ancora più in profondità. Inoltre, ci sono limiti a ciò che un PWA può fare. Ad esempio, i PWA non sono la scelta migliore quando si desidera creare giochi ad alte prestazioni.

Tutto sommato, ha molto senso pensare di avere un PWA nella tua strategia mobile. Ma la domanda principale che dovresti porsi è: il mio pubblico vuole questo?

Per chi è questo?

Tutti dovrebbero semplicemente costruire un PWA e farlo con esso? No, considera la tua attività e, cosa più importante, il tuo pubblico di destinazione. Sono anche utilizzando applicazioni? Non è questo un modo eccessivamente complesso di arrivare a ciò che si vuole raggiungere? Ancora una volta, come tutto, è necessario ricercare le esigenze del pubblico. Chiediti, cosa vuoi che faccia questa tecnologia? Dove sono i tuoi utenti? Hanno una buona connessione dati e hardware solido? Come e dove stanno usando i tuoi contenuti? E pensi che un app può aiutarli a fare meglio il loro lavoro?

I PWA sono fantastici e implementarli non deve essere così difficile. Ma solo perché è facile non significa che dovresti farlo. Se il tuo pubblico non ne ha bisogno, perché dovresti costruirne uno?

Quali sono le preoccupazioni SEO di un PWA?

Il PWA è intrinsecamente web-centrico. E ‘ nato dal web e sviluppato con i motori di ricerca in mente per rendere la scoperta facile. Naturalmente, puoi creare un’app web progressiva da qualsiasi vecchio sito e non ci vuole molto per farlo. Tuttavia, molti PWA usano JavaScript per creare funzionalità più complesse e mentre i motori di ricerca sono diventati adatti al rendering di JavaScript, può ancora essere motivo di preoccupazione.

Quando si imposta un PWA, è necessario assicurarsi che il proprio JavaScript sia accessibile. Non bloccare i file per i bot e assicurarsi che i collegamenti siano disponibili. Per migliorare il processo di rendering è possibile rendere il framework JavaScript utilizzare il rendering lato server.

Trasformare il tuo sito in un PWA non significa migliorare direttamente il SEO di quel sito. Se ha senso trasformare il tuo sito in un PWA, fallo, ma non farlo per eventuali benefici SEO percepiti. Se si dispone di un grande PWA, si stanno offrendo agli utenti una fantastica esperienza utente, che potrebbe rendere one-up la concorrenza. A questo proposito, è una buona idea dare un’occhiata a loro per la vostra strategia SEO mobile.

Quali sono i tre elementi costitutivi principali?

Non ci vuole molto per impostare un PWA. Ci sono tre cose che devi fornire prima che il tuo sito si trasformi in un PWA valido.

  • Una connessione sicura (HTTPS): le PWA funzionano solo su connessioni attendibili, devi servirle tramite una connessione sicura. Questo non è solo per motivi di sicurezza, ma è anche un fattore di fiducia molto importante per gli utenti.
  • Un service worker: Un service worker è un pezzo di script che viene eseguito in background. Ciò consente di determinare come gestire le richieste di rete per il PWA, rendendo possibile eseguire lavori più complessi.
  • Il file manifest: Questo file JSON contiene informazioni su come il PWA dovrebbe apparire e funzionare. Qui, si determina il nome, la descrizione, le icone, i colori, eccetera.

Ecco un esempio manifesto da Google:

Non sembra troppo difficile, giusto? Un paio di cose interessanti in questo elenco:

  • start-url: questo determina dove dovrebbe iniziare la tua app. È meglio lasciare che gli utenti atterrino su una pagina specifica per te PWA.
  • display: questo ti aiuta a determinare quale tipo di interfaccia utente del browser vuoi mostrare. Le opzioni sono fullscreenstandaloneminimal-uie lo standard browser interfaccia.

Queste tre cose elencate sopra sono i requisiti minimi per l’esecuzione di un PWA. È possibile espandere la funzionalità tramite JavaScript (framework).

Come impostare un PWA?

Ci sono un sacco di risorse per provare a costruire un semplice PWA. Questo ti permette di avere un’idea del processo. Google ha un eccellente, facile da seguire tutorial su PWA sul web.sito dev. Mozilla ha un sacco di documentazione sulla creazione di applicazioni web progressive. Microsoft ha anche ricchi documenti per sviluppatori sulla creazione di PWA. Microsoft ha anche creato uno strumento chiamato PWABuilder che ti aiuterà a trasformare il tuo sito in un PWA. Naturalmente, ci sono plugin WordPress che ti aiutano a fare un PWA del tuo sito. Inoltre, Google sta lavorando per portare il supporto di base per PWA al core di WordPress.

Coinvolgi i tuoi utenti con un’app web progressiva

Le app Web progressive possono essere una grande aggiunta al tuo toolkit mobile. Fatto bene, sono veloci, funzionano offline e si comportano come un’app nativa. Tutto sommato, possono offrire ai tuoi utenti un’esperienza utente straordinaria. Gli utenti impegnati sono utenti felici, giusto?

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *