rami-al-zayat-170349

blog

What are Progressive Web Apps?

In recent years, Google has placed an increased emphasis on the mobile user experience. Mobile traffic is reaching an all time high and it’s only said to be increasing even higher in the near future – that’s why Google is focused on improving the mobile UX more than ever.

However, it is not only about introducing Google AMP, or a controversial solution for mobile first index; Google went even further and introduced Progressive Web Apps (PWA) at the Chrome Dev Summit in 2015. It was a step towards enhancing traditional websites and mobile apps.

Initially, it wasn’t so popular but it changed over time. By 2016, PWAs were making great careers stand out from mobile websites around the world.

Let’s take a closer look at PWAs.

What is a Progressive Web App?

A progressive web application is a mix of a traditional website and mobile application. It takes what is best from the current development technology and combines it with UX and website performance. It works on different platforms in every modern browser. The combination of the best app and website makes a complete, progressive product which opens up various possibilities for site developers.

Let’s take a look at some of the most interesting technological advancements PWAs have to offer:

Push notifications
Web Application can inform you about a new message or update you on currently viewed content, etc. Push notifications increase user engagement, which makes the interaction between the content provider and user more valuable.

Background sync
The app can be updated in a background system when you don’t use it. It proves handy and useful, especially in places where your internet connection is slow or very poor. Later, waiting time for the required data is significantly shorter, all you need is already downloaded.

Offline Caching
Even if you are offline, a website allows you to enjoy some functionalities. You can use it without an internet connection and that is exactly why PWAs bring user experience to a higher level than traditional websites.

Add Homescreen
You can add the web application to your home screen without downloading and install it from the app store. From now on, you can open the application without the need to open it in a web tab e.g. Chrome or Opera. It makes it more accessible as you can open it directly from your home screen. Also, the app can be used in full screen mode which provides an even better user experience. It is then more accessible because you can open it immediately.

How does it work?

Progressive Web Apps are built in Application Shell. This type of architecture provides really fast loading by caching and dynamically displayed content. The secret is that the majority of data, the whole application and shell is downloaded only once and stored in the app cache. Content is the only variable displayed dynamically. This procedure maximizes the user experience and decreases requests/demand for data transfer. Amazing app performance results from the reduction of the data which needs to be downloaded. All those things finally lead to improved user satisfaction.

Source: https://developers.google.com/web/updates/2015/11/app-shell

Key advantages

According to Google’s PWA guidelines, Progressive Website Apps offer many benefits over traditional mobile pages, such as:

Progressive – works for every user, regardless of the browser,
Responsive – fits your mobile, desktop, tablet or any other device,
Connectivity independent – possible to work offline or on networks low in speed and quality,
App-like – app shell model provides app-style user navigation,
Fresh – always up-to-date thanks to its specification,
Save – SSL certificate provides security and integrity of downloading and uploading data,
Discoverable – are identifiable thanks to W3C manifests and service worker registration scope allowing search engines to find them,
Re-engageable – make re-engagement easy through features like push notifications,
Installable – allow users to “save” apps they find most useful on their mobile home screen without downloading from the app store,
Linkable – easily share via URL, without requiring a complex installation. Easy to share and use!

Sounds amazing. However, like any other new technology, it entails many complications and limitations, especially from a developer’s perspective. The PWA development, implementation, and debugging is a real challenge. But Google comes to the rescue!

Google created a complex checklist to help you with proper implementation. It contains a comprehensive list of potential problems and suggestions on how to solve them. Furthermore, you can find many helpful tools or plugins online.

Who uses Progressive Web Apps?

In 2016, many big players on the market decided to implement PWAs. In most cases it hit the bullseye! Why? The amazing thing is that marketing cost of user acquisition shrunk from 3-4 dollars to a few cents per user!

Obviously, convincing users to download an app from the store is difficult and expensive. The implementation of PWAs partially solves this problem and gives a new range of possibilities.

On the list  you can find a few well-known brands like TheWashingtonPostCNN or XING. Below you can see already implemented Progressive Web Apps:

If you want to know more about who implements PWAs in 2016 and what it results in, watch the whole presentation of Thao Tran (Global Product Partnership Leader @Google) during Chrome Dev Summit 2016 in Amsterdam. You can see the whole video below:

What does Progressive Web Apps mean for your SEO?

SEO specialists are facing a huge challenge because of Progressive Web Apps. How do you make all the available data crawlable by robots like GoogleBot? The answer is not so simple.

A PWA is using a JavaScript framework, which means that GoogleBot might crawl that site like any other page on the web based on JavaScript or AJAX. However, sometimes indexing such web pages cause a number of problems. SEO specialists and developers need to take into consideration all the pros and cons using this type of front-end technology. You need to remember how to optimize PWAs.

Like with many questionable issues, Google has recommended a few good practices during Progressive Web Apps indexation on its blog. You can read the whole Google article here.

Summary

Progressive Web Apps is a new trend in web development. This technology brings incredible results both for marketers and users. Efficient functioning together with an easy and fast access to the needed data, make it outstanding and very user- and publisher-friendly. All things considered, it’s likely to be the future of mobile websites and app development.

Published
  • 29 December 2016
Comments
Category
Wojtek-Murawski

See all articles by Wojciech Murawski

Did you like this article?

Why not share this article:

Be in the loop. Get fresh SEO and Content Marketing updates!

Thanks! We are happy to have you on our list!

Expect some tasty news from the Elephate team soon.

more blog posts

Back to Blog list