Progressive Web apps 10 reasons why you should consider - Enonic
←
→
Page content transcription
If your browser does not render page correctly, please read the page content below
10 reasons why you
should consider
Progressive Web apps
by Henry Walker at Enonic
Table of contents Background 3 What are Progressive Web Apps 3 Benefits of Progressive Web Apps 5 1) Quick Installs 5 2) Freshest Version 6 3) Everything is Discoverable/Sharable/Linkable/Rankable 6 4) App Stores are Optional 6 5) Progressive 6 6) Leaner App Size 6 7) Better/Faster Performance 7 8) Reduced Development Costs 7 9) Better User Adoption 7 10) Increased Conversion Rates 8 To summarise then, why PWA? 9 What’s the downside? 9 When to consider PWA 9 How to get started 10 How Enonic can help 10
Background According to Gartner, Progressive Web Apps (PWA) will replace half of consumer-facing apps by 2020, but despite this eyebrow-raising statistic, few people truly understand PWA and this new technology. PWAs have been available on Android devices since 2016, but in March 2018 a new iOS release brought basic PWA support to the iPhone. Microsoft has also announced extensive Windows 10 support across all devices, due imminently. Soon, PWA will be fully supported across all of the major browsers and operating systems for desktop, laptop, tablet and mobile, triggering a major shift in how websites and apps will be produced and consumed. Native apps have been prolific since the dawn of the smartphone, but with growing app fatigue, PWA is set to disrupt by delivering the same advantages via the web. PWA delivers a much better ‘app-like’ experience, to all users, across all devices, at a fraction of the cost and/or effort. More and more organisations are implementing these new capabilities and the results are remarkable (case studies are available here and here). Choosing to build a PWA rather than native app could deliver huge upfront as well as ongoing productivity gains. Perhaps more importantly, they also achieve significantly higher engagement and conversion rates versus native apps and traditional websites. PWA was born from a need to improve the mobile browsing experience, but the powerful benefits can enhance experiences across all devices. Regardless of whether you have a corporate website, blog, media site, complex ecommerce or user generated content solution, there is very strong case now for making this as a PWA. What are Progressive Web Apps You can think of a PWA as a fancy website, or a website with some extra features. Microsoft describes PWA as ‘apps that combine the best of the web, with the best of native apps’. The web has always lacked important features such as offline support and home page installation that make mobile browsing more seamless. Many organisations have focused on apps rather than websites because of the importance of these features to their offering.
But apps have their own challenges. You often have to build duplicates of the same app for
Android, iPhone, Windows and the web. You need specialists creating and managing each
app, and you have the added complexity of app stores acting as the middleman between you
and your end user. The app stores typically take a cut of your sales, and slow down new
releases. Apps can offer a fantastic user experience, but you must always remember that you
are operating within guidelines of a particular company's operating system.
Meanwhile, the web has seen constant innovation driven by the many browser and operating
system providers. It’s a much more open affair, and user demand has driven significant
advances behind the scenes.
The crux of PWA is that it is now possible to create the same app experience for your users
via a website, due to the inclusion of 6 new features:
● F
aster/Slicker User Interface Support
Web developers can now send an entire website to the user’s browser, after just one
pageview. Links and buttons load instantly, rather than users having to reload each
new page. Web developers have the power to make a website feel much faster and
slicker.
● Installable
A popup can now be presented asking the user if they would like to “install” a
website. This puts an icon on their home screen, which automatically opens the
website in fullscreen mode. Clicking this homescreen icon mimics the app experience
perfectly.
● O
ffline Support
Websites can now be used when the user loses connectivity, or returns without
internet connection. After just one visit to your website, it can now work offline.
● Background Processes
Where connectivity is poor, the web browser will store form submissions and data
requests. These will be re-sent in the background when connectivity returns.
● Device CapabilitiesLike apps, websites can now access your camera, calendar, battery status, bluetooth
etc. (with users’ permission).
● Push Notifications
Websites can now send push notifications.
Gartner predicts that as early as 2019, 20% of brands will abandon their native app
development.
Benefits of Progressive Web Apps
As well as matching the benefits of apps, PWA brings all of the advantages of the web, being
open, discoverable and fast in ways that native apps are not. Benefits include:
1) Quick Installs
Installing a PWA is as simple a clicking “yes” when the website displays a prompt. You don’t
have to visit an app store, and the installation happens much faster, taking place in the
background. Here’s how it works:
Website shows prompt - if On exiting the browser, Clicking on the icon opens the
user clicks “ADD”, the PWA is a new icon has appeared site in full screen, and
Installed on the home screen can be accessed offlineThis installation process is much simpler than a traditional app, so it’s more likely to get installed by more of your users. 2) Freshest Version With a PWA, whenever a user visits your site, you give them the latest version in the background. You don’t have to disturb them with update requests and download times. Updates happen instantly. 3) Everything is Discoverable/Sharable/Linkable/Rankable With the web, everything is discoverable and rankable by search engines like Google and Bing. Your users can also share links with one another, helping you to grow your user base and reach new audiences. This can have the benefit of driving more traffic and awareness, as well making things more convenient for your users. 4) App Stores are Optional Maintaining native apps can be very frustrating. App stores force you to become a fully-fledged software company, with extensive QA testing and release notes. They stand between you and the user, preventing launches and slowing things down. PWA has no such restrictions. You are avoiding the app stores all together, saving you time and money. Microsoft is crawling the web for PWAs to ‘auto-ingest’ them into the Windows app store. This means you can still be discovered via the app store, without complying with its approval procedure. We wait to see if Google and Apple will follow suit. 5) Progressive PWA features will be displayed to users whose devices can handle them. For users on older devices, or browsers that don’t support PWA, a traditional website or mobile site will be displayed. So you can be confident that your users will see the best site their device can handle. 6) Leaner App Size PWAs are much leaner than native apps. Twitter’s requires less than 3% of the device storage space compared to Twitter for Android and Ola’s is 300 times smaller than their Android app. If you are building for scale, it’s important to think about resource, performance, storage and processing power. Leaner, slicker applications are more efficient, and using less disk space is a bonus for users.
For any users mindful about how much device space they have left, or how much money they are spending on data, PWA is their friend. It’s much less likely they will have to delete apps or videos to free up space, and they will save money on data costs. 7) Better/Faster Performance The web is optimised for speed and delivering content and data on demand. As a result, PWA capitalises on the speed benefits of the web. The new offline capabilities of PWA introduce ‘native-style’ client-side caching, which means PWAs can outperform websites and native apps on page loads. The Fandango PWA achieves a 30% speed gain over the loading of its desktop website and a 50% increase over its native apps for Android and iOS. Users love fast-performing digital experiences, and hate slow ones - which often cause them to leave and never return. 8) Reduced Development Costs Software development is time and resource-intensive, not only for the creation, but also the ongoing monitoring, maintenance, improvement and QA of apps. PWA have the productivity benefits of no app store submission, working in any browser, and being installable across all major devices. Building one website that achieves all of this means you don’t need to create separate web, Android, iPhone and Windows 10 apps. You have 4 apps in one, saving a huge amount in resource and associated costs, as it can be maintained by one development team. 9) Better User Adoption In a typical month, half of all smartphone users download zero new apps. Downloading an app is much more complicated than visiting an website. Before they can use the app, the user must first visit the app store, search for an app, select one, check the reviews, decide whether they trust it, have enough disk space and data allowance, click install, wait for it to download, locate it on the homescreen, and then open it. Even once the app is installed, 77% are never reopened after 72 hours. In addition, users are suffering with app fatigue. It’s not easy to get people to “adopt” your app, and given that it’s not easy to create apps, there is a risk that you could invest heavily in building something that never gets used.
With PWA, the simple installation is having fantastic results. We are seeing users install websites in great numbers, and we are seeing cases where users will install PWAs, where they have previously rejected the app. Ola (the Uber of India, with over 600,000 drivers) saw 20% of their users book via their PWA who had previously uninstalled their app. One fifth of their audience rejected their native app, but were happy to use an enhanced web experience when ordering a taxi. Ola can still provide the necessary offline functionality and push notifications to fulfil this service effectively. 10) Increased Conversion Rates Perhaps the most exciting revelation about PWA is that they deliver significant increases in conversion rates. Whether its ecommerce, subscriptions, bookings, engagement, dwell time, loyalty, retention, cross selling, upselling or clicks, there are a great many examples of PWAs having a fantastic, positive impact (see here and here). This comes as no surprise when you consider the impact that each new feature has on the user experience. Digital professionals know a better user experience results in higher conversion rates because you are removing obstacles and reducing friction for your users. All of the reasons discussed contribute towards this improved experience. Faster page loads, easier installs, instantaneous updates, smaller and leaner websites, being able to link directly to different parts of the website etc. If you leverage these new capabilities in the right way, it is clear that your users will respond positively. Twitter experienced a 65% increase in pages per session, 75% increase in tweets sent, and a 20% decrease in bounce rate. Lancôme saw a 17% increase in conversions, 53% increase in mobile sessions on iOS and an 8% increase in conversion rates on recovered carts via push notifications. Alibaba saw 76% higher conversions across browsers, 14% more monthly active users on iOS (30% more on Android), and 4x higher interaction rate from ‘Add to Homescreen’. Wego increased organic visits by 12%, bounce rates dropped by 20%, visits increased 26% and conversions increased 95%.
To summarise then, why PWA? PWAs are faster, leaner, slicker and more efficient, giving a much better user experience. With PWA, your users are likely to complete more tasks, trust you more, come back to your website, tell their friends and respond to your marketing campaigns. Making people happy is great for business, and great for your reputation. In addition, it’s easier to build and maintain a website than an app, and with a PWA you effectively get 4 apps in 1. Companies are delivering PWAs now with great success, and Gartner predicts that PWAs will replace 50% of consumer-facing apps by 2020. Today represents a rare and exciting opportunity to get ahead of the competition, and make sure any new digital solutions you build remain relevant for the years ahead. What’s the downside? Today Apple support is fairly limited. PWA has been driven by Google, and as such, they perform extremely well on Android devices. With Apple, the user has a different installation process (2 clicks instead of 1), and the offline support has to be implemented slightly differently. There is also no push notification support right now. Having said that, given Apple has only recently introduced any support, we expect to see this improve over the next few iOS releases. When to consider PWA If you are delivering a website that you expect people to use on their phone, whilst on the move, PWA offers great benefits because it performs much faster and works offline. Even for a blog, why not enable your mobile users to use the website where connectivity is low? PWA can also improve the desktop experience, with features such as push notifications. There is a great case for building any website as a PWA - better engagement with your audience. If you have plans to create an Android app, PWA can achieve the same benefits, with additional gains. It is essential to consider PWA before you invest in an Android app. For iPhone apps, PWA support is currently limited, but there are workarounds for push notifications and installation until further support is added.
If being in the App Store and Play Store is important, software exists for compiling a website or PWA into an Android or iPhone app. This means you are still covering all bases with one app, but submitting via app stores until any future developments mean you don’t have to. Most larger B2C organisations still have all 4 apps. If you feel you still require say an iPhone app, why not make your website a PWA, giving your audience the choice, and the best possible experience, no matter how they choose to engage with you. How to get started Building a PWA could be as simple as adding some code to your existing website, or it may be advisable to start again, rebuilding from scratch. It all depends on how your existing solution has been constructed. If you are technical, you can learn more from our “PWA Getting Started Guide for Developers”. If you are non technical, you need to identify an agency that has PWA experience. Your existing web agency could be a great place to start the conversation, however, if your project would be the first PWA project for that agency, it will naturally take new developers more time and experience to get things working. How Enonic can help Enonic are the experts at Progressive Web App projects, and Enonic XP is an open source web application platform, optimised for PWA. We love hearing about new PWA projects, and you can contact us here or email info@enonic.com to find out more about how PWA can help your organisation.
You can also read
