Imagine your website interacted with users as if it were an application. Users could install your website on any device, get push notifications, and use it even without access to the internet. Progressive web apps (PWAs) offer precisely this. PWAs have become popular due to the relative simplicity of their development and the better user experience they offer compared to ordinary websites. The most notable PWAs are offered by Twitter, Trivago, Alibaba, and Walmart. These major market players have reported doubled conversion rates and fast revenue growth after releasing their PWAs. In this article, we’ll outline the main benefits of using a PWA for your business. We’ll also present Steelkiwi’s expertise in developing progressive web apps.
What are progressive web apps?
There’s no clear definition of a progressive web application. In the most general sense, a PWA is a regular website with the functionality of a mobile application. When accessed via a desktop browser, a progressive web app looks like a regular website. But when it’s opened on a mobile device, a PWA turns into a hybrid of a website and a mobile application. Many giants like Uber, Twitter, Starbucks, Forbes, Pinterest, and Lyft are using PWAs. PWA technology can also be used by small sites to develop products such as fast and convenient news aggregators.
PWA technologies
Service workers
Service workers are at the heart of a PWA. Service workers are files located between the network and the browser layers. From the developer’s point of view, a service worker is a JavaScript file connected to HTML code. These files handle network responses. Dividing JavaScript services into layers allows websites to become PWAs in the simplest way. You don’t need any progressive web app framework to build a PWA. All you need is JavaScript.
HTTPS
A PWA requires all resources to pass through the HTTPS protocol. Having no clickable links to unprotected resources is a crucial requirement to using HTTPS technology correctly. If your site contains clickable links to unprotected resources, the browser will not display it.
Application shell
The application shell is the frame or template of the user interface. If you cut out the contents of the site with all dynamic data, what remains is the app shell. This shell is stored on the client side and launches together with the application. Then dynamic data is loaded into the shell from the network.
Web app manifest
This is a JSON file that declares the name of the application, the icon, the view of the PWA (fullscreen or standalone), and some other parameters. The web app manifest allows users to identify your PWA as an application on the home screen.
Push notifications
PWA users can receive push notifications, and almost every site with a PWA sends notifications. However, an annoying pop-up asking for permission to send notifications looks like spam rather than some progressive technology. Keep in mind that you can ask for permission after a user visits a second page on the site.
So far, we’ve shown you tools for developing your first progressive web app. The cost of developing a progressive web app is almost the same as the cost for developing a regular website.
How can a PWA help your business?
Application-like view
Let’s explore responsive web design and progressive web app design. Modern users tend to choose mobile apps instead of websites. Mobile applications have a great user experience, work offline, and have fancy interfaces. PWAs afford a great user experience by combining the look of a mobile app with the efficiency of a website. The design of a PWA is similar to that of a native application. Progressive web apps also provide a similar user experience to mobile apps, regardless of the approaches and tools used to build them. PWAs are fast and responsive, supporting database interactions and data automation. Search engines can index them and can find PWA pages.
Fast installation
Installing a PWA is faster than installing a regular app, improving the user experience. Users can download a PWA without visiting Google Play or the App Store. This simplifies things for the user and greatly reduces user abandonment. The desktop icon for a PWA appears right after downloading the application. Users can also access a progressive web application via the URL, making it easy to interact with the service.
Platform independence
Unlike apps that depend on operating systems and device hardware, progressive web applications work everywhere. A single application can satisfy the needs of many users and provide the same user experience on various devices. Progressive web apps are highly responsive to different formats and can adapt to any screen.
Offline functionality
The possibility to work offline makes PWAs more convenient than websites that require a constant internet connection. Another power of PWAs is a reliable caching mechanism to manage offline requests and send them when the connection is re-established. This allows businesses to provide better performance irrespective of connectivity. It also means that poor network or data connections are less likely to harm a brand, as users will always have access to the site.
No dependence on app distribution services
When comparing PWAs to mobile apps, we should talk about avoiding app distribution services. App marketplaces such as the App Store, Google Play, and the Microsoft Store place huge demands on apps. Problems often occur when attempting to submit a program to an app distribution service, and it can take time and effort to resolve issues. Also, these services can remove software without any warning. A PWA allows software owners to avoid troubles related to app distribution services.
Push notifications
Service workers in PWAs send push notifications. Push notifications engage users. They're what compels you to keep checking WhatsApp for new messages. We’re all aware of push notifications for native iOS and Android applications. But what about push notifications for a cross-platform website? With the presence of service workers, a native notification experience has become an easy reality for web apps. There’s a high probability that push notifications will attract users’ attention better than email newsletters, blog entries, or posts on social networks.
There are also some other crucial benefits of PWAs that you should consider:
- Enhanced security. PWAs rely on HTTPS to provide safe data transfer and minimize security issues.
- Better performance. PWAs efficiently cache and serve texts, images, and other content, which enables them to operate like websites and significantly improve their speed.
Real-life PWA use cases
- Twitter Lite saw a 65% increase in pages per session, a 75% increase in Tweets, and a 20% decrease in the bounce rate.
- Forbes’ progressive web application resulted in a 43% increase in sessions per user, increased viewership up to 20%, and prompted 100% more engagement.
- Lancôme’s PWA showed a 17% increase in conversions, a 51% increase in mobile sessions overall, and a 53% increase for iOS alone.
- Google found that progressive web app install banners convert approximately 5 times more often than native install banners.
- AliExpress increased their conversion rate by 104% for new users with their PWA compared to their traditional website and app.
Progressive web app example: LingUpp
Steelkiwi gained experience in PWA technology with the LingUpp project. LingUpp is an app for users who want to get practice in a foreign language or share their language knowledge with others. The app provides three main functionalities:
- Exchange languages — Users can exchange language knowledge via chat. For example, say you know English and someone knows French. You can help this person improve his English and he can help you develop your French.
- Practice one language together — Users can find a partner with which to practice a language they're both studying.
- View all results — Users can find other LingUppers, filtering by language, level, city, industry, age, and availability.
After finding a partner to communicate with on LingUpp, you can start chatting
A PWA improved the LingUpp user experience and reduced the total development time to about two and a half months. If we had provided native iOS and Android apps, it would have taken about four months. Today, LingUpp is available for all platforms.
With progressive web apps, you can increase website traffic, your conversion rate, engagement, and even page views while decreasing the bounce rate compared to mobile websites.
If you have any questions or want to develop a progressive web app, please contact us.
