Learn the benefits of progressive web apps (PWAs) and why you should be using them
This year has been huge for the mobile web. Accelerated Mobile Pages (AMP), which have enabled the rapid delivery of news content, have muscled their way to the top of Google search results. Furthermore, Comscore reports that mobile is the leading digital platform, with 52% of mobile media engagement being made via apps.
As mobile consumption continues to grow, providing users with a fast and efficient experience is paramount in boosting impressions, conversions, and sales.
It is because of this that Google is seeking to blur the lines between a mobile website and the native app experience, with the introduction of Progressive Web Apps (PWA).
There is a problem with the mobile web
Think about how quickly the Facebook, Instagram or BBC news apps load on your phone. A world of information is available almost instantly with just one tap.
Now think about that experience through your web browser. One tap to open the browser, another tap for the address bar, a few more to enter the URL (assuming you know it, if you don’t, be prepared to search), and then you need to wait while the website loads.
What makes this worse is that mobile internet connections are fickle and often slow.
Google reports that 53% of mobile site visits are abandoned if it takes longer than three seconds for them to load. It doesn’t make for a great experience and it’s especially not ideal if your business relies on mobile traffic to survive.
Introducing Progressive Web Apps
Progressive Web Apps solve this problem really well. By combining the best of the web and the best of native applications, users get an experience that requires no installation, is fast, feature rich and helps boost conversions.
Some of the biggest brands in the world are already reaping the benefits. Forbes’ PWA increased impressions per visit by 10%. Alibaba increased mobile conversions by 76% and Twitter saw a 20% decrease in bounce rate.
Here are my top five features that make this such an enticing prospect for publishers, online stores, and news outlets.
1. Full-screen native app experience
PWA bring many of the benefits of a native app experience without making sacrifices for devices that do not support them.
One of the most noticeable is the difference between viewing a website in the browser (such as Google’s Chrome or Apple’s Safari) and a native, on-device, application. With PWA, websites are now loaded with a full-screen experience.
Instead of a URL bar, users will now see more of your site on the screen, complete with a splash of branding added in for good measure. This gives your website much more presence and a stronger brand identity.
2. Add to home screen
PWA can be saved to the home screen. This is great for re-engagement. Users are prompted to add the website to their home screen, complete with icon and branding.
This is the first step in creating a native experience. Once the website is on the home screen (with no installation required), it will look and feel just like any other app on their device.
A prominent presence for minimal effort.
3. Works even when offline
Now we get into the really interesting stuff. PWA can work offline or with a limited connection, just like a native app!
Some seriously clever tech means that images, content and even shopping carts are able to function even if you are on a train and you go into a tunnel. Your content is always going to be available, no matter how poor the user’s connection may get.
What’s more, with “pre-caching”, images and articles can be downloaded ahead of time, meaning that users have access to articles they haven’t viewed yet, even if they lose connection entirely.
4. Push notifications
Some of the best features for publishers are the interactivity options that don’t merely mimic a native app experience but are in fact truly native.
Push notifications and the new sharing system allow users to engage and re-engage with publisher’s content in a way that normal websites can’t.
Push notifications will appear in the user’s notification bar, in the same way, that notifications of new matches on Tinder or a new Facebook message do.
Publishers have full control over what they want to “push” to users and when they want to do it. Have you published an awesome new article on PWA? Let your readers know with push notifications.
5. New ways to share content
When users find your content engaging, they want to be able to share it however they choose.
In the past, you were limited to what your developer had built, most likely Facebook and Twitter.
If a new social platform appears, it can often take weeks before a change to your website can be published. This is not only problematic for a user who may want to share the article to their WhatsApp chat group, but also for the publishers, who have to rely on their software team to add support for new services as they appear.
With PWA, users can share web content with any share enabled application that is installed on their device. If a new social network suddenly becomes popular, your content can be shared on it immediately. There’s no need to spend time and resource adding new features to your website.
New features are being added all the time
There are many more benefits to be had from adding PWA functionality to your site, speed and performance improvements, enhanced functionality beyond those outlined here, plus more being added all the time.
Google is actively working on this tech and more and more sites are adopting this concept to make their mobile experiences more dynamic, more user-friendly and better for their customers.
Can I use this now?
Support right now is okay and improving. Google is leading the way and Chrome on Android devices (for the most part) have full integration; with Safari on iOS, sadly, lagging behind.
There is good news, however, Webkit (which powers Safari) is starting to pick up pace in developing the standard.
Adding PWA functionality to existing sites is simple. With careful thought and planning around how and when to use push notifications, which assets should be cached for offline availability and what additional performance enhancing steps can be taken, large improvements in user experience can be achieved. This, in turn, drives more conversions, longer-term engagement, and stronger brand presence.
All of this is great news for the future of mobile web development, and due to the progressive nature and ease of incorporating this functionality into existing websites and workflows, there is no reason whatsoever not to start using this technology right now.
Thanks to Steve Slade for sharing their advice and opinion in this post. Steve is Lead frontend developer at
Jellyfish. You can follow Jellyfish on
Twitter or connect with Steve on
LinkedIn.