Senza dubbio hai sentito parlare dell'imminente ondata del Web mobile. La cosa più comune che probabilmente hai sentito è che l'accesso al Web mobile sta aumentando rapidamente e circa la metà di tutto il traffico Web è ora tramite telefono o tablet. UN Rapporto 2018 di febbraio dal Pew Research Center si noti che 95% di tutti gli americani possiede un telefono cellulare, mentre la percentuale di americani con smartphone è 77%.

Non devi guardare lontano per vedere l'impatto del mobile. Guarda il tuo comportamento e quello della tua famiglia. A dicembre 2016, comScore ha riferito che l'americano medio sopra i 17 anni trascorreva due ore e 51 minuti al giorno sul proprio telefono (Englais).

Statcounter.com osserva che il traffico Web globale proviene principalmente da dispositivi mobili per almeno un anno (51,95% a febbraio 2018).

Sebbene tu possa pensare che non puoi permetterti di sviluppare un'app nativa per i tuoi utenti mobili da memorizzare sui loro telefoni, esiste una fantastica alternativa disponibile per tutte le aziende: le applicazioni Web progressive. Forse hai sentito parlare di applicazioni Web progressive (PWA) e di come le persone le utilizzano per far crescere le loro attività. In questo articolo imparerai qualcosa in più sulle PWA e perché dovresti pensare di più al loro utilizzo nel 2018.

Alcune definizioni

Le applicazioni Web progressive (PWA) sono una raccolta di standard Web originariamente sviluppati da Google per migliorare le prestazioni del sito Web sui dispositivi mobili. Di conseguenza, i siti Web funzionano più come app mobili dedicate che puoi trovare nell'App Store di Apple o in Google Play.

altro définition sviluppatori per la catena alberghiera indiana Treebo: “Le PWA sono applicazioni a pagina singola che vengono migliorate in modo incrementale con funzionalità che forniscono un'esperienza nativa più coinvolgente. »

Riducendo un po 'questo aspetto, le PWA sui dispositivi mobili consentono ai lettori e ai clienti di caricare rapidamente la home page del tuo sito e utilizzare molte delle stesse funzionalità sul dispositivo mobile che un'app nativa utilizzerebbe. Il tuo sito potrebbe esistere al di fuori del browser, anche quando il dispositivo non è connesso a Internet.

Altre definizioni

Alcune delle parti tecniche chiave di una PWA includono:

Servizi Lavoratori sono la tecnologia chiave associata alle PWA. Questi consentono alle PWA di operare al di fuori della rete.

File manifest contengono l'icona e il nome che collega l'app del dispositivo al sito web. Lo sviluppatore può anche aggiungere qui elementi di design per migliorare l'esperienza del cliente.

Notifiche push comunicare con i tuoi utenti (con il loro permesso), così tornano.

Alcuni motivi

Allora perché il tuo sito dovrebbe includere una PWA? È abbastanza semplice.

Prestazioni migliori, anche sul desktop!

Sai che hai un tempo limitato per vincere a visitatore per la prima volta: sei secondi di caricamento prima che un potenziale cliente lasci e visiti il ​​sito successivo nei risultati di ricerca. Gli utenti mobili sono ancora più impazienti: metà dei tuoi potenziali utenti se ne andrà se un sito impiega più di 3 secondi a caricarsi!

Buone notizie: le modifiche apportate per creare un'applicazione web progressiva accelereranno il tuo sito!

Esempio: la società alberghiera indiana Treebo ha ridotto il tempo di ricarica del cellulare da sei secondi a 1,5 secondi creando la PWA. Il sito ora si carica sul desktop in un secondo! Il loro team tecnico ha riferito che le classifiche di ricerca del sito sono migliorate e il tasso di conversione mensile è più che raddoppiato!

Capacità offline

Non è necessario che PWA sia su Internet per farlo. I tuoi utenti possono accedere a tutti i contenuti dell'app dal proprio dispositivo o desktop.

In effetti, una delle cose più belle di una PWA è che il tuo cliente può salvare il sito nella home page del proprio dispositivo e utilizzarlo in seguito per acquistare il tuo prodotto o ottenere maggiori informazioni. .

Per esempio, CNET Tech Today offre un riepilogo giornaliero delle notizie relative alla tecnologia che è il pane quotidiano del sito. Se apri il sito con Google Chrome su un dispositivo Android e scorri verso il basso fino alla parte inferiore dello schermo, vedrai questo:

Aggiungi una PWA alla schermata principale del cellulare. Nessun negozio di applicazioni richiesto!
Aggiungi una PWA a una schermata iniziale mobile. Nessun app store richiesto!

stampa Aggiungere alla schermata Home per scaricare l'app web progressiva Tech Today sul tuo dispositivo. Tocca l'icona per caricare le prime 10 storie attuali. Scorri verso sinistra per leggere ogni storia. Tocca il logo CNET per aprire la home page CNET nel tuo browser.

