Blog

Here is the 411 on Progressive Web Apps

December 23, 2022

Posted by: DevDigital

Here is the 411 on Progressive Web Apps

In the digital world, you have three basic options for delivering information, entertainment, and marketing messages: websites, mobile apps, and progressive web applications (PWAs). That last option is currently the least common and probably the least understood, at least among non-technical people which tends to cause some confusion with terms that are somewhat similar but are quite different in terms of the logic and technology involved. This post serves to introduce the PWA and contrast it with the mobile app and how mobile-friendly websites work.

How Web and Mobile Apps Work

To understand what a progressive web app does, it helps to understand some of how a website delivers information. A responsive website detects the type of device an individual is using and serves up a properly formatted page, with one design for smartphones and another, more familiar type of layout for desktop and laptop users. A mobile app uses a graphical interface suited to a smartphone, but it cannot do much without internet access. A PWA is like a mobile app in a limited sense, except that it works offline.

A progressive web app offers a basic set of functions on any browser. Newer web browser variants offer new capabilities that older versions did not support. The “progressive” part of the name comes from how the app capitalizes on newer web browsers. In a sense, the PWA is an offline extension of the website it was built for. This is a very different development task from creating a Web app or a mobile phone app.

Native versus Cross Platform versus Web

Most people who use mobile apps know that they tend to be built for Android users or Mac iOS users. These are native apps, so-called because they are designed for a native software environment, usually either Apple’s operating system or Google’s. Each supports much the same functionality but coded in quite different ways. Therefore, you often see Apple and Android versions offered in app stores. A  cross-platform app works on more than one operating system. Developers must use a different strategy to create and test apps for cross-platform usage.

Web apps are just processes that you access and run on a website, so responsive design might be relevant, depending on the audience. A real estate web app might need a responsive design, but that has nothing to do with it being an app.

A responsive site “knows” that you are accessing it via a mobile phone and not a laptop or desktop so the pages you see are modified to be easier to read and scroll through on a small screen. In this age of almost universal mobile device use, your website needs to be responsive to reach people, but responsive design. If you build a web-based app it should be responsive, mobile-friendly, in other words.

What Makes a Web App a Progressive Web App

The main thing that distinguishes a progressive web app from a regular app is the ability to adapt and offer more functionality based on what a user’s web browser supports. But, PWAs have several additional features:

  • Discoverable by search engines
  • Installable, on the user’s mobile device
  • Capable of being used off-line
  • Able to receive push notifications from the app’s owner
  • At least as secure as a mobile app or a website protected by the HTTPS protocol
  • Can be linked to like a web page
  • Responsive design reformats content to suit different screen sizes

Some of the world’s largest and most famous companies have introduced PWAs. Starbucks launched an ordering PWA that can also serve up exclusive offers available at a nearby Starbucks. Pinterest, Spotify, BMW, and The Washington Post have also produced PWAs for different marketing purposes.

Examples of PWAs and Comparable Mobile Apps

Thousands of businesses use Web apps to serve customers or help employees do their jobs more efficiently. Some of those apps are PWAs. Here are two examples of corporate PWAs:

Starbucks – Their ordering system PWA allows users to order just as they would on the mobile app. If the phone is offline when the user creates their order, the PWA will connect them to a nearby Starbucks so they can complete their order.

Flipboard – This popular news aggregator was a mobile app, but now they offer a PWA that allows this tool to work offline as a news reader and, perhaps more importantly it now works on computer desktops not just Android and iOS mobile devices.

A fitness website may create a PWA that lets users enter certain fitness-related information and scores offline or online. When they can get online the website, which boasts a very sophisticated web-based app, could pull information from the user’s smartphone and push updates out to the user simultaneously. This is an effective way to let users compare themselves with other users and engage in some friendly competition even if they are offline or have a bad internet connection.

Cost and Other Considerations

PWAs are more expensive than responsive wWeb sites but less expensive than mobile apps. So, if you just want your information and offers to be more available to more people, pay for making your site responsive so it looks great and loads fast on tablets and smart phones. If you need more functionality in the future, a responsive site can be turned into a PWA because you are just working off the basic code that comprises that site.

App stores have a variety of listing rules, which change with time. A mobile app can be delisted for violating the rules, requiring rework, and possibly costing some customers. That app cannot be made into a PWA, but the site it connects with could be.

In summary, a progressive web app is an adaptable and downloadable program that runs offline and supplements the functionality a website offers. Mobile apps and responsive design fulfill distinct functions. If you would like to explore the possibility of creating a PWA, Web app, or mobile app, we encourage you to contact us and set up a brief discovery call.

Share this


Add Comment

Back