AMP vs. Progressive Web Apps: Which Is Right for Me?
With mobile-first indexing in full swing and the web being driven primarily by mobile searches, businesses can no longer afford to fall behind with their mobile web presence.
Separate mobile subdomains are now largely a thing of the past and ordinary responsive websites may be headed in that direction as well. Truth be told, the title of this article is a trick question. Accelerated Mobile Pages (AMP) and Progressive Web Apps (PWA) work hand in hand. It may be that your business can benefit from both.
A major benefit to using AMP is that you can improve load times on specific pages without having to redo your entire site. Simply create an AMP template for a given content type and use a rel=”amphtml” tag on the non-AMP version of the content to ensure that the AMP version is accessible to search engines. The AMP version then points back to the non-AMP version with a canonical tag.
Progressive Web Apps, on the other hand, create an app-like experience through the use of modern web features. As the name suggests, they use browser feature detection to implement progressive enhancement, ensuring compatibility across platforms. This assurance is increased by the use of responsive design, which allows PWAs to be used regardless of device form factor.
Despite providing an app-like experience, including the ability to be launched from the home screen of a mobile device, PWAs can be easily shared via an ordinary URL.
Best practices indicate avoiding the use of escaped fragments (URLs containing “#!” or “#”) in favor of the same type of clean URLs that would be used for any well-optimized webpage.
PWAs should also be crawlable in the same way that ordinary websites are crawlable. Google recommends the use of server-side rendering, where all dynamic content is computed prior to being served to the user. A hybrid rendering model can be used as well, where some amount of rendering occurs after the initial page load in the form of asynchronous requests. Client-side rendering should be avoided if at all possible. If hybrid rendering or client-side rendering are used, the History API should be used to help with navigation.
Several other considerations are required as well:
- PWAs should be secured via HTTPS.
- Service Workers should be implemented so that the app can work offline or over a poor connection.
- Canonicals should be used across all pages mirroring a piece of content.
- If an AMP version of a page exists, rel=”amphtml” should be implemented, just like it would be on a normal website.
Highly dynamic and interactive websites can benefit greatly from Progressive Web Apps. The benefits of PWAs are most noticeable when the focus is on user engagement and experience, rather than purely getting content to the user as quickly as possible. If your business model involves users coming back to interact with your site regularly, investing in the development of a PWA will be well worth your efforts.
As you contemplate whether moving forward with PWAs and AMP is right for you, some of Google’s case studies may serve as an inspiration. Both can be powerful tools to improve both site performance and user engagement, but you must be careful to implement them properly.
You May Find These Interesting
“Media and Marketing Can Lead The Way In Improving Representation For My Community”: Q&A With Sebastian Leacock, Organic Performance Manager at ForwardPMX
Representation matters — it’s hard to be what you can’t see. According to National Research Group’s 2020 #RepresentationMatters report, 2 in 3 Black Americans say they don’t see themselves or their culture represented on screen. This staggering statistic is yet...
2020 was a year that galvanized the e-commerce industry, with brands pushing through huge change for their online platforms as physical retail took blow-after-blow with the pandemic and lockdowns. As the dust settled on the end of 2020, e-commerce had grown to...
“A Clear Value In Seeing People Like Yourself in Higher Places”: Our Employees Share Their Experiences & Viewpoints on Representation
February in the United States marks Black History Month, a time to celebrate, immerse and educate ourselves about Black American culture and the contributions of so many Black Americans to our country. At FP, we continue our work cultivating an environment in which...