Mobile eCommerce- AMP or PWA? (Part II)

This post is broken in 2 parts…

Part I: Native vs PWA vs AMP

Part II: Can AMP and PWA be used together in a mobile-first eCommerce application?

PART II :

Can AMP and PWA be used together in a mobile-first eCommerce application?

Yes, this would make for an elegant user experience!

AMP-enabled result lead to a lightweight, pre-cached, instantly loading AMP webpage. While AMP pages can be used to rank high on search engines, once user clicks to open the AMP page it can initiate the PWA for user engagement and retention. Apps can thus engage the user with the PWA that gives an app-like experience, smooth transition even during a slow internet connection, facilitates push notifications and enables offline browsing of content and service.

Thus, creating separate AMP (landing) pages used for SERPs, post which the traffic is transferred to the PWA pages, proves to be a successful strategy for publishers.

Now let us review if our approach satisfies all points critical to eCommerce…

[1] Mobile-first Interface

Both AMP and PWA deliver mobile friendly web pages. While an AMP is designed to deliver fast and mobile-friendly web pages on the mobile, the PWA provisions the web pages for a native app-like experience.

[2] Enhanced User Acquisition & User Engagement

AMP landing pages can gouge users leading to a high success rate in acquiring users. Eventually the AMP links to the PWA for user engagement and retention. Various PWA features like social media integration, well-timed push notifications, home page access to the app, offline browsing, fast transition of pages, etc., lead to enhanced user engagement.

[3] Brand Building

Social media engagement can do wonders for any mCommerce app. PWAs using social media platforms to streamline user registration process for new users via their preferred social account, catalyses user acquisition. It also provides many meaningful ways for your online users to interact with your brand. Customers can share their reviews, wish list, products via social networks. Likes and Comments posted on products, services or on your store can also lead to higher brand visibility on social networks.

[4] Quick & Easy Checkout

This can be marked as the single most important process to any mCommerce app. The experience of purchasing items on the web hasn’t been as easy and streamlined until now. The native mobile app’s in-app purchase provides a uniform single user-experience for buying items across all apps on the iOS platform, likewise on the play store. This makes it easier for customers to buy items in-app, which eventually optimizes revenue generation for publishers of the app.

Using this native experience as a benchmark, the new Payment Request API was formed, and it stands tall as a contender in the bid to narrow the gap between native mobile apps and PWAs. It eliminates the friction of checkout forms and complicated workflows by providing a unified and consistent experience to collect and process user’s payment data.

[5] Analytics

Your PWA can be integrated with a comprehensive Analytics system to help optimize it for deeper engagement and better conversion, which ultimately translate into sales growth. With its unique offline-mode feature, a PWA can be more complicated to track its events than a normal web or mobile app. Popular analytics systems like Google Analytics, Firebase Analytics, Mixpanel, are now offering the capability to collect data regardless of internet condition. Just like other offline data, offline trackable events are also queued and sent to the system whenever the network is available.

Using a combination of AMP and PWA can further complicate the Analytics process. An important factor to be considered here is session stitching. Session stitching is the process of proper grouping of website visits and sessions that otherwise would not be connected.

Users can access AMP pages in three different ways. Google Search accesses the AMP page and displays it inside an AMP viewer. Then the AMP page can also be accessed from a proxy or a cache, much like a CDN. Lastly, the AMP page is directly accessed from the publisher’s domain. If this is not managed in our Analytics, our stats may end up incorrect and hence misleading. For example, a click to another page on the publisher’s site from an AMP page on Google search generates a referral into the publisher site and a new session instead of considering the click as the second interaction with the app in the same single session. This can mean incorrect interpretations such as larger session counts, higher bounce rates from the AMP page and lower session duration. Setting up AMP tracking involves Analytics code changes and Referral Exclusions. Once these changes are made, we can track the trail correctly in Google Analytics and the related metrics will become more accurate.

For details refer https://www.jeffbullas.com/session-stitching-in-google-analytics/

[6] Search Engine Optimization (SEO)

PWAs can be indexed by search engines, making great app-like experience accessible from the search results. Google’s mobile-first indexing is favorable for PWAs, boosting their serviceability.

• Provide canonical tag when serving content from various online sources to avoid duplication.
• Make use of Fetch as Google tool to test how Google index your PWA.
• Make sure the page doesn’t use fragmented identifiers (everything after the hash symbol in its URL) as Google will ignore them.
• Use Schema.org metadata that matches your page content to improve its appearance in search engines

As for AMP pages, Google Search indexes them to provide a fast, reliable experience. AMP page can be featured on mobile search as part of Google’s featured results and carousels. While AMP itself isn’t a ranking factor, speed is a ranking factor for Google Search and hence AMP pages indirectly enhance ranking.

On mobile search, the AMP icon helps users easily recognize these pages that load instantly and smoothly. Google Search retrieves AMP pages from the Google AMP Cache, that often make these pages appear instantly, as they use various load optimization techniques such as prerendering.

To Sum Up

PWA and AMP are two different technologies for the mobile-web. AMP gives instantly loading web pages and PWA provides the app-like behaviour, both useful for mCommerce apps.

Today, the Web is stronger than ever as a platform to build any app. If you need help designing your mCommerce app using PWA and/or AMP technologies, or if you want to learn more about them, do get in touch with us at Synsoft Global.

Go Back to Part I

Synsoft Global has a team of developers based in India who work remotely on projects for clients in countries like the USA, UK, Germany, UAE. We have the experience and the talent that has helped many American businesses streamline their software development process and improve their overall efficiency by swiftly hiring resources from us in India.