progressiveProgressive Web Apps (PWAs) allow to send push notifications or provide offline access to an app's content, just like native apps do. But unlike native apps, content in PWAs is accessible to search engines, so that the same online marketing strategies could be used for PWAs just like for traditional websites.

The term “Progressive Web App” comes from Google, hence there is support and belief in the technology from the search giant, while Apple still seems to be hesitant – although, with iOS 11.3, some features of the PWAs found their way into the iPhone and iPad. Nevertheless, for example, push messages can still not be sent - unlike Android - but it can be assumed that Apple is working on a solution. Anyway, Android dominates with a worldwide market share of almost 88%, hence, the prospects for PWAs look bright and they could be the next evolutionary stage on the Internet.

In short, PWAs are simply a good choice if you want to offer content in a user-friendly way that users work with on a regular basis, hence, find out how SEO for Progressive Web Apps (PWAs) works:

  • Essentials on PWA and SEO: For native apps, the app shop owners decide with their operating system updates on new features, while PWAs can use new features only if the browser used supports them. Google recommends Progressive Enhancement for discoverability of PWAs, meaning that web designers using this method separate information, features, and design, besides making sure that basic, important information is always available. Whether and which of the design and presentation elements, as well as functions, the user can see or use respectively, eventually decides the browser in use. And don’t forget to add a sitemap to your site and make sure you register it in the Google Search Console.
  • Use real URLs: Some PWAs use the # symbol in their URLs. The only problem is that the Google bots only read up to "#", and everything that follows doesn’t get indexed. Thus, follow SEO URL best practices by including keywords in the URL and keeping them short.
  • Don't block bots: Only what the Google bot knows, can be ranked, which is why it is important to grant proper access rights via the robot.txt. For example, frameworks, JavaScript resources and APIs should be fully accessible.
  • Use ‘Fetch as Google’ for websites: With the Fetch as Google feature, you can see how Google crawls and renders your PWA. On the help page, Google also provides a list of possible errors and how to fix them. For Chrome, there is in addition a very helpful extension called Lighthouse that can provide both detailed evaluations to SEO aspects and the PWA functionality itself.
  • Beware of JavaScript: PWAs usually contain a lot of JavaScript or are completely based on appropriate JavaScript frameworks. For a long time, Google and JavaScript haven’t been friends. And still today, Google bots have indeed improved in reading JS elements, but that can still lead to errors. For bots from other search engines and social networks, the situation is even more unclear, which is why international companies should keep an eye on other search engines such as Yandex and Baidu and their bots, too. Generally, a so-called server-side pre-rendering is considered a good solution, which means in principle that the pages are pre-rendered as static HTML and presented to the search engine. By the way, pre-rendered pages are not cloaking, as long as users and search engines end up getting the same content – so just ensure that the produced versions are the same.
  • Avoid duplicate content: A core idea of PWAs is adaptability in the sense of a progressively improving offer. Ideally, the PWA adapts to the browser and the device used and combines the app and website into a cross-device offering. However, some developers decide to offer the PWA only for smartphones and tablets, while continuing to run a desktop version of the website. If both projects use the same content, Google may evaluate that as duplicate content and devaluates one or both sides, so be careful. One solution is offered by canonical tags, which means simply putting “rel = canonical” in the header of the URL to avoid duplicate content. And as a rule of thumb, just remember that SEO for PWAs follows the same rules as websites: lean programming structures, fast loading times, good usability and user experience as well as high-quality content lead to good rankings.
  • Use Mobile First Responsive Design: PWAs were designed to be great on mobile, so be great there first and worry about desktop later. Since Google and everyone else focuses on mobile first, you should too

Anyway, from a purely technical perspective, PWAs don't help SEO, but help you build long lasting relationships with customers, and that makes the difference.

By Daniela La Marca