Conductor
Los geht's

Progressive Web Apps

Als Progressive Web Apps (kurz: PWA) werden hybride Websites bezeichnet, die Eigenschaften klassischer Smartphone Apps aufweisen, aber über einen Browser aufgerufen werden.

Diese Zwitter aus Website und App können von Google wie herkömmliche Websites indexiert werden. Zugleich lassen sich die Inhalte wie bei einer nativen App nutzen und sind plattformübergreifend verfügbar. PWA können in Zukunft eine wichtige Rolle bei der mobilen Optimierung spielen. Die Apps gehen auf eine Initiative von Google zurück.

Was sind Progressive Web Apps?

Progressive Web Apps (PWA) sind Apps, die über den Browser am Mobilgerät aufgerufen werden. Progressive Web Apps haben alle Vorteile von nativen Apps – müssen aber nicht erst installiert werden und sind einfacher zu erstellen, zu crawlen und zu besuchen.

Warum überhaupt Progressive Web Apps?

Website -Betreibende können ihre Inhalte mobilen Usern auf verschiedene Weise zur Verfügung stellen. So können sie ihre Website mobil optimieren und auf Responsive Web Design setzen. Dann sind alle Inhalte mit nahezu jedem Endgerät abrufbar, denn die Website passt sich an das Display und die Funktionen des jeweiligen Ausgabegeräts an. Andere Webmaster greifen auf native Apps zurück. Dabei handelt es sich um eigenständige Anwendungen, die über einen App Store (iOS, Android, Microsoft) auf einem Tablet oder Smartphone installiert werden. Diese nativen Apps beziehen ihre Inhalte zwar über das Web, sind aber geschlossene Systeme, in der Regel ohne direkte Anbindung über Suchmaschinen .

Google hat in den letzten Jahren auf die Tendenz hin zu geschlossenen Web-Systemen reagiert und zum Beispiel das App Indexing ermöglich. Damit können Links zu den URL innerhalb einer App erstellt und von Google indexiert werden. Verwenden User nun die Google-Suche, können Ergebnisse von Apps angezeigt werden, die sie auf seinem Handy bereits installiert haben. Möglich ist auch, dass ein Download der App als mobiles Suchergebnis angeboten wird.

Um den Zugang zu möglichst allen Web-Inhalten zu ermöglichen, hat Google die Initiative der Progressive Web Apps unterstützt. Diese Zwischenform aus App und Websites kommt Googles Auffassung von Progressive Enhancement entgegen. Das bedeutet, dass Websites nicht verschiedene Funktionen für verschiedene Endgeräte bieten müssen, sondern sich immer an den entsprechenden Client anpassen. Dazu gehört auch, dass Progressive Web Apps die Besonderheiten der mobilen Internet-Nutzung berücksichtigen sollten, ohne dass dafür eine eigenständige Anwendung installiert werden muss.

Progressive Web Apps sollen für User somit ermöglichen:

  • Inhalte auf allen möglichen Ausgabegeräten zu nutzen
  • Web-Inhalte auch bei schlechter oder nicht vorhandener Internet-Verbindung zu nutzen
  • Websites schnell zu laden
  • von einer sehr guten User Experience zu profitieren

Google definiert die wichtigsten Charakteristika der Progressive Web Apps folgendermaßen: PWA sind zuverlässig, denn sie laden Inhalte auch bei schlechter oder unzureichender Konnektivität. Die PWA sind zudem sehr schnell, da sie sofort auf die User-Eingaben reagieren. Stocken beim Seitenaufbau oder Scrollen ist somit kaum möglich. Schließlich bieten PWA eine optimale User Experience, die der User-Erfahrung mit nativen Apps ähnelt.

So funktionieren Progressive Web Apps