osservazione : Su Firefox, i siti con PWA hanno un'icona "Aggiungi alla home page" (un segno più in una piccola casella) direttamente sulla barra degli indirizzi. Se la PWA è già installata, il logo Android sulla barra degli indirizzi ti porterà alla PWA.

Una cosa di cui il tuo sito non ha bisogno: i widget "Scarica la nostra app" occupano spazio sulla tua pagina (di solito con i loghi di iTunes e Android che distraggono gli utenti). Se Chrome nota che un utente ha aperto il tuo sito PWA più volte alla settimana, ti chiede di aggiungere la tua PWA. Anche gli aggiornamenti sono automatici.

Non c'è bisogno di linguaggi di programmazione complessi

Potresti aver preso in considerazione la creazione di un'app mobile nativa per la tua attività, ma hai scoperto che la creazione di un'app mobile è un animale diverso rispetto alla creazione di a sito web. Se stai lavorando con un'agenzia di web design/sviluppo per mantenere il tuo sito, non avrà necessariamente le competenze per creare un'app per i principali fornitori di dispositivi mobili.

Affinché il tuo software venga visualizzato nell'Apple App Store, i tuoi sviluppatori devono registrarsi all'Apple Developer Network, utilizzare l'Apple Developer Tool (che funziona solo su Mac) e conoscere una lingua di Programmazione approvata da Apple: Swift o Objective C.

La programmazione per Android è un po 'più semplice (non è richiesta l'approvazione dello sviluppatore), ma la stragrande maggioranza delle app Android sono scritte in Java, che può essere un linguaggio difficile da imparare.

Affinché l'app venga visualizzata negli store online Apple o Android, l'app completata deve ottenere l'approvazione dai depositari del rispettivo negozio.

Al contrario, le app web progressive sono costruite con linguaggi web popolari: HTML, CSS (Cascading Style Sheets) e JavaScript. In breve, anche gli sviluppatori web principianti possono creare PWA di alta qualità.

In particolare, non hai bisogno di molta educazione informatica per fare un PWA per il tuo sito WordPress. Se hai già modificato la formattazione del tuo sito utilizzando un tema figlio, puoi anche creare un file PWA. Tratteremo i problemi di codifica in un altro articolo.

Aumentare il supporto dei giganti della tecnologia

Gli standard impiegano molto tempo per diventare standard. Google ha promosso per la prima volta le PWA nel 2015.

Per molto tempo, Chrome è stato l'unico browser a supportare PWA, ma le cose stanno per cambiare. Negli ultimi mesi:

  • Mozilla ha aggiunto il supporto PWA in Firefox 58
  • Apple ha recentemente annunciato il supporto per le applicazioni Web in iOS
  • Microsoft supporterà PWA nella prossima versione di Windows 10, che sarà disponibile entro la fine dell'anno (2018).

Andando oltre gli altri fornitori di sistemi operativi, Microsoft ha affermato che PWA di "alta qualità" saranno presto integrati nell'app store di Windows 10 su dispositivi mobili e desktop.

WordPress e PWA

WordPress non supporta ancora completamente la creazione di app Web progressive nell'app di base. Il team Jetpack si impegna ad aggiungere funzionalità PWA nel prossimo anno. Ciò è aiutato dalla certificazione Javascript di WordPress.

Jetpack "introduce gradualmente le funzionalità PWA non appena sono pronte", afferma lo sviluppatore Dan Walmsley in un articolo sul blog VIP di WordPress . Gli sviluppatori possono aggiungere file manifest utilizzando il modulo manifest di Jetpack dalla versione 5.6.0 e hanno introdotto il caricamento progressivo delle immagini, che rende il caricamento del sito più veloce anche quando ci sono molte immagini su di esso. la pagina. Altre funzionalità arriveranno quest'anno.

Alcuni plugin cercano di aggiungere funzionalità PWA, ma non sono stati ampiamente adottati.

  • Lo strumento di ottimizzazione di WordPress fornisce uno strumento funzionante e manifest.
  • Super Progressive Web Apps genera un manifest e un pulsante Aggiungi alla schermata iniziale, tra le altre funzionalità.
  • Il WordPress Mobile Pack aggiunge anche funzionalità PWA

Come hai intenzione di usare il PWA?

In questo tutorial hai imparato qualcosa sulle applicazioni Web progressive e perché dovresti aggiungerne una al file sito web della tua azienda:

  • La crescente ondata di traffico di dispositivi mobili
  • Migliori prestazioni per il tuo sito web: mobile e desktop
  • Disponibilità anche quando il dispositivo è offline
  • Utilizza le funzionalità web standard: HTML, CSS e Javascript. Più economico da costruire
  • Maggiore supporto per browser e sistemi operativi

Forse ora vuoi sapere come fare un PWA in WordPress? O mostrare ai tuoi sviluppatori come farlo? Questo sarà oggetto di un altro tutorial.