A Progressive Web App is like a website that is built using the latest web tech, but they behave and give the sense of an app. Thanks to browser advancements and the fact that service workers and Cache and Push APIs have made it possible to allow end users to install apps in their home screens, get PUSH notifications and work offline.
A Progressive Web App (or PWA) is essentially a version of website which has been optimized with all of the latest web techniques to deliver a native app experience on any device, but most especially on smaller mobile devices such as Smartphone or Tablets where the user has not only a smaller viewing space, but also less memory and less operating space to allow for the loading of large image files or space insensitive data.
These PWAs are built with progressive enhancement to allow background functions like caching, background syncing and (quite importantly for your marketing efforts) push notifications.
PWAs make use of the greater web, including the plugins and the comparative ease of creating and maintaining a website rather than a native app. For anyone who has developed both for mobile and for the larger web, it will be easy to see the advantages of tech that can be built faster with an API that doesn’t require maintenance with backward-compatibility, multiple versions or version fragmentation.
PWAs are not actually such a new thing. They have been around for more than two years already, and people love them. However it’s only more recently that we are seeing the bigger players start to adopt the full spectrum of possibilities that PWAs offer as a sales tool which is fully integrated into the whole sales-funnel process, and not just being toyed with as a “nice-to-have” gimmick.
Advantages of a Progressive Web App
There are a lot of advantages for you the marketer as well as the end user when it comes to using a PWA rather than relying solely on your standard Ecommerce store.
Most noteworthy are the following:
Full Screen View – allows a more user friendly experience for the end user
Push Notifications – allows you to keep the end user up-to-date with special offers and relevant deals
Offline functionality – allows the end user to access and view your products even when offline
Splash Screens - allows for better ATL advertising in a previously BTL space
No need to download – the end user can use a web app in their browser without having to go and look for and download an app in their respective app store
Cross-Browser consistency – because there is only one version on a PWA across multiple browsers, your users are guaranteed a consistent experience regardless of their access point
The Major Components and Characteristics of a PWA
Key Characteristics of a Progressive Web App:
It’s Progressive. It’s right there in the name. It must be able to work on any devce and enhance progressively, taking advantage of the available features on the end users device and browser.
It’s Discoverable. Like any website, the PWA must be discoverable (and preferably optimized) to be discoverable in search engines. This gives them an advantage over standard native apps which obviously don’t allow internal content to be referenced by search engines.
It’s Linkable. Again, as with standard websites, you should be able to link easily in and out of a PWA.
It’s Responsive. Obviously it would all be fairly pointless if the PWA didn’t respond to every imaginable device in circulation.
It’s Offline Enabled. It should be able to function outside of connection areas or even offline. It should refresh with the latest content whenever the user is online, though.
It’s Installable. Users should be able to easily install your PWA on their devices home page for ease of access.
What is a PWA made up of?
App Manifest
It’s the JSON file that defines your app icon, how to launch the app (standalone, full-screen or in a browser) and any related information. It’s placed in the root of your app. A link to this file must be on each page that has to be rendered in the app.
It’s placed in the head section of the HTML page:
<link rel=”manifest" href="/manifest.json">
Service Worker
Service worker is where the real PWA bells and whistles come out. It’s essentially JavaScript code that acts as programmable proxies which are responsible for intercepting and responding to network requests. Since it acts as a proxy and can be easily programmed, the application must be served over HTTPS to ensure secure data.
You should keep in mind that the service worker caches the actual response, including all HTTP headers, rather than just the response data. What this means is that your app can make network requests and process responses without specific code to handle the cache.
Why you should consider a Progressive Web App
Anything that makes your end-user’s experience with your store easier, more personal, and more streamlined, is going to help you to retain customers.
The added advantage of push notifications means that you are able to communicate relevant information with your audience even when they are not in a traditionally accessible advertising space, and even without them having to go through the effort and decision-making process that goes into something as simple as opening an Email. Your message is right where they are already spending their time online.
So from both a sales and a marketing point of view, PWAs are a worthwhile investment for your Ecommerce enterprise.