Die Basis, auf welcher Progressive Web Apps funktionieren, sind die „Service Worker“. Dabei handelt es sich um ein JavaScript. Es ermöglicht, dass Inhalte im Cache im Hintergrund geladen werden. Für diese Anwendung ist keine Internet-Verbindung nötig. Ein weiterer Vorteil der Service Worker besteht darin, dass es kaum oder keine Ladepausen beim Aufrufen einer weiteren Seite gibt.

Die Service Worker können noch mehr. Wenn eine Progressive Web App entwickelt wird, werden die Aufgaben der Service Worker definiert und als Skript hinterlegt. So lassen sich ganze Programmabläufe konfigurieren, die jeweils abhängig von bestimmten Ereignissen vordefinierte Ereignisse auslösen. Auf diese Weise ist es möglich, dass die PWA-Inhalte bereits vor dem Klick auf einen Link geladen hat.

Damit eine Progressive Web App mit jedem Browser funktioniert, wird die sogenannte Application Shell benötigt. Sie stellt sicher, dass eine mobile Ansicht der URL generiert wird und die App auf die Funktionalität des jeweiligen Browsers angepasst wird. Die Application Shell sorgt außerdem dafür, dass das Design der PWA der Optik einer nativen App ähnelt. Die App Shell ist demnach das Grundgerüst für die dynamisch geladenen Inhalte. Sie wird beim Aufruf der PWA in den Cache des Geräts geladen.

Die dritte wichtige Komponente der PWA ist das Web App Manifest. Dabei handelt es sich um eine JSON-Datei, die auf dem Server hinterlegt wird. Sie ermöglicht es Usern, die PWA nach dem Aufruf wie eine native App auf dem Endgerät abzuspeichern. Tatsächlich wird dabei nicht eine komplette Anwendung installiert wie bei einer nativen App, sondern lediglich das Grundgerüst in Form mindestens einer App Shell. Über das Web App Manifest kann ein Icon für das Abspeichern auf dem Homescreen hinterlegt werden. Außerdem lässt sich definieren, ob die App ohne oder im vorhandenen Browser geladen werden kann. Über das Skript könnte zudem das Aussehen oder die Funktionen der App beeinflusst werden. Möglich ist darüber hinaus, Push-Nachrichten an die User zu versenden. Diese Einstellung müssen User bei der „Installation“ der App jedoch erst bestätigen.

Was sind die Vorteile von Progressive Web Apps?

Progressive Web Apps bieten für Webmaster zahlreiche Vorteile:

  • Die Entwicklung von PWA ist deutlich kostengünstiger als native Apps.
  • Die Pflege der PWA ist mit einem geringeren Aufwand verbunden.
  • Updates können kontinuierlich erfolgen.
  • Die Bindung an App Stores ist nicht erforderlich. Webmaster können ihre PWA selbst promoten.
  • Die Inhalte der Progressive Web App können indexiert werden und somit ranken.
  • Es gibt keine Plattform-Beschränkung. Somit können User die Inhalte der PWA mit jedem möglichen mobilen Endgerät verwenden.
  • Web-Inhalte lassen sich bei nahezu jeder Verbindungsqualität nutzen.
  • Die Bindung der User an die eigenen Webinhalte wird durch die „Installation“ der PWA erhöht.

Hintergrund zur Progressive Web Apps

Dass gerade Google die Verwendung und Verbreitung von Progressive Web Apps fördert, ist nicht verwunderlich. Denn ein Großteil der mobilen Internet-Nutzung basiert auf der Verwendung von Smartphone Apps. Suchmaschinen wie Google haben in diesem Fall nur beschränkten Zugang zu User-Daten. Mit Progressive Web Apps bietet sich für Google und andere Suchmaschinen jedoch die Möglichkeit, auch bei der App-Nutzung an Daten zum User-Verhalten zu kommen. Zugleich ist denkbar, dass die PWA auch für die Anzeige von Google-Werbung genutzt werden können. Somit würde sich für Google ein zusätzlicher Absatzmarkt über PWA erschließen.

Bereit, das Potenzial deiner Website zu entfalten?

TrustRadius logo
G2 logo
SoftwareReviews logo