Google recognized early on that the future of the web was mobile. They also saw a trend in mobile users favoring native apps over traditional websites. A 2015 report published by Morgan Stanley pegged web traffic at roughly 2X that of native apps. Google needs to hold on to this advantage to remain relevant.

To do so, they have invested heavily in both creating and promoting technology designed to deliver a better mobile web search experience. The Progressive Web App is one of those technologies. The idea behind PWAs is to deliver fast, reliable and engaging app-like experience via mobile browser. Alex Russell, a Google software engineer, explains it this way: “Progressive Web Apps blur the line between Web content and apps, but they keep the strengths of the Web.”

How Does It Work?

Progressive Web Apps (PWAs) are designed to load “instantly.”  This is accomplished by routing browser requests through a script, known as a Service Worker. The script eliminates steps otherwise required to access certain features or information directly from a website. PWAs also utilize more parameters, capturing user behaviors and preferences so the app can deliver personalized messages or webpage content likely to be of interest to a defined user persona.

PWAs save an entire web page to a user’s local storage and place it in an app shell. The content is only updated as needed. A“Service Worker” serves all CSS stylesheets, images, JavaScript, pages, etc. Because most everything needed to render a page is stored locally, it delivers blazing fast performance.

Unlike native apps, PWAs are accessed from a browser. There is no downloading or installation involved. Progressive Web Apps, published online, are completely linkable. Another advantage is the app will work offline, utilizing cached data saved from previous online activity. Some have suggested that PWAs may ultimately replace the current generation of mobile websites.

Progressive Web App Checklist:

Google has put together a set of minimum standards, which they refer to as the baseline, for creating a PWA. There is also a Chrome extension to validate compliance. The checklist mandates:

1. Site is served over HTTPS
2. Pages are responsive on tablets & mobile devices
3. The start URL (at least) loads while offline
4. Metadata provided for Add to Home screen
5. First load fast, even on 3G
6. Site works cross-browser
7. Page transitions don’t feel like they block on the network
8. Each page has a URL

There is a supplemental checklist for the creation of “Exemplary Progressive Web Apps” which must be checked manually:

1. Site’s content is indexed by Google
2. org metadata is provided where appropriate
3. Social metadata is provided where appropriate
4. Canonical URLs are provided when necessary
5. Pages use the History API
6. Content doesn’t jump as the page loads
7. Pressing back from a detail page retains scroll position on the previous list page
8. When tapped, inputs aren’t obscured by the on-screen keyboard
9. Content is easily sharable from standalone or full-screen mode
10. Site is responsive across phone, tablet, and desktop screen sizes
11. Any app install prompts are not used excessively
12. The Add to Home Screen prompt is intercepted
13. First load very fast even on 3G
14. Site uses cache-first networking
15. Site appropriately informs the user when they’re offline
16. UI encouraging users to turn on Push Notifications must not be overly aggressive for at least a few days (for example, one week)
17. Site dims the screen when permission request is showing
18. Push notifications must be timely, precise, and relevant
19. Provides controls to enable and disable notifications
20. User is logged in across devices via Credential Management API
21. User can pay easily via native UI from Payment Request API

Advantages of Progressive Web Apps:

1. No Hardware Restrictions
2. Works like a Native Mobile App
3. Improved Performance
4. Push Notifications

Implications for SEO:

With the introduction of the mobile first index, it stands to reason that PWAs could now get favorable treatment in the SERPs IF they are both indexable and linkable. These pages are crawled the same as JavaScript or Ajax. Google has provided developers with a set of best practices to accomplish this, and yet another punch list to ensure that all bases are covered. This checklist explains both why and how to:

1. Make your content crawlable
2. Provide clean URLs
3. Specify canonical URLs
4. Design for multiple devices
5. Develop iteratively
6. Use progressive enhancement
7. Test with Search Console
8. Annotate with Schema.org structured data
9. Annotate with Open Graph & Twitter Cards
10. Test with multiple browsers
11. Measure page load performance

Flipkart, India’s largest e-commerce site, is frequently cited as a PWA success story. Upon launching their app, they experienced incredible improvement across several key metrics, including:

(i) Users’ time on site with Flipkart lite vs. previous mobile experience: 3.5 minutes vs 70 seconds.
(ii) 3x more time spent on site
(iii) 40% higher re-engagement rate
(iv) 70% greater conversion rate among those arriving via Add to Home screen
(v) 3x lower data usage

Source: Searchenginejournal

Peter Zmijewski is the founder and CEO at KeywordSpy.His expert knowledge on Internet Marketing practices and techniques has earned him the title “Internet Marketing Guru“ He is also an innovator, investor and entrepreneur widely recognized by the top players in the industry.