Hero image

Everything You Wanted To Know About Progressive Web Apps (PWAs)

Written by Siobhan
Get in touch
intro.

Progressive Web Apps, or PWAs, were popularised by Google back in 2015 and have been gathering momentum ever since. They use modern web capabilities to deliver features only previously available in a mobile app, creating many advantages for both users and businesses.

What Are Progressive Web Apps?

A PWA is a website that can essentially be ‘bookmarked’ onto a user’s mobile home screen to have the look and feel of a native app. They can then be launched directly from the home screen to give the user a full-screen experience that resembles an app, as well as being capable of much of an app’s functionality. In simplified terms, they’re essentially a combination of websites and native apps.

What Are The Benefits Of PWAs To Users?

There are many features of PWAs that provide the user with greater benefits than an app or a webpage. These are just a few of them:

What Are The Benefits Of PWAs To Businesses?

From a business perspective, Progressive Web Apps also carry a lot of perks when used alongside a webpage, without the need for a native app. Here are a few of those benefits:

  • Low Cost – One benefit of having a PWA for your business rather than an app is the cost implications. A PWA is essentially a website and an app bundled into one; as long as you have a responsive website your PWA will work across all platforms and devices, at practically no extra cost to your website. A native app on the other hand would require a developer to create an app separately to a website, doubling the workload and therefore coming with a much higher price tag. Further cost implications with native apps include needing to pay to feature it in Apple’s App Store, along with a further sum to get it featured in Google’s Play Store. As PWAs aren’t featured in any app store these fees don’t apply, making PWAs a far cheaper option.
  • No App Restrictions – Following on from the previous point, app stores often have restrictions on adding an app to their database. You’ll need to register for a developer program account, follow all app store review guidelines and push each version of the app through a review process which could take up to two days. If you want to feature your app on more than one store then you’ll need to repeat these steps for each additional store. On the other hand, a Progressive Web App only requires a few extra pieces of code in your website and no restrictions or reviews are required.
  • Push Notifications – Did you know that the use of push notifications can result in up to three times more retention than an app or webpage that does not use push notifications? Commonly associated with native apps, PWAs also have the functionality to send push notifications to the user, even when the PWA is not currently in use. Although this can be done from websites, users will be expecting it more from a PWA due to the app-like experience that it offers. This should encourage the user to accept and engage with any notifications they receive.

What Are The Drawbacks Of PWAs?
Progressive Web Apps Badging

Some people see PWAs not being in the App Store or Google Play as a drawback, simply because featuring in these places can often lead to more brand exposure. However, that is not necessarily the case; to gain significant exposure on these platforms you’ll need to rank highly in their charts. Something that’s far easier said than done! In fact, a native app can often lead to a higher bounce rate from any paid promotions as users are then pushed to the app store instead of staying in their browsers, negatively impacting the user experience.

Another potential drawback of Progressive Web Apps is that although they support most features that native apps do, there are some exceptions. For example, Touch ID, Bluetooth, badging and geo-fencing cannot currently be supported in PWAs. Saying that, it’s highly likely that almost all native app features, either listed above or otherwise, will be available with PWAs at some point. Google is actively working on integrating a number of these features into Progressive Web Apps, with a recent example of this being badging (the little number icon on iOS app icons for unseen notifications).

A Real-World Example Of A PWA

Here at Flaunt Digital, we love to get hands-on with PWAs. An example of this is our recent project for MBE and ex-England rugby captain, Jamie Peacock, with his personal development program ‘No White Flag’. A PWA seemed the perfect route for this project as users would be engaging regularly with the site, meaning push notifications would be crucial for encouraging user engagement. As we had created a fully-responsive website for No White Flag, turning it into a PWA was a logical, simple and cost-effective step.

You can find out more information about this project through the full No White Flag case study.

How Do You Use PWAs?

PWAs can be added to the homepage of a mobile phone straight from its webpage. On Android devices, using Chrome, a pop-up install prompt can encourage users to ‘Add the PWA to home screen’, but only after they meet certain criteria such as multiple visits or time spent on the page. If this pop-up does not work, it’s still easy to add the PWA to your homepage by selecting the ellipsis button and then ‘Add to home page’.

 
No White Flag Android Screenshot 2
 
No White Flag Android Screenshot 3
 
No White Flag Android Screenshot 4

PWAs can also be added to an iPhone home screen when using Safari. This is done by selecting the share button, followed by ‘Add to home screen’. A pop-up prompt isn’t available on iOS but this doesn’t mean you can’t manually add your own pop-up.

 
No White Flag PWA Screenshot2
 
No White Flag PWA Screenshot3
 
No White Flag PWA Screenshot4

What Is The Future Of Progressive Web Apps?

Some large companies are starting to make use of PWAs such as Starbucks and Twitter Lite, who launched their PWAs back in 2017. Both brands have since reported an increase in their daily website visitors. These are great examples of the full potential of PWAs being realised by big brands, and their popularity will only grow as they continue to gain exposure.

Exposure is one thing that will be crucial to the future progression of PWAs. As they are not part of a central database such as the App Store, users need a way to easily differentiate between websites that allow PWAs and those that don’t. Maybe this will be a small symbol on a website, much like Google’s lightning-bolt icon for AMP pages, in order to let users know they can save the app to their home screens. Maybe in time they could even be listed in the app stores.

PWAs are progressing fast, so although getting a PWA for your business may not have immediate benefits, it will give you a clear advantage over your competitors in the near future. Getting your Progressive Web App developed now will ensure that you’re in a great position when they do become the norm.

In summary, PWAs combine the best features of native apps and websites to result in improved performance and user retention, without the costs and complications of creating a mobile application.

Whether a business should go down the progressive web app route or not would depend on what they are aiming to achieve. If you’re looking to keep costs low and increase user engagement using features such a push notifications, then there’s no doubt that a PWA would be the perfect solution.

Want to discover more digital marketing tips and tricks? Why not sign up to our mailing list for all the latest insights from Flaunt Digital?

more like this.